CODEWITHSUNDEEP
c#javascripttelerikradgrid
R B
R B

Reputation: 423

Get selected items in a RadGrid client-side

I want to get the values of the selected checkbox in a RadGrid. I have a radgrid, textbox and a button as follows:

this._RadAjaxPanel.Controls.Add(RadGrid1);
this._RadAjaxPanel.Controls.Add(TextBox1);
this._RadAjaxPanel.Controls.Add(Buton1);

The radgrid id is set to RadGrid1 and

Button1.OnClientClick = "GetSelectedItems("+ this._RadGrid1 +")";

On click of the button a javascript is called where I want to know which rows have been selected. The javascript function is as follows but it is not correct:

 function GetSelectedItems(grid) {           
    var selectedRows = grid.get_selectedItems();
    for (var i = 0; i < selectedRows.length; i++) {
        var row = selectedRows[i];
        var cell = grid.getCellByColumnUniqueName(row, "CategoryID")
        //here cell.innerHTML holds the value of the cell    
    }
}

Please let me know how can I get the selected rows.

Upvotes: 2

Views: 11125

Answers (2)

R B
R B

Reputation: 423

I have tried the following, which solved my issue:

this._Button1.Attributes.Add("OnClick", "GetSelectedItems('" + _RadGrid1.ClientID + "');return false;");

Upvotes: 1

DanM7
DanM7

Reputation: 2246

Here is how to get whether or not a checkbox is selected. I am using a GridTemplateColumn with a CheckBox as the ItemTemplate, which Telerik always suggests using over the GridCheckBoxColumn.

The trick is to get the inner HTML in the cell, and parse out the name of the control. The cell value will be something like id=cbxRow where the CheckBox control's ID is cbxRow like in the below example.

JavaScript:

var grid = $find("RadGrid1");
var masterTableView = grid.get_masterTableView();
var selectedRows = masterTableView.get_selectedItems();

for (var i = 0; i < selectedRows.length; i++) {
    var cellCB = masterTableView.getCellByColumnUniqueName(row, "CB");
    var innerCB = cellCB.innerHTML;
    var locId = innerCB.indexOf("id=");
    var locIdEnd = innerCB.indexOf("\" ", locId);
    var idVal = innerCB.substr(locId + 4, locIdEnd - locId - 4);
    var cbx = document.getElementById(idVal);
    if (cbx.checked) {
        alert("The checkbox is checked!");
    }
    else {
        alert("The checkbox is not checked!");
    }
}

ASPX:

<telerik:GridTemplateColumn UniqueName="CB" ...>
    <ItemTemplate>
        <asp:CheckBox ID="cbxRow" runat="server">
    </ItemTemplate>
</telerik:GridTemplateColumn>

Upvotes: 3

Related Questions