CODEWITHSUNDEEP
jquery
Sherif
Sherif

Reputation: 431

error messages were produced once only

i have the below jQuery code to check the start and end dates , but the error message shows once only and if the user changed the end date with any wrong values no error messages were produced. is there something i'm missing ? 

$('input[name="endDate"]').change(function(){
    var startDate=$('input[name="startDate"]');
    var endDate=$('input[name="endDate"]');
    var errorSpan= $('.errorSpan');
    $.ajax({
        url:'${createLink(controller:'empRef', action: 'checkServiceDatesAjax')}'   ,
        type:'POST' ,
        data:{startDate:startDate.val(), endDate:endDate.val()} ,
        success: function(XMLHttpRequest, textStatus, jqXHR) {

        },

        error: function(XMLHttpRequest,  textStatus,  errorThrown) { 
            errorSpan.html("&nbsp;&nbsp;&nbsp;&nbsp;<font color='red'>"+XMLHttpRequest.responseText+"</font>").fadeOut(5000);
            endDate.focus();

        }
    })

});

Upvotes: 0

Views: 20

Answers (1)

Petr Gazarov
Petr Gazarov

Reputation: 3811

This is because when you call fadeOut() on the error message container, it sets its display property to none. When you try to reuse the same element, it is already hidden. You can make it work by ensuring the element is visible before fading it out:

error: function(XMLHttpRequest,  textStatus,  errorThrown) { 
  errorSpan.html("&nbsp;&nbsp;&nbsp;&nbsp;<font color='red'>"+XMLHttpRequest.responseText+"</font>")
  errorSpan.show()
  errorSpan.fadeOut(5000);
  endDate.focus();
}

Upvotes: 1

Related Questions