473,404 Members | 2,179 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,404 software developers and data experts.

HTML or Javascript or PHP solution: Textarea with Dynamic Width

The customer made a wild request: they want on their admin panel a
textarea that will display an existing resume.

This textarea, however, must have a dynamic width, one that "fills the
screen width of any sized screen". Sorry but I cannot fathom how to
do this!

Expand|Select|Wrap|Line Numbers
  1. <textarea name="resume" cols="108" rows="29" wrap="physical><?=
  2. $resume ?></textarea>
  3.  
How on earth do I do this? cols="???"

Is there either a client-side solution in HTML or Javascript, or will
I have to use a server-side solution in PHP? I'm completely stuck and
under a Monday AM deadline to come up with a solution.

Thanx
Phil
Jul 17 '05 #1
12 2524
so*****@erols.com (Phil Powell) writes:
This textarea, however, must have a dynamic width, one that "fills the
screen width of any sized screen". Sorry but I cannot fathom how to
do this!


textarea
{
width: 100%;
}
Follow-up set. See also:

<http://www.cs.tut.fi/~jkorpela/usenet/laws.html#law7>
--
| ) 111010111011 | http://bednarz.nl/
-(
| ) Distribute me: http://binaries.bednarz.nl/mp3/aicha
Jul 17 '05 #2
Phil Powell wrote:
The customer made a wild request: they want on their admin panel a
textarea that will display an existing resume.

This textarea, however, must have a dynamic width, one that "fills the
screen width of any sized screen". Sorry but I cannot fathom how to
do this!

Expand|Select|Wrap|Line Numbers
  1.  <textarea name="resume" cols="108" rows="29" wrap="physical><?=
  2.  $resume ?></textarea>
  3.  

How on earth do I do this? cols="???"

Is there either a client-side solution in HTML or Javascript, or will
I have to use a server-side solution in PHP? I'm completely stuck and
under a Monday AM deadline to come up with a solution.

Thanx
Phil


instead of using: cols="???"
try using: style="width:100%;"
Jul 17 '05 #3
for sure, agree with "style='width:100%'"

--
www.vicdir.com
"neur0maniak" <us****@neur0maniak.co.uk> ????
news:40***********************@ptn-nntp-reader02.plus.net...
Phil Powell wrote:
The customer made a wild request: they want on their admin panel a
textarea that will display an existing resume.

This textarea, however, must have a dynamic width, one that "fills the
screen width of any sized screen". Sorry but I cannot fathom how to
do this!

Expand|Select|Wrap|Line Numbers
  1.  > <textarea name="resume" cols="108" rows="29" wrap="physical><?=
  2.  > $resume ?></textarea>
  3.  > 

How on earth do I do this? cols="???"

Is there either a client-side solution in HTML or Javascript, or will
I have to use a server-side solution in PHP? I'm completely stuck and
under a Monday AM deadline to come up with a solution.

Thanx
Phil


instead of using: cols="???"
try using: style="width:100%;"

Jul 17 '05 #4
"neur0maniak" <us****@neur0maniak.co.uk> wrote in message
news:40***********************@ptn-nntp-reader02.plus.net...
Phil Powell wrote:
This textarea, however, must have a dynamic width, one that "fills the
screen width of any sized screen". Sorry but I cannot fathom how to
do this!


instead of using: cols="???"
try using: style="width:100%;"


Actually, cols is a required attribute of a textarea. You must provide a
value, but using 'style="width: 100%;"' will override the cols setting for
the width of the textarea.

Chris Finke
Jul 17 '05 #5
Eric B. Bednarz <be*****@fahr-zur-hoelle.org> wrote in message news:<m3************@email.bednarz.nl>...
so*****@erols.com (Phil Powell) writes:
This textarea, however, must have a dynamic width, one that "fills the
screen width of any sized screen". Sorry but I cannot fathom how to
do this!


textarea
{
width: 100%;
}
Follow-up set. See also:

<http://www.cs.tut.fi/~jkorpela/usenet/laws.html#law7>

Completely failed in Mozilla Firefox 0.6, produces a textarea with "no
width" whatsoever (it looks like a super-skinny textarea).

Phil
Jul 17 '05 #6
neur0maniak <us****@neur0maniak.co.uk> wrote in message news:<40***********************@ptn-nntp-reader02.plus.net>...
Phil Powell wrote:
The customer made a wild request: they want on their admin panel a
textarea that will display an existing resume.

This textarea, however, must have a dynamic width, one that "fills the
screen width of any sized screen". Sorry but I cannot fathom how to
do this!

Expand|Select|Wrap|Line Numbers
  1.  > <textarea name="resume" cols="108" rows="29" wrap="physical><?=
  2.  > $resume ?></textarea>
  3.  > 

How on earth do I do this? cols="???"

Is there either a client-side solution in HTML or Javascript, or will
I have to use a server-side solution in PHP? I'm completely stuck and
under a Monday AM deadline to come up with a solution.

Thanx
Phil


instead of using: cols="???"
try using: style="width:100%;"

Sorry that totally failed in Mozilla Firefox 0.6, only showing a
"super skinny no-width textarea".

Phil
Jul 17 '05 #7
"Christopher Finke" <ch***@efinke.com> wrote in message news:<2l************@uni-berlin.de>...
"neur0maniak" <us****@neur0maniak.co.uk> wrote in message
news:40***********************@ptn-nntp-reader02.plus.net...
Phil Powell wrote:
This textarea, however, must have a dynamic width, one that "fills the
screen width of any sized screen". Sorry but I cannot fathom how to
do this!


instead of using: cols="???"
try using: style="width:100%;"


Actually, cols is a required attribute of a textarea. You must provide a
value, but using 'style="width: 100%;"' will override the cols setting for
the width of the textarea.

Chris Finke


Following was what I attempted, with horrific failure:

[SCRIPT]
<script type="text/javascript">
<!--

function getWinWidth() {
var isNav = (document.all) ? false : true;
var isIE = (document.all) ? true : false;
if (isNav && !isIE)
return(window.innerWidth);
else if (isIE && !isNav)
return(document.body.clientWidth);
else
return(null);
}

var width = getWinWidth() / 4;
document.writeln('<textarea rows="29" name="resume" cols="' +
width + '">');
//-->
</script>
<noscript>
<textarea rows="29" name="resume" cols="120" style="{width:
100%}">
blah blah blah this is my resume
</textarea>
</noscript>

[/SCRIPT]

What results is that you will see a textarea with someone's resume and
you will also physically see the <noscript> and <textarea> tags INSIDE
the textarea!

Phil
Jul 17 '05 #8
(followups trimmed to ciwah only)

so*****@erols.com (Phil Powell) writes:
The customer made a wild request: they want on their admin panel a
textarea that will display an existing resume.
Does it actually have to be a textarea? If the content doesn't need to
be edited then resubmitted you could fake it with <pre> and some
stylesheets. Otherwise, though:
This textarea, however, must have a dynamic width, one that "fills the
screen width of any sized screen". Sorry but I cannot fathom how to
do this!
Not reliably possible. Probably not desirable in all circumstances
either. Consider when the browser window is narrower than the screen
width. Even assuming they meant canvas width, on a really wide screen
this is going to look silly and possibly do strange things with line
wrapping.
<textarea name="resume" cols="108" rows="29" wrap="physical><?= ^
missing closing quote?
Is there either a client-side solution in HTML or Javascript, or
will I have to use a server-side solution in PHP? I'm completely
stuck and under a Monday AM deadline to come up with a solution.


Tell them it's not possible [1,2] and just put in a large (cols="80"?)
textarea.

[1] Silly Alternative 1: If you're given enough time (years) and
funding (thousands, millions, etc) you could get the next versions of
every browser to support the CSS trick you were shown, I suppose.

[2] Silly Alternative 2: Say that w3m is your only supported
browser. It opens an external editing program for textareas, which
gets around this problem.

--
Chris
Jul 17 '05 #9
Phil Powell wrote:
Following was what I attempted, with horrific failure:

[SCRIPT]
<script type="text/javascript">
<!--

function getWinWidth() {
var isNav = (document.all) ? false : true;
var isIE = (document.all) ? true : false;
if (isNav && !isIE)
return(window.innerWidth);
else if (isIE && !isNav)
return(document.body.clientWidth);


[snip]

This looks all too complicated. What are you trying to do with it? Why
are you querying the window width?

I didn't try to figure it all out. But did you try the css solution
without the js? I've sucessfully adjusted the width of a <textarea>
using css.

This has nothing to do with HTML that I can see, and nothing to do
with PHP. You've cross-posted to so many groups, I don't know which
one you normally read. Please trim x-posting, and set followups. There
is no need to add noise to groups where this post is off-topic.

--
Brian (remove ".invalid" to email me)
http://www.tsmchughs.com/
Jul 17 '05 #10
/..
By 19 Jul 2004 07:02:32 -0700, so*****@erols.com (Phil Powell)
decided to post
"Re: HTML or Javascript or PHP solution: Textarea with Dynamic Width" to
comp.lang.php:
neur0maniak <us****@neur0maniak.co.uk> wrote in message news:<40***********************@ptn-nntp-reader02.plus.net>...
Phil Powell wrote:
> The customer made a wild request: they want on their admin panel a
> textarea that will display an existing resume.
>
> This textarea, however, must have a dynamic width, one that "fills the
> screen width of any sized screen". Sorry but I cannot fathom how to
> do this!
>
>
Expand|Select|Wrap|Line Numbers
  1.  > <textarea name="resume" cols="108" rows="29" wrap="physical><?=
  2.  > $resume ?></textarea>
  3.  > 
>
> How on earth do I do this? cols="???"
>
> Is there either a client-side solution in HTML or Javascript, or will
> I have to use a server-side solution in PHP? I'm completely stuck and
> under a Monday AM deadline to come up with a solution.
>
> Thanx
> Phil


instead of using: cols="???"
try using: style="width:100%;"

Sorry that totally failed in Mozilla Firefox 0.6, only showing a
"super skinny no-width textarea".

Phil


Mozilla Firefox 0.6 is pretty old. My current version loaded is 0.92.
There may be a bug or other lack of proper handling of the textarea or css
width value for it in that older version. Suggest you upgrade client
version, and test on other clients as well. The intended behavior is
fairly standard among recent browsers.

/ts

--

find / -iname "*gw*" -exec rm -rf {} \;

In heaven, there is no beer,
That's why we drink it here,
And when we're all gone from here,
Our friends will be drinking all the beer!
-- Famous old Czech song about beer --
Jul 17 '05 #11
Phil Powell wrote:
Eric B. Bednarz <be*****@fahr-zur-hoelle.org> wrote in message news:<m3************@email.bednarz.nl>...


Please do not write attribution novels. Duplicating header information
other than the name of the previous poster(s) serves no greater good but
instead makes discussions less legible.
so*****@erols.com (Phil Powell) writes:
This textarea, however, must have a dynamic width, one that "fills the
screen width of any sized screen". Sorry but I cannot fathom how to
do this!


textarea
{
width: 100%;
}
Follow-up set. See also:

<http://www.cs.tut.fi/~jkorpela/usenet/laws.html#law7>


Completely failed in Mozilla Firefox 0.6, produces a textarea with "no
width" whatsoever (it looks like a super-skinny textarea).


Always W('d)FM, so you should post the relevant snippet along with
the exact Firefox version you have tested with (see Help, About ...;
0.9.x is current, BTW) to the *one* right newsgroup.

And have you even understood the document the above URL refers to?
Please learn how to avoid crossposting as Google Groups is incapable
of obeying Followup-To (i.e. setting the target newsgroup to the one
that was specified in the Followup-To header of the posting one
replies to). Or simply use newsreader software which allows you to
get rid of the other Google Groups' flaws. I recommend Mozilla
Thunderbird, see <http://www.mozilla.org/products/thunderbird/>.
Removed alt.* from the crosspost (do not crosspost over main
hierarchies!), X-Post & F'up2 comp.infosystems.www.authoring.stylesheets

PointedEars
Jul 17 '05 #12
Phil Powell wrote:
"Christopher Finke" <ch***@efinke.com> wrote [...]:
"neur0maniak" <us****@neur0maniak.co.uk> wrote [...]:
instead of using: cols="???"
try using: style="width:100%;"
Actually, cols is a required attribute of a textarea. You must provide a
value, but using 'style="width: 100%;"' will override the cols setting for
the width of the textarea.
[...]


Following was what I attempted, with horrific failure:


Which does not make me wonder why.
<script type="text/javascript">
OK.
<!--
Obsolete.
function getWinWidth() {
var isNav = (document.all) ? false : true;
var isIE = (document.all) ? true : false;
if (isNav && !isIE)
return(window.innerWidth);
else if (isIE && !isNav)
return(document.body.clientWidth);
else
return(null);
}
Nonsense. Test exactly for the properties you want to use, not
something else: <http://pointedears.de/scripts/test/whatami>
var width = getWinWidth() / 4;
Not required. Use CSS.
document.writeln('<textarea rows="29" name="resume" cols="' +
width + '">');
The "textarea" element requires a close tag which is missing here.
If you would include it, you would be required to escape the ETAGO
delimiter "</": "<\/".
//-->
Obsolete.
</script>
<noscript>
<textarea rows="29" name="resume" cols="120"
style="{width:100%}"> ^ ^ blah blah blah this is my resume
</textarea>
</noscript>
You do not require scripting, so you do not require the "noscript"
element. But if you would, the "style" attribute's syntax would
have not been matched. You may want to learn about style sheets,
among other things.
What results is that you will see a textarea with someone's resume and
you will also physically see the <noscript> and <textarea> tags INSIDE
the textarea!


BAD. Borken as designed.
Removed alt.* from the crosspost,
X-Post & F'up2 comp.infosystems.www.authoring.misc

PointedEars
Jul 17 '05 #13

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

4
by: dmiller23462 | last post by:
I'm trying to create a submission page for users to request PC/LAN Access....If they select "Yes" in the field asking about if they need Non Standard Software, I want several other HTML fields to...
12
by: Phil Powell | last post by:
The customer made a wild request: they want on their admin panel a textarea that will display an existing resume. This textarea, however, must have a dynamic width, one that "fills the screen...
19
by: dmiller23462 | last post by:
Hi guys....I have absolutely NO IDEA what I'm doing with Javascript but my end result is I need two text boxes to stay hidden until a particular option is selected....I've cobbled together the...
1
by: since | last post by:
I figured I would post my solution to the following. Resizable column tables. Search and replace values in a table. (IE only) Scrollable tables. Sortable tables. It is based on a lot...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
0
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.