Sunday 31 August 2014

Validation for minimum and maximum price using Jquery

In this article today I will explain how we can validate the minimum and maximum price using Jquery



<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
  <title>Validation For Minimum and maximum Price</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>


    <center>
    <fieldset style="width:45%;height:50px">
    <legend>Validation For Minimum and maximum Price:</legend>
       Minimum price:<asp:TextBox ID="minprice" runat="server"></asp:TextBox>
       Maximum price : <asp:TextBox ID="maxprice" runat="server"></asp:TextBox>
        </fieldset>       
    </center>      
    </div>
    </form>
     <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://jqueryvalidation.org/files/dist/jquery.validate.min.js"></script>
<script src="http://jqueryvalidation.org/files/dist/additional-methods.min.js"></script>
<script>
    $("#minprice, #maxprice").change(function (e) {
        var lil = parseInt($("#minprice").val(), 10);
        var big = parseInt($("#maxprice").val(), 10);     
        if (lil > big) {
            var targ = $(e.target);
            if (targ.is("#maxprice")) {
                alert("Maximum price must be greater than Minimum price");
                $('#maxprice').val(lil);
            }
            if (targ.is("#minprice")) {
                alert("Minimum price must be less than Maximum price");
                $('#minprice').val(big);
            }
        }
    });
</script>
</body>

</html>



No comments:

Post a Comment