Cyprich.com

Occasionally Relevant Insights from a Software Builder

By

How to Fix Multiline TextBox Word Wrap in Edge / IE 11

Internet Explorer 11 and Edge work in a different way with fixed width text boxes (see examples below) than previous versions earlier than 11. IE 11 and Edge inherits the white-space property from its parent. So, if text overflows in these browsers, it won’t wrap in the box.

HTML:

     <textarea rows="4" cols="50">Lots of text ...</textarea>

ASP.NET:

     <asp:TextBox ID="TextBox_Address" runat="server" Rows="5" TextMode="MultiLine"></asp:TextBox>

This can be fixed by applying the following CSS to the text box:

     white-space: pre-wrap

Now overflowing text will wrap in the box in all IE and Edge versions.

By

How to Copy Contents of HTML Textbox to Another

I recently made changes to a web form that populated a PDF through an XFDF file. In the new code, instead of outputting to an XFDF, the page outputs to an HTML file. Everything worked great, except the HTML page lacked one feature the PDF did. If you have 2 fields with the same name on a PDF, when you update one field, the other field automatically gets the same content. This naming trick won’t work in HTML.

The sample code below will copy the contents of a textbox to another textbox without using JavaScript. The updates occur during each key press. I’ve include examples in standard HTML and ASP.NET. The red text is the code you use to copy one textbox to another.

HTML:

<form name="aForm" action="" method="" />
  <input type="text" name="TextBox1" onkeyup="document.aForm.TextBox2.value = this.value" />
  <input type="text" name="TextBox2" />
 </form>

ASP.NET:

<asp:TextBox ID="TextBox1" runat="server" onkeyup="document.aForm.TextBox2.value = this.value"></asp:TextBox>
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>