Server Click event is not firing after client click event return true in asp.net

Question

I am creating a website and use a popup for exporting grid data to excel sheet but I have trouble I have created a javascript method and call it on client click of asp.net here is my function

<script>
    function change() {

        $.ajax({
            type: "POST",
            contentType: "application/json; charset=utf-8",
            url: "Store/ViewStock.aspx/CountStock",
            data: "{'fromDate':'" + $('#<%= txtFromDate.ClientID%>').val() + "', 'ToDate':'" + $('#<%= txtToDate.ClientID%>').val() + "'}",
            dataType: "json",
            success: function (data) {
                if (data.d != null)
                    var count = data.d[0].Count;
                if (count > 0) {
                    $('#emptyDataRow').hide();
                    return true;
                }
                else {
                    $('#emptyDataRow').show();
                    return false;
                }
            },
        });
    }

</script>

And

Here is my button

Close

I have used OnClientClick="return (!change()){ return false;}" but its server click not working when its true Help me how to tackle this issue?? Thanks

Answer 1

$.ajax is an asynchronous function. So those return calls wont work.

Why are you concerned with the return of the change function? You can just do:

onclientclick="change()"

Also as a side note, I think it's better to define your variables outside of an if statement, so they are not undefined downstream:

var count = 0;
if (data.d != null)
  count = data.d[0].Count;
if (count > 0) {
  $('#emptyDataRow').hide();
}
else {
  $('#emptyDataRow').show();
}