Is it possible to check the form field values dynamically with javascript only. For example if I have form field for username and when the user enters their chosen username it checks whether this username is available and pops up an alert box or shows a message on the screen based on the result.
all of this is done without clicking any button. and the data is stored in an array.
Thanks in advance. Im trying to achieve this only by using javascript.
var username = document.getElementById('username');
var goBtn = document.getElementById('check');
var output = document.getElementById('output');
var usernames = ['bob', 'sally', 'alice', 'roy', 'kate', 'phil'];
function showResult() {
output.innerHTML = usernames.join(', ');
}
function checkUsername() {
if (usernames.indexOf(username.value) < 0) {
usernames.push(username.value);
username.value = '';
} else {
alert('That username is already taken. Try again.');
}
showResult();
}
goBtn.onclick = checkUsername;
showResult();<label for="username">Name:</label>
<input id="username" name="username" placeholder="username">
<button id="check">Go</button>
<div id="output"></div>may be this is what you want
// usernameArray contains all the usernames that can't be used
var usernameArray = ['username1','username2','username3'];
// i'm using .kyup() method to get a dynamic result so whenever the user type a letter or
// something else (just one caracter) we check that value against our usernameArray list
$('#username').keyup(function(){
var value = $(this).val();
if(usernameArray.indexOf(value) >= 0){
alert('sorry, try another username ');
}else{
alert('good, you can use this username it is available');
}
});
