Adding a checkbox column to asp.net gridview

Question

I have a couple questions when it pertains to adding a CheckBox column to gridview in asp.net and getting multiple values. First off I see everyone adding OnCheckedChanged="chkview_CheckedChanged" to their aspx page but when you click on the CheckBox to set its actions it does not open OnCheckedChanged="chkview_CheckedChanged". It opens SelectedIndexChanged event instead. What I am trying to do is when they select a CheckBox it adds the corresponding rows info to the TextBox. Here is what I am currently using to set the values. How can I use a selected CheckBox instead?

protected void dropGridView_SelectedIndexChanged1(object sender, EventArgs e)
{
    GridViewRow row = dropdeadGridView.SelectedRow;
    IDTextBox.Text = row.Cells[1].Text;
    loadnumTextBox.Text = row.Cells[2].Text;
}

Once done with that how can you make it to where it will get every row that is checked instead of just one which is what is my current problem. I am looking for a way to select multiple rows and have a select button. I have done a lot of looking and can find nothing on it so I am trying to accomplish this with CheckBoxes instead. Any ideas how I can add this and get the multiple rows that can be selected. Thank you in advance.

Here is my edit* Posting asp code for CheckBox column:

<asp:TemplateField>
            <ItemTemplate>
                <asp:CheckBox ID="SelectCheckBox" runat="server" OnCheckedChanged="SelectCheckBox_OnCheckedChanged"/>
            </ItemTemplate>
        </asp:TemplateField>

Plue · Accepted Answer · 2014-03-07 14:48:55Z

18

First you have to set autopostback attribute to true :

<asp:CheckBox ID="SelectCheckBox" runat="server" AutoPostBack="true" 
              OnCheckedChanged="SelectCheckBox_OnCheckedChanged"/>

In your case, SelectedIndexChanged is sent by the gridview. For the checkbox event you have to use OnCheckedChanged event :

protected void SelectCheckBox_OnCheckedChanged(object sender, EventArgs e)
{
    CheckBox chk = sender as CheckBox ;

    if(chk.Checked)
    {
        GridViewRow row = (GridViewRow)chk.NamingContainer;
        IDTextBox.Text = row.Cells[1].Text;
        loadnumTextBox.Text = row.Cells[2].Text;
    }
}

If you want to loop through all selected checkboxes :

var rows = dropdeadGridView.Rows;
int count = dropdeadGridView.Rows.Count;
for (int i = 0; i < count; i++)
{
    bool isChecked = ((CheckBox)rows[i].FindControl("chkBox")).Checked;
    if(isChecked)
    {
        //Do what you want
    }
}

edited Mar 7, 2014 at 14:48

answered Mar 7, 2014 at 14:37

Plue

1,8101 gold badge19 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

Kpt.Khaos Over a year ago

It did not populate textbox

Kpt.Khaos Over a year ago

I also put breakpoints on the OnCheckedChanged event and when checked it does not break.

Plue Over a year ago

I was going to ask =)

Kpt.Khaos Over a year ago

Still no record displayed could it be the selectedindexchanged messing it up?

M H Over a year ago

On your loop reccomendation...It can be done in one line. Much easier to use for each. foreach (GridViewRow gvr in GridView1.Rows) instead of var rows = dropdeadGridView.Rows; int count = dropdeadGridView.Rows.Count; for (int i = 0; i < count; i++)

|

Jeyachandran s · Accepted Answer · 2022-07-05 03:14:47Z

HTML Gridview example

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" Class="table table-striped table-bordered" ShowHeaderWhenEmpty="true" HeaderStyle-HorizontalAlign="Center" RowStyle-HorizontalAlign="Center" HorizontalAlign="Center" Height="40px" Width="80%" EmptyDataText="No Stock in The Shop"> <Columns> <asp:TemplateField> <HeaderTemplate> <asp:CheckBox ID="chkAllSelect" runat="server" onclick="checkAll(this);" /> </HeaderTemplate> <ItemTemplate> <asp:CheckBox ID="chkSelect" onclick="Check_Click(this);EnableBTN(this);" runat="server" /> </ItemTemplate> </asp:TemplateField> <asp:BoundField DataField="SHOP_CODE" HeaderText="SHOP CODE" /> <asp:BoundField DataField="ITEM_CODE" HeaderText="ITEM CODE" /> <asp:BoundField DataField="ITEM_NAME" HeaderText="ITEM NAME" /> <asp:BoundField DataField="COLOR_CODE" HeaderText="COLOR CODE" /> <asp:BoundField DataField="COLOR_NAME" HeaderText="COLOR NAME" /> <asp:BoundField DataField="STOCK_NO" HeaderText="STOCK NUMBER" /> <asp:BoundField DataField="STOCK_IN_HAND" HeaderText="STOCK IN HAND" /> <asp:BoundField DataField="LOCATION_CD" HeaderText="LOCATION" /> <asp:TemplateField HeaderText="NO OF QUANTITY"> <ItemTemplate> <asp:TextBox CssClass="form-control" onkeyup="this.value=this.value.replace(/[^0-9]/g,'');" Placeholder="Enter The Correct Qty" ID="ADJqty" runat="server" AutoCompleteType="Disabled" Text=""></asp:TextBox> </ItemTemplate> </asp:TemplateField> </Columns> </asp:GridView>

Use this function check all the gridview check box

        function checkAll(objRef) {
            var GridView = objRef.parentNode.parentNode.parentNode;
            var inputList = GridView.getElementsByTagName("input");
            for (var i = 0; i < inputList.length; i++) {
                //Get the Cell To find out ColumnIndex
                var row = inputList[i].parentNode.parentNode;
                if (inputList[i].type == "checkbox" && objRef != inputList[i]) {
                    if (objRef.checked) {
                        //If the header checkbox is checked
                        //check all checkboxes
                        //and highlight all rows
                        row.style.backgroundColor = "#e3f1ff";
                        inputList[i].checked = true;
                        $('#DummyBTNAUTHLeave').prop('disabled', false);
                        $('#DummyBTNRJTLeave').prop('disabled', false);
                    }
                    else {
                        //If the header checkbox is checked
                        //uncheck all checkboxes
                        //and change rowcolor back to original
                        if (row.rowIndex % 2 == 0) {
                            //Alternating Row Color
                            row.style.backgroundColor = "rgba(0,0,0,.05)";
                        }
                        else {
                            row.style.backgroundColor = "white";
                        }
                        inputList[i].checked = false;
                        $('#DummyBTNAUTHLeave').prop('disabled', true);
                        $('#DummyBTNRJTLeave').prop('disabled', true);
                    }
                }
            }
        }

check the specifyed checkbox in gridview

        function Check_Click(objRef) {
            //Get the Row based on checkbox
            var row = objRef.parentNode.parentNode;
            if (objRef.checked) {
                //If checked change color to Aqua
                row.style.backgroundColor = "#e3f1ff";
            }
            else {
                //If not checked change back to original color
                if (row.rowIndex % 2 == 0) {
                    //Alternating Row Color
                    row.style.backgroundColor = "rgba(0,0,0,.05)";
                }
                else {
                    row.style.backgroundColor = "white";
                }
            }
            //Get the reference of GridView
            var GridView = row.parentNode;
            //Get all input elements in Gridview
            var inputList = GridView.getElementsByTagName("input");
            for (var i = 0; i < inputList.length; i++) {
                //The First element is the Header Checkbox
                var headerCheckBox = inputList[0];
                //Based on all or none checkboxes
                //are checked check/uncheck Header Checkbox
                var checked = true;
                if (inputList[i].type == "checkbox" && inputList[i] != headerCheckBox) {
                    if (!inputList[i].checked) {
                        checked = false;
                        break;
                    }
                }
            }
            headerCheckBox.checked = checked;
        }

Your answer could be improved with additional supporting information. Please edit to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers in the help center.

Collectives™ on Stack Overflow

Adding a checkbox column to asp.net gridview

2 Answers 2

8 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

8 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related