Question

Trying to copy some user input from one HTML input to another and my console is showing an error: Uncaught TypeError: Object #<HTMLInputElement> has no method 'val'

Not sure what the issue is.. I thought that a text input does have a value? Thanks for your help!

HTML:

<input id="a" class="answer" type="text">
<input id="af" type="text" name="a">


$('.answer').bind('keypress', function(){
    var name  = $(this).attr('id'),
        feild = $('#' + name + 'f')[0];

    feild.val($(this).val());
});

Answer 1

Edit: As @zerkms pointed out, the [0] is not needed anyways, but since it’s sometimes useful to use array indices with selectors, I’ll leave this here so you understand the error.

Change:

field.val($(this).val());

to

$(field).val($(this).val());

Explanation: $('#' + name + 'f') gets an array of HTML elements that match the selector. Since you put [0] this gets the first HTML element in the array. Since field is a HTML element rather than a jQuery object, you need to convert it to a jQuery object using $(field) to use jQuery methods on it.