Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    Regular Coder
    Join Date
    Mar 2007
    Location
    Quebec
    Posts
    261
    Thanks
    6
    Thanked 7 Times in 7 Posts

    Text area cramping my style

    Hi,

    I've got a problem with text area's. Specifically the way they handle text. My problem is that I can't find a good way for the text in a text area to automatically switch to a new line after a certain length is met, and keep proper formatting.

    Say I've got a normal text area
    Code:
    <textarea></textarea>
    when typing into that, the text goes on and on and on and on and on... always augmenting the horizontal scrollbar. I found a property called WRAP and it wraps the text to the width of the text area, which is fine and dandy. However, when submitted and stored in the database, the text keeps the style of the text area.

    I've got a text box 300px wide. The page for my site is let's say 500px wide.
    I type into the text area, and at the end of 300px a new line is automatically created. When I submit the form, the data is kept in the db. However, it keeps its 300px width. When the info is recalled from the db to be displayed on my 500px wide page, it's formatted as 300px wide when I want it to fill the full width of the page.

    So what I'm looking for is a method that after 300px or x amount of length, the text area will automatically move to a new line BUT when it's called back from the database, it will fill the full page. Am I making sense?

    Perhaps it would be clearer with the real example.
    http://www.ridemtl.com/articles/view/3/

    See there, the text doesn't fill the whole page?

    I'm trying to think/find a Javascript solution, but I'm not experienced with JS so I haven't turned anything up. Perhaps something with the on.keydown function will work

    Thanks
    -CMC
    Last edited by fl00d; 05-18-2008 at 04:47 AM. Reason: Typo's!

  • #2
    Regular Coder FWDrew's Avatar
    Join Date
    Apr 2008
    Location
    Missouri
    Posts
    380
    Thanks
    38
    Thanked 45 Times in 43 Posts
    Hi fl00d

    I've got a problem with text area's. Specifically the way they handle text. My problem is that I can't find a good way for the text in a text area to automatically switch to a new line after a certain length is met, and keep proper formatting.
    Have you tried this to make the length of the textarea a certain length and height?
    Code:
    <textarea rows="5" cols="40">
    Just adjust the above numbers as you see fit.

    I am not sure I understand the second part of your question, but assuming you are writing input to a db and then including it on a certain part of the page...can you not use CSS to adjust the width of the included text?

    Best Regards,

    Drew

  • #3
    Regular Coder
    Join Date
    Mar 2007
    Location
    Quebec
    Posts
    261
    Thanks
    6
    Thanked 7 Times in 7 Posts
    Hi,

    Thanks for replying I do have the width and height properties set, but even with that, the scroll bar continues on and on. Only when I set the WRAP propery does it adjust to a new line. However, with the WRAP attribute in place, it doesn't show up on the page properly (as shown in the example).

    The CSS for the page is set correctly, but the text comes out pre-formatted. That's the problem I'm having

    Have I made it any clearer? Reading over my previous post, it is pretty confusing and unclear.

  • #4
    Regular Coder mjlorbet's Avatar
    Join Date
    Jan 2008
    Location
    Milwaukee, WI
    Posts
    724
    Thanks
    8
    Thanked 96 Times in 95 Posts
    the problem you're having with your text being broken like that can be fixed with something as simple as

    Code:
     
    public string doProperFormat(string myText){
        return "<div style='width:500px; overflow:hidden;'>" + myText.replace("<br />", "") + "</div>";
    }
    if you're using c# anyways, it's not that your text is formatted to 300px, just that it's including literal line breaks (br) where the 300px theoretical max for input would be in say an wysiwyg html editor. as far as the textarea not displaying correctly when wrap is set, an example would be really helpful, especially since if a display problem is generated by setting the wrap attribute, there is more than likely a way to use css to compensate for the layout change it creates. posting the code for the page that contains the text area would work just as well.
    -Mike
    "Want me to precludify him, like some kind of dispatcherator?... Can do!" -Bender

  • #5
    Regular Coder mjlorbet's Avatar
    Join Date
    Jan 2008
    Location
    Milwaukee, WI
    Posts
    724
    Thanks
    8
    Thanked 96 Times in 95 Posts
    by the way, if you're looking to actually be able to include line breaks that in your code (after applying my suggestion above) you can simply add a token that indicates line break and replace it to <br /> after replacing the regular br s. or, you can just put a blank line in between paragraphs and use a lil trick like this

    Code:
     
    .replace("<br /><br />", "{line break}").replace("<br />", "").replace("{line break}", "<br /><br />")
    to keep double line breaks, but remove single ones. just throwin it out there
    -Mike
    "Want me to precludify him, like some kind of dispatcherator?... Can do!" -Bender


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •