Download 100% FREE Office Document APIs for .NET
DotNetFunda.com
Online: 1279
Home > Forums > jQuery >

Please help,there is any problem in jQuery code.This does not display any output at the label. [Resolved]

Posted by Kumarkrishna184 under jQuery on 12/5/2015 | Points: 10 | Views : 909 | Status : [Member] | Replies : 5
Write New Post | Search Forums | AnsweredResolved Posts | Un Answered Posts | Forums Home 
Sir, There is 1 checkboxList having 3 items in it and 1 button and 1 label. My objective is to when if does not select any checkbox
item and click on button then there should be display a message "Please select any option".and if we select any checkbox and then click on the button then that checkbox text and value should be display on label.

Html Code:----

<form id="form1" runat="server">
    <div>
    <b>Select Options</b>
        <asp:CheckBoxList ID="chkList1" runat="server">
            <asp:ListItem Text="Option1" Value="opt1" />
            <asp:ListItem Text="Option2" Value="opt2" />
            <asp:ListItem Text="Option3" Value="opt3" />
        </asp:CheckBoxList>
        <asp:Button ID="btnSubmit" runat="server" Text="Submit" /><br />
        <asp:Label ID="lblResult" runat="server" />
    </div>
    </form>


jQuery Code:---

<script src="Scripts/jquery-2.1.4.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#btnSubmit").click(function () {
                if ($("#chkList1 input:checkbox").is(":checked") == false) {
                    $("#lblResult").html("<b style='color:red'>Please Select any Option</b>");
                    return false;
                }
                else
                {
                    var texts = "";
                    var values = "";
                    $("#chkList1 input:checkbox:checked").each(function () {
                        values += $(this).val() + ",";
                        texts += $("label=[for=" + $(this).prop("id") + "]").text() + ",";
                    });
                    texts = texts.substring(0, texts.length - 1);
                    values = values.substring(0, values.length - 1);
                    $("#lblResult").html("<b>Selected Option :</b><br/><b>Texts :</b>" + texts + "<br/><b>Values :</b>" + values);
                    return false;
                }
            });
        });
    </script>



Thanks and Regards,
Krishna Kumar

Thanks and Regards,
Krishna Kumar

Reply | Reply with Attachment
Alert Moderator 

Responses

Posted by: Rajnilari2015 on: 12/5/2015 [Member] [Microsoft_MVP] [MVP] Platinum | Points: 50

Up
0
Down

Resolved
Try this , it address your problem 

<html>

<head>

<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js'></script>

<script type="text/javascript">

        $(document).ready(function () {

            

            $("#btnSubmit").click(function () {

                if ($("input:checkbox[name=Options]").is(":checked")==false) {

                	$("#span1").html("<b style='color:red'>Please Select any Option</b>");                    

                }

                else 

                {

                    var texts = "";

                    var values = "";

                    $("input:checkbox[name=Options]:checked").each(function () {                    	

                        values += $(this).val() + ",";

                        texts += $("label[for=" + $(this).prop("id") + "]").text() + ",";

                    });

                   

                    values = values.substring(0, values.length - 1);                   

                    texts = texts.substring(0, texts.length - 1);

                    $("#span1").html("<b style='color:green'>Selected Options</b><br/><b>Texts :</b>" + texts + "<br/><b>Values :</b>" + values);

                }

            });

        });

    </script>

</head>

<body>

        <b>Select Options</b><br />

        <input type="checkbox" id="chk1" value="opt1" name="Options" />

        <label for="chk1">Option1</label>

        <input type="checkbox" id="chk2" value="opt2" name="Options" />

        <label for="chk2">Option2</label>

        <input type="checkbox" id="chk3" value="opt3" name="Options" />

        <label for="chk3">Option3</label>

        <input type="checkbox" id="chk4" value="opt4" name="Options" />

        <label for="chk4">Option4</label><br />

        <input type="button" id="btnSubmit" value="Submit" /><br />

        <span id="span1"></span>

 

</body>

</html>


Also in your code, in the else part instead of 

return false;


make 

return true;


--
Thanks & Regards,
RNA Team

Kumarkrishna184, if this helps please login to Mark As Answer. | Alert Moderator
Posted by: Kumarkrishna184 on: 12/5/2015 [Member] Starter | Points: 25

Up
0
Down
You are Great Sir.......Thanks....
I tried very much but not able to solve the problem then i post the problem.....Thanks again sir.......

Thanks and Regards,
Krishna Kumar

Kumarkrishna184, if this helps please login to Mark As Answer. | Alert Moderator
Posted by: Kumarkrishna184 on: 12/5/2015 [Member] Starter | Points: 25

Up
0
Down
Niladri Biswas Sir can i get your personal detail?

Thanks and Regards,
Krishna Kumar

Kumarkrishna184, if this helps please login to Mark As Answer. | Alert Moderator
Posted by: Rajnilari2015 on: 12/5/2015 [Member] [Microsoft_MVP] [MVP] Platinum | Points: 25

Up
0
Down
Kumar Sir, glad that it has helped you.

--
Thanks & Regards,
RNA Team

Kumarkrishna184, if this helps please login to Mark As Answer. | Alert Moderator
Posted by: Kumarkrishna184 on: 12/5/2015 [Member] Starter | Points: 25

Up
0
Down
Ok Thanks Sir.....

Thanks and Regards,
Krishna Kumar

Kumarkrishna184, if this helps please login to Mark As Answer. | Alert Moderator

Login to post response

Latest Posts