How to use Validation Engine Plugin for controls inside Update panel using jQuery in ASP.Net

Waghmare

SOLVED CLOSED ACTIVE ANSWERED
User: Waghmare
Posted: on Apr 18, 2017 04:03 AM
Forum: jQuery and jQuery Plugins
Answer: 1
Views: 7676

Hiii,

I have used required field validator in my form inside update panel.

I want to set Reqrd Validation for Dropdown also and Date Regular Expression for date textboxes.

Every Textbox have TextChanged Event for setting Focus to next Textbox.for that purpose i have to set AutoPostBack="true" for every textbox.

But its not working fine inside the update panel.

If i directely clicks on save button it throws all validators correctly but when i started to fill empty textboxes then it automatically removes all validation error.

it means if 3 textboxes fires reqd validation when clicked on save button and then user starts to fill textbox1 then it automatically removes other 2 textboxes reqd validation error immediatly.

I think it is a Postback issue for that i have added CausesValidation="true" and Validation Group="AllFields" to every textbox and Also called Validation Group on Save Button.

But still it in not working.

Andrea

0 1

Reply
User: Andrea
Replied: on Apr 18, 2017 04:03 AM
Report

Hi @Waghmare, Please try the following RequiredFieldValidator inside UserControl in GridView not working with AJAX UpdatePanel in ASP.Net It might help you. Cheers Andrea.

dharmend...

0 2

Reply
User: dharmendr
Replied: on Apr 18, 2017 04:12 AM
Modified: on Apr 18, 2017 04:12 AM
Report

Share the required code with html.

Waghmare

0 3

Reply
User: Waghmare
Replied: on Apr 18, 2017 04:13 AM
Report

Thanx for ur reply Andrea...

I have already reffered this link but it wont wotk.

If possible anybody solve it with Example.

Here it my Sample Code.

    <asp:ScriptManager ID="mngr1" runat="server"></asp:ScriptManager>

    <div class="col-md-12 col-lg-12">
        <div class="panel panel-primary" style="margin-top: 10px">
            <div class="panel-heading">
                <center><b>New Medical Advance</b></center>
            </div>
            <div class="panel-body">
                <asp:UpdatePanel ID="updatepanel2" runat="server">
                    <ContentTemplate>
                        <div class="well well-lg">
                            <div class="form-horizontal">
                                <div class="form-group">
                                    <asp:Label ID="lblPay" runat="server" Text="Pay" CssClass="control-label col-md-1 col-lg-1"></asp:Label>
                                    <div class="col-md-2 col-lg-2">
                                        <div class="input-group ">
                                            <span class="input-group-addon">
                                                <i class="fa fa-inr"></i>
                                            </span>
                                            <asp:TextBox ID="txtPay" runat="server" CssClass="form-control input-sm" MaxLength="6" CausesValidation="true" AutoPostBack="true" OnTextChanged="txtPay_TextChanged"></asp:TextBox>
                                            <cc1:FilteredTextBoxExtender ID="Fltr1" runat="server" TargetControlID="txtPay" FilterType="Numbers"></cc1:FilteredTextBoxExtender>
                                        </div>
                                        <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="Required !" ValidationGroup="AllFields" ForeColor="Red" ControlToValidate="txtPay" Display="Dynamic" SetFocusOnError="true"></asp:RequiredFieldValidator>
                                    </div>

                                    <asp:Label ID="lblGPay" runat="server" Text="GPay" CssClass="control-label col-md-1 col-lg-1"></asp:Label>
                                    <div class="col-md-2 col-lg-2">
                                        <div class="input-group ">
                                            <span class="input-group-addon">
                                                <i class="fa fa-inr"></i>
                                            </span>
                                            <asp:TextBox ID="txtGPay" runat="server" CssClass="form-control input-sm" MaxLength="5" CausesValidation="True" AutoPostBack="true" OnTextChanged="txtGPay_TextChanged"></asp:TextBox>
                                            <cc1:FilteredTextBoxExtender ID="Fltr2" runat="server" TargetControlID="txtGPay" FilterType="Numbers"></cc1:FilteredTextBoxExtender>
                                        </div>
                                        <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ErrorMessage="Required !" ValidationGroup="AllFields" ForeColor="Red" ControlToValidate="txtGPay" Display="Dynamic" SetFocusOnError="true"></asp:RequiredFieldValidator>

                                    </div>

                                    <asp:Label ID="lblHra" runat="server" Text="HRA" CssClass="control-label col-md-1 col-lg-1"></asp:Label>
                                    <div class="col-md-2 col-lg-2">
                                        <div class="input-group ">
                                            <span class="input-group-addon">
                                                <i class="fa fa-inr"></i>
                                            </span>
                                            <asp:TextBox ID="txtHra" runat="server" MaxLength="5" CssClass="form-control input-sm" CausesValidation="true" AutoPostBack="true" OnTextChanged="txtHra_TextChanged"></asp:TextBox>
                                            <cc1:FilteredTextBoxExtender ID="Fltr3" runat="server" TargetControlID="txtHra" FilterType="Numbers"></cc1:FilteredTextBoxExtender>
                                        </div>
                                        <asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ErrorMessage="Required" ValidationGroup="AllFields" ForeColor="Red" ControlToValidate="txtHra" Display="Dynamic" SetFocusOnError="true"></asp:RequiredFieldValidator>

                                    </div>
                                    <asp:Label ID="lblTpt" runat="server" Text="TPT" CssClass="control-label col-md-1 col-lg-1"></asp:Label>
                                    <div class="col-md-2 col-lg-2">
                                        <div class="input-group ">
                                            <span class="input-group-addon">
                                                <i class="fa fa-inr"></i>
                                            </span>
                                            <asp:TextBox ID="txtTpt" runat="server" MaxLength="5" CssClass="form-control input-sm" CausesValidation="true" AutoPostBack="true" OnTextChanged="txtTpt_TextChanged"></asp:TextBox>
                                            <cc1:FilteredTextBoxExtender ID="Fltr4" runat="server" TargetControlID="txtTpt" FilterType="Numbers"></cc1:FilteredTextBoxExtender>
                                        </div>
                                        <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ErrorMessage="Required" ValidationGroup="AllFields" ForeColor="Red" ControlToValidate="txtTpt" Display="Dynamic" SetFocusOnError="true"></asp:RequiredFieldValidator>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <asp:Label ID="lblTptda" runat="server" Text="TPTDA" CssClass="control-label col-md-1 col-lg-1"></asp:Label>
                                    <div class="col-md-2 col-lg-2">
                                        <div class="input-group">
                                            <span class="input-group-addon">
                                                <i class="fa fa-inr"></i>
                                            </span>
                                            <asp:TextBox ID="txtTPtda" runat="server" MaxLength="5" CssClass="form-control input-sm" CausesValidation="true" AutoPostBack="true" OnTextChanged="txtTPtda_TextChanged"></asp:TextBox>
                                            <cc1:FilteredTextBoxExtender ID="Fltr5" runat="server" TargetControlID="txtTPtda" FilterType="Numbers"></cc1:FilteredTextBoxExtender>
                                        </div>
                                        <asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" ErrorMessage="Required" ValidationGroup="AllFields" ForeColor="Red" ControlToValidate="txtTPtda" Display="Dynamic" SetFocusOnError="true"></asp:RequiredFieldValidator>

                                    </div>
                                    <asp:Label ID="lblOtherPay" runat="server" Text="Other Pay" CssClass="control-label col-md-1 col-lg-1"></asp:Label>
                                    <div class="col-md-2 col-lg-2">
                                        <div class="input-group">
                                            <span class="input-group-addon">
                                                <i class="fa fa-inr"></i>
                                            </span>
                                            <asp:TextBox ID="txtOtherPay" runat="server" MaxLength="5" CssClass="form-control input-sm" CausesValidation="true" AutoPostBack="true" OnTextChanged="txtOtherPay_TextChanged"></asp:TextBox>
                                            <cc1:FilteredTextBoxExtender ID="Fltr6" runat="server" TargetControlID="txtOtherPay" FilterType="Numbers"></cc1:FilteredTextBoxExtender>
                                        </div>
                                        <asp:RequiredFieldValidator ID="RequiredFieldValidator6" runat="server" ErrorMessage="Required" ValidationGroup="AllFields" ForeColor="Red" ControlToValidate="txtOtherPay" Display="Dynamic" SetFocusOnError="true"></asp:RequiredFieldValidator>

                                    </div>

                                    <asp:Label ID="lblGross" runat="server" Text="Gross Pay" CssClass="control-label col-md-1 col-lg-1"></asp:Label>
                                    <div class="col-md-2 col-lg-2">
                                        <div class="input-group">
                                            <span class="input-group-addon">
                                                <i class="fa fa-inr"></i>
                                            </span>
                                            <asp:TextBox ID="txtGrossPay" runat="server" MaxLength="7" CssClass="form-control input-sm"></asp:TextBox>
                                            <cc1:FilteredTextBoxExtender ID="Fltr7" runat="server" TargetControlID="txtGrossPay" FilterType="Numbers"></cc1:FilteredTextBoxExtender>
                                        </div>
                                    </div>
                                    <asp:Label ID="lblMedFacy" runat="server" Text="MedFacy" CssClass="control-label col-md-1 col-lg-1"></asp:Label>
                                    <div class="col-md-2 col-lg-2">
                                        <asp:DropDownList ID="drpMedFacy" runat="server" MaxLength="5" CausesValidation="true" OnTextChanged="drpMedFacy_TextChanged" CssClass="form-control input-sm" AutoPostBack="true">
                                            <asp:ListItem>PLEASE SELECT</asp:ListItem>
                                            <asp:ListItem>CSMA</asp:ListItem>
                                            <asp:ListItem>CGHS</asp:ListItem>
                                        </asp:DropDownList>
                                    </div>
                                </div>

                            </div>
                        </div>

                        <div class="form-horizontal">
                            <div class="form-group">
                                <div class="col-md-offset-3 col-lg-offset-3 col-md-2 col-lg-2">
                                    <asp:Button ID="btnSave" runat="server" Text="Save" CssClass="btn btn-success btn-block btn-sm" ValidationGroup="AllFields" OnClick="btnSave_Click" />
                                </div>
                                <div class="col-md-2 col-lg-2">
                                    <asp:Button ID="btnClear" runat="server" Text="Clear" CssClass="btn btn-success btn-block btn-sm" OnClick="btnClear_Click" CausesValidation="false" />
                                </div>
                            </div>
                        </div>
                    </ContentTemplate>
                </asp:UpdatePanel>
            </div>
        </div>
    </div>

dharmend...

0 4

Reply
User: dharmendr
Replied: on Apr 18, 2017 06:33 AM
Report

Problem is with AutoPostBack="true" property. It makes the updatepanel content to postback. So the validation displayed and vanished on textbox textchanged event.

Waghmare

0 5

Reply
User: Waghmare
Replied: on Apr 27, 2017 11:33 AM
Report

After removing AutoPostBack="true"then the dropdown selected index changed event not fires as well as any textchanged event also not fires.

How to use Validation Engine Plugin for controls inside Update panel using jQuery in ASP.Net

Company

Explore

Follow us

Contact Us