ajdeguzman
ajdeguzman

Reputation: 1209

Getting the Value of Checked Checbox returns undefined in JavaScript/ASP.NET VB

I have a Checkbox which has 10 items inside GridView:

<ItemTemplate>
   <asp:CheckBox ID="chkGrid" name = "sample1" class = "messageCheckbox" runat="server"    onclick="javascript:SelectCheckedItem(this)" Text = '<%# Bind("status_desc") %>'  />
</ItemTemplate>

What I want is to get the values of the CheckBox inside the GridView. I am getting the values if I used VB. What I want is getting it via JavaScript. Here is my code for the JavaScript:

function SelectCheckedItem(itemchk) {
            debugger
            var gvcheck = document.getElementById('gvDetails'); //This is the ID of the GridView
            if (itemchk.checked) {
                var checkedValue = $('messageCheckbox:checked').val();
                alert(checkedValue);
            }

            else {

                }
            }

        }

But I am getting undefined value.

Please help. Thank you.

Upvotes: 0

Views: 1301

Answers (2)

jasonscript
jasonscript

Reputation: 6170

The ID of the GridView most likely isn't gvDetails as .NET adds a whole extra string into your IDs. You need to look into using gvDetails.ClientID on your server side

var gvcheck = document.getElementById(<% gvDetails.ClientID %>); // This is the generated ID of the GridView

Upvotes: 1

kavun
kavun

Reputation: 3381

<asp:CheckBox ID="chkGrid" Text="Status" runat="server" />

Will be rendered something like the following (notice the id change because of runat="server")

<input type="checkbox" id="chkGrid_ctl01" />
<label for="chkGrid_ctl01">Status</label>

So to get the text in the label for each checkbox you will need to loop through the checkboxes and find the adjacent label.

To get the label for just the clicked checkbox, you can do something like

function SelectCheckedItem(itemchk) {
    if (itemchk.checked) {
        var checkedValue = $(itemchk)
            .siblings('label[for="' + itemchk.id '"]')
            .text();
        console.log(checkedValue);
    }
}

But to get all the labels, you will have to loop through each checkbox with class .messageCheckbox

function SelectCheckedItem() {
    $('.messageCheckbox:checked').each(function () {
        console.log($(this).siblings('label[for="' + itemchk.id '"]').text());
    });
}

Upvotes: 1

Related Questions