Im looking for a way to wait to pop up the icon until the user is finished done typing. So what I am doing is an ajax call to the serve to check if the user name is registered through our system. If the username is registered it show a Red X, if it's not it shows a Green check mark. The problem is the icons show automatically when the user start typing. I believe its the .on keyup (event) ->
ready = ->
$('#invalid-username').hide()
$('#valid-username').hide()
$('#register-username').on 'keyup', (event) ->
$.ajax
url: '/username_validator?username=' + $('#register-username').val()
type: 'POST'
dataType: 'json'
error: (jqXHR, textStatus, errorThrown) ->
success: (data, textStatus, jqXHR) ->
if data.valid is true
$('#invalid-username').hide()
$('#valid-username').show()
console.log('valid')
else if data.valid is false
$('#valid-username').hide()
$('#invalid-username').show()
console.log('Invalid')
event.stopImmediatePropagation();
return false
return false
$(document).ready ready
$(document).on 'turbolinks:load', ready