Question

I have an asp.net button:

 <asp:Button ID="MainContent_ibSave" runat="server" Text="Save" />
                </td>

I need to keep the runat=server because I have to process some code behind when its clicked.
But in the jquery I have this:

 $("#MainContent_ibSave").click(function () {
            if ($('#MainContent_txtShipToName').val().length == 0) {
                $('#hErrorsExist').val("1");
                $('#error').show();
            }
            else {
                $('#hErrorsExist').val("0");
                $('#error').hide();
            }

Basically what I’m doing here is just checking if any text has been entered in #MainContent_txtShipToName. I want to throw an error message if nothing is entered. To do so I thought I’d add a hidden field:

<input id="hErrorsExist" type="hidden" />

To maintain the state of whether an error exists on the page or not.
This is so if an error exists on the form I can set the value to 1 otherwise I set it to 0.

After I click this button it sets the value to 1 shows the #error (which is just a div), but then the div disappears. Its as if the postback has reset the value of hErrorsExist…

I even added a check in my jquery:

  if ($('#hErrorsExist').val() == "0" || $('#hErrorsExist').val().length == 0) {
            alert("about to hide");
            $('#error').hide();
            alert($('#hErrorsExist').val());
        }
        else {
            $('#error').show();
            alert($('#hErrorsExist').val());
        }

This is the first thing in my document ready function. I dont know how to handle this so that the div #error stays up even after the button post back. If I do enter a value and it validates it should set hErrorsExist to 0 and hide the div #error and keep the div hidden after post back.

Here’s the full jquery:

 $(document).ready(function () {
        /*hide message container on top*/
        //alert($('#hErrorsExist').val().length);
        if ($('#hErrorsExist').val() == "0" || $('#hErrorsExist').val().length == 0) {
            alert("about to hide");
            $('#error').hide();
            alert($('#hErrorsExist').val());
        }
        else {
            $('#error').show();
            alert($('#hErrorsExist').val());
        }

          $("#MainContent_ibSave").click(function () {
            if ($('#MainContent_txtShipToName').val().length == 0) {
                $('#hErrorsExist').val("1");
                alert("Setting to 1");
                alert($('#hErrorsExist').val());
                $('#error').show();
            }
            else {
                $('#hErrorsExist').val("0");
                alert("Setting to 0");
                alert($('#hErrorsExist').val());
                $('#error').hide();
            }
        });
          }); 

Answer 1

Have you tried this?

$("#<%= MainContent_ibSave.ClientID %>").click(function (arg) {
   arg.preventDefault();
   if ($('#MainContent_txtShipToName').val().length == 0) {
       $('#hErrorsExist').val("1");
       $('#error').show();
   }
   else {
       $('#hErrorsExist').val("0");
       $('#error').hide();
   }
});