Radgrid - persisting checkboxes when page size/Index changes on Clientside

Question

Using the Rad grid client side event when loading the grid.

<ClientSettings>
     <Selecting AllowRowSelect="false" />
          <ClientEvents OnGridCreated="GridCreated"  />
</ClientSettings>

I am storing the checked checkboxes in an array containing the id of the first column of grid which is primary key of the table.

the checkbox is as

<ItemTemplate>
   <asp:CheckBox ID="chkSelectRow" runat="server" ClientIDMode="Static"></asp:CheckBox>
</ItemTemplate>

the OnClick Evnet is binded on Item Databound event like this.

chkSelectRow.Attributes.Add("onclick", "RowCheckChanged('" + index +","+chkSelectRow.Checked+"');");

My jscript for this

<script type="text/jscript">
//Enpty array for storing the selected rows of grid.
var selected = {};

//On grid row checked changed
function RowCheckChanged(sender) {
    var args = sender.split(",");
    var currentRowIndex = args[0];
    var checkedStatus = args[1];
    var gridCaseInfo = $find("<%=grdCaseInfo.ClientID %>");
    var currentrow = gridCaseInfo.get_masterTableView().get_dataItems()[currentRowIndex];
    RowSelectionChanged(gridCaseInfo, currentrow)
}

//On grid row selection changed
function RowSelectionChanged(sender, args) {
    var CaseInfoKey = args.getDataKeyValue("CaseInfoID");
    if (args.findElement("chkSelectRow").checked) {
        selected[CaseInfoKey] = true;
    }
    else {
        selected[CaseInfoKey] = false;
    }
}

function GridCreated(sender, eventArgs) {
    debugger;
    var masterTable = sender.get_masterTableView();
//traverse stored id's
    $jQuery.each(selected, function (i) {
//traverse gridrows for id's
        $jQuery.each(masterTable.get_dataItems(), function (j) {
// if it maches then make checkbox selected.
            if ((masterTable.get_dataItems()[j].getDataKeyValue("CaseInfoID") == i)) {
                var currentrow = masterTable.get_dataItems()[j];
                currentrow.findElement("chkSelectRow").checked = true;
                return false;
            }
        });
    });
}

I don't know why but it makes the first checkbox checked if there is any entry in selected array.

Answer 1

Finally Find the solution

Changes the grid created method as

function GridCreated(sender, eventArgs) {
var masterTable = sender.get_masterTableView();
//traverse stored id's
$jQuery.each(selected, function (i) {
//traverse gridrows for id's
    $jQuery.each(masterTable.get_dataItems(), function (j) {
// if it maches then make checkbox selected.
        if ((masterTable.get_dataItems()[j].getDataKeyValue("CaseInfoID") == i)) {
            //changed How to find the Current row
            var currentrow = masterTable.get_dataItems()[j].get_cell("CheckBoxTemplateColumn").firstElementChild.firstElementChild;
           //Then  to check it.
            currentrow.checked = true;
            return false;
        }
    });
});
}

Answer 2

Replace all $jQuery to $ or jQuery and try like,

jQuery.each(selected, function (i) {
....