validate in jquery for multiple textbox

Question

I have one datepicker and 1 textbox and save button now I want when anyone proceed without selecting these values I want to show message fill. Means validating in jquery how I do that?

<script type="text/javascript">
        $(function () {
            $('#ser').on('click', 'tr', function () {
                if ($(this).hasClass('selected')) {
                    $(this).removeClass('selected');
                }
                else {
                    $('#ser', 'tr.selected').removeClass('selected');
                    $(this).addClass('selected');
                }
                var row = $(this);
                var ID = row.find('td')[0].firstChild.data;
                $('[ID*=compl]').on('click', function () {
                    $("#dialog1").dialog();
                    $('[ID*=save]').on('click', function () {                      
                        var VID = '<%=Session["value"]%>';
                        var date = $("#last_perf").val();
                        var meter = $("#txt_m").val();
                        var TypeID = '2';
                        var comp = {};
                        comp.date = date;
                        comp.meter = meter;
                        comp.VID = VID;
                        comp.ID = ID;
                        comp.TypeID=TypeID;  
                        compl_serv(comp);

                    });
                });
            });
        });

        function compl_serv(comp) {

            debugger;
            var c = {};
            c.date = comp.date;
            c.meter = comp.meter;
            c.VID = comp.VID;
            c.ID = comp.ID;
            c.TypeID = comp.TypeID;

            debugger;
            $.ajax({     
               type: "POST",
               url:"a.aspx/CSe",
               contentType: "application/json;charset=utf-8",
               dataType: "json",
               data:JSON.stringify(c),
               async: true,
               cache: false,
               success: function (result) {

                    var co = JSON.parse(result.d).response;               

                             if (result.length !== "")
                        {
            $("#last_perf" + comp.date).html(comp.date);
                            $("#txt_m" + comp.meter).html(comp.meter);


                            $("#<%=save_complete_label.ClientID%>").text("successfully");
                        }

                        else
                        {                               
                            $("#<%=save_complete_label.ClientID%>").text("Fill all fields");                             
                        }

                 },

    </script>

HTML

        <div id="dialog1" class="ui-dialog"  style="display:none"  title="Basic dialog">

            <table class="auto-style1">
        <tr>
            <td>  <asp:Label ID="Label2" runat="server" Text="Label">Date</asp:Label> </td>
            <td>  <input id="last_perf"  class="f" value="dd/mm/yyyy" runat="server" clientidmode="static" /><br /><br /></td>
        </tr>
        <tr>
            <td><asp:Label ID="Label3" runat="server" Text="Label">meter</asp:Label></td>
            <td> <input id="txt_m"   type="text"  runat="server" clientidmode="static" /><br /><br /></td> 
        <tr>
            <td> <button type="button" class="btn btn-primary"  id="save">Save completed services</button><br /><br /></td>
            <td>
                  <asp:Label ID="save_complete_label" CssClass="label label-success"  runat="server" Text=""></asp:Label>
            </td>
        </tr>
    </table>

            </div>

I try through if else but this is not working.

Any solutions?

Put all input type in form and use $("form").valid(); to validate all fields — Bharat
– Bharat, Commented Nov 8, 2016 at 7:11
Could you please provide relevant html and if possible a fiddle or snippet would be good.. — Guruprasad J Rao
– Guruprasad J Rao, Commented Nov 8, 2016 at 7:11
So this is the only row that exists in table or there can be multiple rows similarly as above? Please include screenshots of your dialog if possible.. — Guruprasad J Rao
– Guruprasad J Rao, Commented Nov 8, 2016 at 8:06

Cruzer · Accepted Answer · 2016-11-08 09:42:30Z

you can use validate.js, it is supportable in jquery

http://rickharrison.github.io/validate.js/ https://validatejs.org/

Put your HTML code in a form. if already in form use below code for example: you can write rules also:

js code Example: http://jsfiddle.net/beshur/D8tWs/

var validator = new FormValidator('example_form', [{
name: 'req',
display: 'required',
rules: 'required'
}, 
{
name: 'alphanumeric',
rules: 'alpha_numeric'
}, {
name: 'password',
rules: 'required'
}, {
name: 'password_confirm',
display: 'password confirmation',
rules: 'required|matches[password]'
}, {
name: 'email',
rules: 'valid_email',
depends: function() {
    return Math.random() > .5;
}
}, {
name: 'minlength',
display: 'min length',
rules: 'min_length[8]'
}], function(errors, event) {
if (errors.length > 0) {
    // Show the errors
}
});
}

Collectives™ on Stack Overflow

validate in jquery for multiple textbox

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related