How to make two input fields that show the same data?

Question

So, I have one input field that needs to pop up elsewhere when the user changes the tab and presses a button, but I decided that throwing a div around would be too much trouble, so it’s possible to make two input fields instead, but they display same user input?

Or is there an easier way?

Answer 1

Try it. Of course, make sure it is on the DOM.ready() .

$('#input1').blur(function() {
    $('#input2').val( this.value );
});

• Use.blur() to run the code when the user leaves input1.
• .val(), input2 this.value of input1.

, , .

$('#input2').blur(function() {
    $('#input1').val( this.value );
});

---

: , , .

:

: http://jsfiddle.net/m3q4V/

<!-- In tab 1 -->
<input type="text" class="someClass" id="address_1" />
<input type="text" class="someClass" id="city_1" />
<input type="text" class="someClass" id="zip_1" />

<!-- In tab 2 -->
<input type="text" class="someClass" id="address_2" />
<input type="text" class="someClass" id="city_2" />
<input type="text" class="someClass" id="zip_2" />

JS:

$('.someClass').blur(function() {
    var parts = this.id.split('_'); // separate into parts, like 'address' and '2'
    var num = (parts[1] == 2) ? 1 : 2;  // invert the number between 1 and 2
      // build the selector with 'address' + '_' + '1'
    $('#' + parts[0] + '_' + num).val( this.value );
});

Answer 2

.

---

, , blur :

$('#textbox1_id').blur(function(){
   $('#textbox2_id').val(this.value);
});