Bootstrap Validation RRS feed

  • Question

  • User-1499457942 posted


      How to use Bootstrap validation in Modal Popup . I have no Form tag . I am using Content Page. On Click of button Modal Popup opens


    Sunday, August 19, 2018 2:10 PM

All replies

  • User-893317190 posted

    Hi  JagjitSingh,

     You could still use jquery validation through selecting the id of your master page’s form tag. You could write your jquery  validating  code  in the button’s click event.The button is used to add or edit data in your model pop up.

     Below is my code.  form1 is the id of the form tag in master page.

    <asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
        <asp:Button ID="Button1" runat="server" Text="Button" />
            <div class=""tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog modal-sm">
                <div class="modal-content">
                    <div class="modal-header bg-primary">
                        <button type="button" class="close" data-dismiss="modal">×</button>
                        <h4 class="modal-title " id="myModalLabel">Add New </h4>
                    <div class="modal-body">
                        <div class="form-horizontal" role="form">
                            <div class="form-group">
                                <asp:Label ID="lbl_Code" runat="server" CssClass="col-sm-4 control-label" Text="Code"></asp:Label>
                                <div class="col-sm-4">
                                    <asp:TextBox ID="txt_Code" CssClass="form-control" runat="server"></asp:TextBox>
                            <div class="form-group">
                                <asp:Label ID="lbl_Inf" runat="server" CssClass="col-sm-4 control-label" Text="Inf"></asp:Label>
                                <div class="col-sm-5">
                                    <asp:TextBox ID="txt_Inf"  CssClass="form-control" runat="server"></asp:TextBox>
                            <div class="form-group">
                                <div class="col-sm-4"></div>
                                <div class="col-sm-5">
                                    <asp:Button ID="btnInsert" CssClass="btn btn-primary"  runat="server" class="btn btn-primary"  Text=" Save Record" onclick="btnInsert_Click"></asp:Button>
             <script type="text/javascript" charset="utf-8">
                 $("#<%=btnInsert.ClientID%>").click(function () {
                    rules: {
                        <%=txt_Code.UniqueID %>: {
                            minlength: 2,
                            required: true
                        <%=txt_Inf.UniqueID %>: {                       
                             required: true
                    }, messages: {}

    Best regards,

    Ackerly Xu

    Monday, August 20, 2018 10:16 AM