CODEWITHSUNDEEP
javascripthtml
sadaf2605
sadaf2605

Reputation: 7540

Update HTML form with Javascript while typing

I can update an HTML form using Javascript, when the user hits enter when on something on the form or when he triggers the onclick event on the "submit" button, but I want the form to be updated while the user is typing something.

I know that I can do Infinity loop, yet it is not a good idea; or I can check after intervals but it will cause unnecessary checking, which I don't want.

Upvotes: 3

Views: 3663

Answers (3)

matec
matec

Reputation: 1505

I had the same question and based on this post and sohel's answer I managed to get it working. Now I would like to share my solution in form of a short working example: If you type your name in the first field it will suggest an email address in the second one.

<!DOCTYPE html>
<html>
<head>
<script> 
function nameModify(emailElement, nameElement) {

        emailElement.value = nameElement.value + '@stackoverflow.com';
}
</script>
</head>
<body>
<form name="aform" action="#"> 
        <input type="text" name="name" onkeyup="nameModify(this.form.elements['email'], this);" >
        <input type="text" name="email" >
</form>
</body>
</html>

Upvotes: 2

sohel khalifa
sohel khalifa

Reputation: 5578

Use keyUp event handler with the input field contained within your form.

References: Javascript, jQuery

[UPDATE]

You missed round brackets at function definition, check the updated fiddle

Upvotes: 3

Sudipta Chatterjee
Sudipta Chatterjee

Reputation: 4670

You are looking for Autocomplete

Upvotes: 1

Related Questions