locked
how do I make text wrap to the next line in a textbox with textmode set to multi-line? RRS feed

  • Question

  • User-858993849 posted

    I am trying to get text in a text box to wrap and also increase the size of the textbox as the text wraps to the next line.  How do I do that?

    Thanks,

    Monday, October 14, 2019 5:52 PM

All replies

  • User283571144 posted

    Hi  JAYHAWKER,

    I am trying to get text in a text box to wrap and also increase the size of the textbox as the text wraps to the next line.  How do I do that?

    According to your description, I suggest you could try to use jquery to achieve your requirement. You could set a certain width, get the height of the start position of the textbox, and use the size of the font instead of the added height.

    More details, you could refer to below codes:

    <script src="Scripts/jquery-1.10.2.min.js"></script>
        <style>
            #message-box {
                resize: none;
                width: 400px;
                min-height: 100px;
                padding: 5px;
                overflow: hidden;
                box-sizing: border-box;
    }
        </style>
        <script>
            $(document).ready(function () {
                $("#message-box").on('input', function () {
                    var scroll_height = $("#message-box").get(0).scrollHeight;
                    $("#message-box").css('height', scroll_height + 'px')
                });
            })
        </script>
    
    
        <form id="form1" runat="server">
            <div id="divTable">
                <textarea id="message-box"></textarea>
            </div>
        </form>
    

    Result:

    Best Regards,

    Brando

    Tuesday, October 15, 2019 6:21 AM
  • User-2054057000 posted

    You can use Autosize jquery plugin which is a small, stand-alone script to automatically adjust textarea height.

    Take a look to - https://www.jacklmoore.com/autosize/

    Tuesday, October 15, 2019 6:27 AM