HTML or Javascript or PHP solution: Textarea with Dynamic Width

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • Phil Powell

    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!

    Code:
    <textarea name="resume" cols="108" rows="29" wrap="physical><?=
    $resume ?></textarea>
    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
  • Eric B. Bednarz

    #2
    Re: HTML or Javascript or PHP solution: Textarea with Dynamic Width

    soazine@erols.c om (Phil Powell) writes:
    [color=blue]
    > 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![/color]

    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

    Comment

    • neur0maniak

      #3
      Re: HTML or Javascript or PHP solution: Textarea with Dynamic Width

      Phil Powell wrote:
      [color=blue]
      > 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!
      >
      >
      Code:
      > <textarea name="resume" cols="108" rows="29" wrap="physical><?=
      > $resume ?></textarea>
      >
      >
      > 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[/color]

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

      Comment

      • CryingClinton

        #4
        Re: HTML or Javascript or PHP solution: Textarea with Dynamic Width

        for sure, agree with "style='width:1 00%'"

        --
        Great domain names provide SEO, branding, and a memorable experience for your users. Get a premium domain today.

        "neur0mania k" <usenet@neur0ma niak.co.uk> ????
        news:40f87032$0 $92657$ed2619ec @ptn-nntp-reader02.plus.n et...[color=blue]
        > Phil Powell wrote:
        >[color=green]
        > > 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!
        > >
        > >
        Code:
        > > <textarea name="resume" cols="108" rows="29" wrap="physical><?=
        > > $resume ?></textarea>
        > >
        > >
        > > 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[/color]
        >
        > instead of using: cols="???"
        > try using: style="width:10 0%;"[/color]


        Comment

        • Christopher Finke

          #5
          Re: HTML or Javascript or PHP solution: Textarea with Dynamic Width

          "neur0mania k" <usenet@neur0ma niak.co.uk> wrote in message
          news:40f87032$0 $92657$ed2619ec @ptn-nntp-reader02.plus.n et...[color=blue]
          > Phil Powell wrote:[color=green]
          > > 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![/color]
          >
          > instead of using: cols="???"
          > try using: style="width:10 0%;"[/color]

          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


          Comment

          • Phil Powell

            #6
            Re: HTML or Javascript or PHP solution: Textarea with Dynamic Width

            Eric B. Bednarz <bednarz@fahr-zur-hoelle.org> wrote in message news:<m3eknbmtk 3.fsf@email.bed narz.nl>...[color=blue]
            > soazine@erols.c om (Phil Powell) writes:
            >[color=green]
            > > 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![/color]
            >
            > textarea
            > {
            > width: 100%;
            > }
            >
            >
            > Follow-up set. See also:
            >
            > <http://www.cs.tut.fi/~jkorpela/usenet/laws.html#law7>[/color]


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

            Phil

            Comment

            • Phil Powell

              #7
              Re: HTML or Javascript or PHP solution: Textarea with Dynamic Width

              neur0maniak <usenet@neur0ma niak.co.uk> wrote in message news:<40f87032$ 0$92657$ed2619e c@ptn-nntp-reader02.plus.n et>...[color=blue]
              > Phil Powell wrote:
              >[color=green]
              > > 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!
              > >
              > >
              Code:
              > > <textarea name="resume" cols="108" rows="29" wrap="physical><?=
              > > $resume ?></textarea>
              > >
              > >
              > > 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[/color]
              >
              > instead of using: cols="???"
              > try using: style="width:10 0%;"[/color]


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

              Phil

              Comment

              • Phil Powell

                #8
                Re: HTML or Javascript or PHP solution: Textarea with Dynamic Width

                "Christophe r Finke" <chris@efinke.c om> wrote in message news:<2lrkbbFga f1qU1@uni-berlin.de>...[color=blue]
                > "neur0mania k" <usenet@neur0ma niak.co.uk> wrote in message
                > news:40f87032$0 $92657$ed2619ec @ptn-nntp-reader02.plus.n et...[color=green]
                > > Phil Powell wrote:[color=darkred]
                > > > 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![/color]
                > >
                > > instead of using: cols="???"
                > > try using: style="width:10 0%;"[/color]
                >
                > 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[/color]

                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.i nnerWidth);
                else if (isIE && !isNav)
                return(document .body.clientWid th);
                else
                return(null);
                }

                var width = getWinWidth() / 4;
                document.writel n('<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

                Comment

                • Chris Morris

                  #9
                  Re: HTML or Javascript or PHP solution: Textarea with Dynamic Width

                  (followups trimmed to ciwah only)

                  soazine@erols.c om (Phil Powell) writes:[color=blue]
                  > The customer made a wild request: they want on their admin panel a
                  > textarea that will display an existing resume.[/color]

                  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:
                  [color=blue]
                  > 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![/color]

                  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.
                  [color=blue]
                  > <textarea name="resume" cols="108" rows="29" wrap="physical> <?=[/color]
                  ^
                  missing closing quote?
                  [color=blue]
                  > 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.[/color]

                  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

                  Comment

                  • Brian

                    #10
                    Re: HTML or Javascript or PHP solution: Textarea with Dynamic Width

                    Phil Powell wrote:
                    [color=blue]
                    > 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.i nnerWidth);
                    > else if (isIE && !isNav)
                    > return(document .body.clientWid th);[/color]

                    [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)

                    Comment

                    • /..

                      #11
                      Re: HTML or Javascript or PHP solution: Textarea with Dynamic Width

                      By 19 Jul 2004 07:02:32 -0700, soazine@erols.c om (Phil Powell)
                      decided to post
                      "Re: HTML or Javascript or PHP solution: Textarea with Dynamic Width" to
                      comp.lang.php:
                      [color=blue]
                      >neur0maniak <usenet@neur0ma niak.co.uk> wrote in message news:<40f87032$ 0$92657$ed2619e c@ptn-nntp-reader02.plus.n et>...[color=green]
                      >> Phil Powell wrote:
                      >>[color=darkred]
                      >> > 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!
                      >> >
                      >> >
                      Code:
                      >> > <textarea name="resume" cols="108" rows="29" wrap="physical><?=
                      >> > $resume ?></textarea>
                      >> >
                      >> >
                      >> > 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[/color]
                      >>
                      >> instead of using: cols="???"
                      >> try using: style="width:10 0%;"[/color]
                      >
                      >
                      >Sorry that totally failed in Mozilla Firefox 0.6, only showing a
                      >"super skinny no-width textarea".
                      >
                      >Phil[/color]

                      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 --

                      Comment

                      • Thomas 'PointedEars' Lahn

                        #12
                        Re: HTML or Javascript or PHP solution: Textarea with Dynamic Width

                        Phil Powell wrote:[color=blue]
                        > Eric B. Bednarz <bednarz@fahr-zur-hoelle.org> wrote in message news:<m3eknbmtk 3.fsf@email.bed narz.nl>...[/color]

                        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.
                        [color=blue][color=green]
                        >> soazine@erols.c om (Phil Powell) writes:[color=darkred]
                        >>> 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![/color]
                        >>
                        >> textarea
                        >> {
                        >> width: 100%;
                        >> }
                        >>
                        >>
                        >> Follow-up set. See also:
                        >>
                        >> <http://www.cs.tut.fi/~jkorpela/usenet/laws.html#law7>[/color]
                        >
                        > Completely failed in Mozilla Firefox 0.6, produces a textarea with "no
                        > width" whatsoever (it looks like a super-skinny textarea).[/color]

                        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.infosystem s.www.authoring.stylesheets

                        PointedEars

                        Comment

                        • Thomas 'PointedEars' Lahn

                          #13
                          Re: HTML or Javascript or PHP solution: Textarea with Dynamic Width

                          Phil Powell wrote:[color=blue]
                          > "Christophe r Finke" <chris@efinke.c om> wrote [...]:[color=green]
                          >> "neur0mania k" <usenet@neur0ma niak.co.uk> wrote [...]:[color=darkred]
                          >>> instead of using: cols="???"
                          >>> try using: style="width:10 0%;"[/color]
                          >>
                          >> 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.
                          >> [...][/color]
                          >
                          > Following was what I attempted, with horrific failure:[/color]

                          Which does not make me wonder why.
                          [color=blue]
                          > <script type="text/javascript">[/color]

                          OK.
                          [color=blue]
                          > <!--[/color]

                          Obsolete.
                          [color=blue]
                          > function getWinWidth() {
                          > var isNav = (document.all) ? false : true;
                          > var isIE = (document.all) ? true : false;
                          > if (isNav && !isIE)
                          > return(window.i nnerWidth);
                          > else if (isIE && !isNav)
                          > return(document .body.clientWid th);
                          > else
                          > return(null);
                          > }[/color]

                          Nonsense. Test exactly for the properties you want to use, not
                          something else: <http://pointedears.de/scripts/test/whatami>
                          [color=blue]
                          > var width = getWinWidth() / 4;[/color]

                          Not required. Use CSS.
                          [color=blue]
                          > document.writel n('<textarea rows="29" name="resume" cols="' +
                          > width + '">');[/color]

                          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 "</": "<\/".
                          [color=blue]
                          > //-->[/color]

                          Obsolete.
                          [color=blue]
                          > </script>
                          > <noscript>
                          > <textarea rows="29" name="resume" cols="120"
                          > style="{width:1 00%}">[/color]
                          ^ ^[color=blue]
                          > blah blah blah this is my resume
                          > </textarea>
                          > </noscript>[/color]

                          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.
                          [color=blue]
                          > 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![/color]

                          BAD. Borken as designed.


                          Removed alt.* from the crosspost,
                          X-Post & F'up2 comp.infosystem s.www.authoring.misc

                          PointedEars

                          Comment

                          Working...