CODEWITHSUNDEEP
jquery
seoppc
seoppc

Reputation: 2824

jquery copy content to another text box

I have the following 2 fields in my large form...

 <p><input type="text" name="name" id="proname" value="" /></p>  
 <p><input type="text" name="var" id="provarname" value="" /></p>

I want #provarname to get the value live automatically from #proname, for example if we enter Design watch in #provarname, same time #provarname should get value design-watch(small letters and space replaced with -) , and i have written following jquery code which is not working in same manner...

$(document).ready(function() {
    $('#proname').live('change',function() {
        var pronameval = $(this).val();
        $('#provarname').val(pronameval.replace(' ', '-'));
    });
});

Upvotes: 0

Views: 1357

Answers (4)

AR.
AR.

Reputation: 1955

Add toLowerCase if you want it all in lowercase

var pronameval = $(this).val().toLowerCase();

And use keyup as been said already

Upvotes: 0

Selvakumar Arumugam
Selvakumar Arumugam

Reputation: 79850

  1. Use regEx replace using g so it does replace all.
  2. Use keyup instead of change, change will be triggered onblur of the textbox.

Change your function as below,

DEMO here

$('#proname').live('keyup',function() {
    var pronameval = $(this).val();
    $('#provarname').val(pronameval.replace(/ /g, '-').toLowerCase());
});

Upvotes: 0

seoppc
seoppc

Reputation: 2824

As per suggestion by T.stone, the final code would be...

$(document).ready(function() {
    $('#proname').live('keyup',function() {
        var pronameval = $(this).val();
        $('#provarname').val(pronameval.replace(' ', '-').toLowerCase());
    });
});

which is working fine.

Upvotes: 0

T. Stone
T. Stone

Reputation: 19495

Try changing the event from change to keydown.

Upvotes: 1

Related Questions