locked
Validators are not working when onclientclick in jquery RRS feed

  • Question

  • User-582711651 posted

    Hi friends, 

    my Validators are not working, what I did wrong, check my code, and pls help me to sort out this issue. 

    My code

                                                            <div class="col-md-6">
                                                                <div class="form-group">
                                                                    <label>01.Document Received on*</label>
                                                                    <div class="input-group date">
                                                                        <div class="input-group-addon">
                                                                            <i class="fa fa-calendar"></i>
                                                                        </div>
                                                                        <asp:TextBox ID="txt_PostCouriReceivedOn" runat="server" CssClass="form-control" placeholder="Future Date NotAllow" Width="200px" autocomplete="off"></asp:TextBox>
                                                                        <asp:RequiredFieldValidator ID="RequiredFieldValidator3" Display="None" runat="server" ErrorMessage="Documents received on?" ForeColor="red" ControlToValidate="txt_PostCouriReceivedOn" ValidationGroup="group2" ></asp:RequiredFieldValidator>
                                                                        <asp:CompareValidator ID="ComValidates" Display="None" runat="server" ControlToValidate ="txt_PostCouriReceivedOn" ControlToCompare="txt_Disdate" Operator ="GreaterThanEqual"  Type = "Date" ValidationGroup="group2" ErrorMessage="The date of courier received sh'd be next day of dispatched by Branch" ></asp:CompareValidator>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                            <div class="col-md-6">
                                                                <div class="form-group">
                                                                    <label>02.Recvd.By*</label>
                                                                    <asp:TextBox ID="txt_DocReceivedByName" runat="server" CssClass="form-control" TextMode="SingleLine" placeholder="100 Chars only" MaxLength="100" Style="text-transform: uppercase" onkeydown="return((event.keyCode >= 65 && event.keyCode <= 120) || (event.keyCode >= 48 && event.keyCode <= 57) || (event.keyCode==8)|| (event.keyCode==9) || (event.keyCode==55) || (event.keyCode==16) || (event.keyCode==110) || (event.keyCode==190) || (event.keyCode==188) || (event.keyCode==35) || (event.keyCode==36) || (event.keyCode==37) || (event.keyCode==38) || (event.keyCode==39) || (event.keyCode==40) || (event.keyCode==46) || (event.keyCode==32));"></asp:TextBox>
                                                                    <asp:RegularExpressionValidator ID="RegEx_DispPerson" Display="None" runat="server" ErrorMessage="Alphabets only" ForeColor="red" ControlToValidate="txt_DocReceivedByName" ValidationGroup="group2" ValidationExpression="^[A-Za-z ]+$"></asp:RegularExpressionValidator>
                                                                    <asp:RequiredFieldValidator ID="RequiredFieldValidator4" Display="None" runat="server" ErrorMessage="Documents received person name? " ForeColor="red" ControlToValidate="txt_DocReceivedByName" ValidationGroup="group2"></asp:RequiredFieldValidator>
                                                                </div>
                                                            </div>
                                                            <div class="col-md-6">
                                                                <div class="form-group">
                                                                    <label>03.ReceiverMob.PH#*</label>
                                                                    <asp:TextBox ID="txt_ReceivedPersonMobPH" runat="server" CssClass="form-control" placeholder="10 Digit/Start with 9,7,6,8" MaxLength="10" onkeypress="return isNumberKey(event)"></asp:TextBox>
                                                                    <asp:RequiredFieldValidator ID="RequiredFieldValidator5" Display="None" runat="server" ErrorMessage="MobPh#?" ForeColor="red" ControlToValidate="txt_ReceivedPersonMobPH" ValidationGroup="group2" ></asp:RequiredFieldValidator>
                                                                    <asp:RegularExpressionValidator ID="RegEx_MobPh" Display="None" runat="server" ErrorMessage="10 Nos / Starts 9/8/7/6" ForeColor="red" ControlToValidate="txt_ReceivedPersonMobPH" ValidationGroup="group2"  ValidationExpression="^[6789]\d{9}$"></asp:RegularExpressionValidator>
                                                                </div>
    
                                                            </div>
                                                            <div class="col-md-6">
                                                                <div class="form-group">
                                                                    <label>04.Remarks</label>
                                                                    <asp:TextBox ID="txt_GeneralRemarks" runat="server" CssClass="form-control" TextMode="SingleLine" placeholder="100 Chars only" MaxLength="100" Style="text-transform: uppercase" onkeydown="return((event.keyCode >= 65 && event.keyCode <= 120) || (event.keyCode >= 48 && event.keyCode <= 57) || (event.keyCode==8)|| (event.keyCode==9) || (event.keyCode==55) || (event.keyCode==16) || (event.keyCode==110) || (event.keyCode==190) || (event.keyCode==188) || (event.keyCode==35) || (event.keyCode==36) || (event.keyCode==37) || (event.keyCode==38) || (event.keyCode==39) || (event.keyCode==40) || (event.keyCode==46) || (event.keyCode==32));"></asp:TextBox>
                                                                </div>
                                                            </div>
                                                            <div class="col-md-12">
                                                                <center> 
                                                                <div class="row">
                                                                  <asp:Button ID="btnsubmit" runat="server" Text="Save"  class="btn btn-primary" Visible="true" ValidationGroup="group2" OnClientClick="db_post();return false;"></asp:Button>
                                                                  &nbsp;
                                                                  <asp:Button ID="btn_Reset" runat="server" Text="Reset"  class="btn btn-danger" Visible="true" ></asp:Button>
                                                                  <button class="btn btn-danger" data-dismiss="modal" type="button">Close</button>
                                                                  <asp:ValidationSummary runat="server" ShowMessageBox="true" ShowSummary="false" ValidationGroup="group2" />
                                                                  
                                                                 </div>
                                                                  </center>
                                                            </div>
    
    
      <script type="text/javascript">
                     function db_post() {
                     var f_db = {};
                     var recidx =  $('#<%=lbl_rowid.ClientID%>').text();
                     f_db.recid =  $.trim(recidx);
                     var trkidx =  $('#<%=lbl_trckingid.ClientID%>').text();
                     f_db.trkid =  $.trim(trkidx);
                     f_db.recvdt = $('#<%=txt_PostCouriReceivedOn.ClientID%>').val();
                     f_db.recvby = $('#<%=txt_DocReceivedByName.ClientID%>').val().toUpperCase();
                     f_db.recvph = $('#<%=txt_ReceivedPersonMobPH.ClientID%>').val();
                     f_db.remarks = $('#<%=txt_GeneralRemarks.ClientID%>').val().toUpperCase();
                     f_db.usrid = '<%= Session("ICT_Em_Code") %>';
                     f_db.ipadr = '<%= Session("ICT_IPADDR") %>';
                $.ajax({
                    type: "POST",
                    url: "ICT_TxnHO_DocAcknowledgement.aspx/Doc_ackwd",
                    data: '{f_db: ' + JSON.stringify(f_db) + '}',
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (response) {
                       var result = response.d;
                       if (result == '1') {
                        alert("The document acknowledgement information has been updated successfully!");
                        $("#<%=txt_GeneralRemarks.ClientID %>").val("");
                        $(".modal-backdrop").remove();
                        $("#Popu_HOApproval").modal('hide');
                        disbl_rbt();
                        }
                        else if (result == '2') {
                        alert("Sorry, This transaction already exists, due to this unable to save this data!");
                        }
                        else {
                        alert("Sorry! There is an err. on Data Transmission, please contact IT Admin!");
                        }
                    },
                    error: function (data, ex) {
                        alert("Sorry there is err. " + data + " Ex: " + ex);
                        $(".modal-backdrop").remove();
                        $("#Popu_HOApproval").modal('show');
                    }
                    
                });
                
                //return false;
                }
        </script>

    Thursday, October 29, 2020 4:52 PM

Answers

  • User475983607 posted

    You are correct the validators do not fire when making an AJAX request.  You'll need to manually validate the form.

    ValidateForm();

    https://www.codemag.com/Article/0307101/Validating-Data-On-Web-Forms

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, October 29, 2020 5:21 PM
  • User1535942433 posted

    Hi ayyappan.CNN,

    As far as I think,you could use JQuery validation.

    More details,you could refer to below articles:

    https://www.c-sharpcorner.com/UploadFile/ee01e6/jquery-validation-with-Asp-Net-web-form/

    https://stackoverflow.com/questions/133310/how-can-i-get-jquery-to-perform-a-synchronous-rather-than-asynchronous-ajax-re

    Best regards,

    Yijing Sun

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, October 30, 2020 2:32 AM
  • User-582711651 posted

    Hi,

    Thanks for your response, I have modified validations like this, 

        if($("#txt_PostCouriReceivedOn").val().trim().length == 0) {
                        alert('Sorry, Please enter the Date of Courier Received!');
                        return false;
                        } 
                        else 
                        {
                            var frdt = $('#<%=txt_Disdate.ClientID%>').val();
                            var todt = $('#<%=txt_PostCouriReceivedOn.ClientID%>').val();
                            var firstDate = new Date(frdt.split('/')[2],frdt.split('/')[1],frdt.split('/')[0]);
                            var secondDate = new Date(todt.split('/')[2],todt.split('/')[1],todt.split('/')[0]);
                            if (firstDate <= secondDate) {
                                f_db.recvdt = $('#<%=txt_PostCouriReceivedOn.ClientID%>').val();
                                }
                                else{
                                alert('Sorry, The date of courier received should same or next day of dispatch from Branch!');
                                return false;
                                }
                            }
    
                    if($("#txt_DocReceivedByName").val().trim().length == 0) {
                    alert("Sorry! Name of the document receiver is missing!");
                    return false;
                    } else {
                    f_db.recvby = $('#<%=txt_DocReceivedByName.ClientID%>').val().toUpperCase();
                    }
                  
                    if($("#txt_ReceivedPersonMobPH").val().trim().length == 0) {
                    alert("Sorry! Please enter the document receiver Mobile No!");
                    $('#txt_ReceivedPersonMobPH').focus();
                    $('#txt_ReceivedPersonMobPH').css('border-color', 'red');
                    return false;
                    } else {
                    f_db.recvph = $('#<%=txt_ReceivedPersonMobPH.ClientID%>').val();
                    $('#txt_ReceivedPersonMobPH').css('border-color', '');
                    }

    pls, share your views. 

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Saturday, October 31, 2020 6:57 PM

All replies

  • User475983607 posted

    You are correct the validators do not fire when making an AJAX request.  You'll need to manually validate the form.

    ValidateForm();

    https://www.codemag.com/Article/0307101/Validating-Data-On-Web-Forms

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, October 29, 2020 5:21 PM
  • User1535942433 posted

    Hi ayyappan.CNN,

    As far as I think,you could use JQuery validation.

    More details,you could refer to below articles:

    https://www.c-sharpcorner.com/UploadFile/ee01e6/jquery-validation-with-Asp-Net-web-form/

    https://stackoverflow.com/questions/133310/how-can-i-get-jquery-to-perform-a-synchronous-rather-than-asynchronous-ajax-re

    Best regards,

    Yijing Sun

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, October 30, 2020 2:32 AM
  • User-582711651 posted

    Hi,

    Thanks for your response, I have modified validations like this, 

        if($("#txt_PostCouriReceivedOn").val().trim().length == 0) {
                        alert('Sorry, Please enter the Date of Courier Received!');
                        return false;
                        } 
                        else 
                        {
                            var frdt = $('#<%=txt_Disdate.ClientID%>').val();
                            var todt = $('#<%=txt_PostCouriReceivedOn.ClientID%>').val();
                            var firstDate = new Date(frdt.split('/')[2],frdt.split('/')[1],frdt.split('/')[0]);
                            var secondDate = new Date(todt.split('/')[2],todt.split('/')[1],todt.split('/')[0]);
                            if (firstDate <= secondDate) {
                                f_db.recvdt = $('#<%=txt_PostCouriReceivedOn.ClientID%>').val();
                                }
                                else{
                                alert('Sorry, The date of courier received should same or next day of dispatch from Branch!');
                                return false;
                                }
                            }
    
                    if($("#txt_DocReceivedByName").val().trim().length == 0) {
                    alert("Sorry! Name of the document receiver is missing!");
                    return false;
                    } else {
                    f_db.recvby = $('#<%=txt_DocReceivedByName.ClientID%>').val().toUpperCase();
                    }
                  
                    if($("#txt_ReceivedPersonMobPH").val().trim().length == 0) {
                    alert("Sorry! Please enter the document receiver Mobile No!");
                    $('#txt_ReceivedPersonMobPH').focus();
                    $('#txt_ReceivedPersonMobPH').css('border-color', 'red');
                    return false;
                    } else {
                    f_db.recvph = $('#<%=txt_ReceivedPersonMobPH.ClientID%>').val();
                    $('#txt_ReceivedPersonMobPH').css('border-color', '');
                    }

    pls, share your views. 

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Saturday, October 31, 2020 6:57 PM