Changing text in jquery using Asp.net

Question

I have 2 text fields, and if I write anythng in textbox1, it should immediately be reflected in text field2, and if I write anything in text field2, it should be reflected in text field1.

So how do I do this? I saw this article before and how to implement between two text fields?

http://www.zurb.com/playground/jquery-text-change-custom-event

Here are my text fields:

<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox> 

Answer 1

 $('#TextBox1').keydown(function(){ $('#TextBox2').val($(this).val()) }) $('#TextBox2').keydown(function(){ $('#TextBox1').val($(this).val()) }) 

Answer 2

 var $tbs = $("input[id^='TextBox']"); $tbs.keyup(function() { var that = this; $tbs.each(function() { $(this).val(that.value); }); }); 

Demo: http://jsfiddle.net/SGcEe/2/

Answer 3

The above method of referencing text fields will not work. ASP.NET generates some identifier for server controls.

To have a relatively clean solution. I suggest you add classes to text fields.

 <asp:TextBox ID="TextBox1" CssClass="textbox1" runat="server"></asp:TextBox> <asp:TextBox ID="TextBox2" CssClass="textbox2" runat="server"></asp:TextBox> 

The jquery code will look like this:

 $('.textbox1').keyup(function() { $('.textbox2').val($(this).val()); }); $('.textbox2').keyup(function() { $('.textbox1').val($(this).val()); }); 

You can see an example using vanilla html in jsfiddle: http://jsfiddle.net/HUFGD/

Answer 4

it can be a good trick

  $("input[id*='txtQty']").keyup(function (event) { var oldValue = event.target.defaultValue; var newValue = event.target.value; if (jQuery.trim(newValue) == "") { alert("Quantity can't be empty"); $("input[id*='txtQty']").val(oldValue); } });