Syed Shams Syed Shams - 2 months ago 7
ASP.NET (C#) Question

Get Button Class in JQuery

I have 12 ASP text boxes and 4 ASP buttons.

Now... what I am trying to do is.. I want to group or associate 3 text boxes to each button(Making group of 3 text boxes and 1 button). I am able to do this by assigning same class to 3 text boxes and 1 button respectively and other class to other 3 text boxes and 1 button respectively.

Now my task is, if I click a button whose class is "Required" then only the textboxes whose class is "Required" should be validated in Jquery. Please help !!

Answer

Try this :

if each 3 last textbox be empty and press button.Required show message Require.

$(document).ready(function(){

    $("button").on("click",function(){

        var cls = $(this).attr("class");

        if(cls == "Required") {

            $("input[type=text]." + cls).each(function(){

                $(this).next("span").remove();
                if($(this).val() == '')
                    $(this).after("<span>Require</span>");
                })    
        }
    })
})

Final code :

<!DOCTYPE html>
<html lang="en">
<head>
    <style>
    </style>
</head>
    <body>
        
        <input type="text" class="txt1">
        <br>
        <input type="text" class="txt1">
        <br>
        <input type="text" class="txt1">
        <br><br>
        
        <input type="text" class="txt2">
        <br>
        <input type="text" class="txt2">
        <br>
        <input type="text" class="txt2">
        <br><br>
        <input type="text" class="Required">
        <br>
        <input type="text" class="Required">
        <br>
        <input type="text" class="Required">
        <br><br>
        <button class="txt1">Click 1</button>
        <button class="txt2">Click 2</button>
        <button class="Required">Required</button>
        
       <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
      
        <script>
          
        $(document).ready(function(){

            $("button").on("click",function(){

                var cls = $(this).attr("class");

                if(cls == "Required") {

                    $("input[type=text]." + cls).each(function(){

                        $(this).next("span").remove();
                        if($(this).val() == '')
                            $(this).after("<span>Require</span>");
                        })    
                }
            })

        })
            
        </script>
    </body>
</html>