Get datakeyvalue of multiple selected rows using checkbox at client side

3 posts, 0 answers
  1. Priyanka
    Priyanka avatar
    34 posts
    Member since:
    Dec 2014

    Posted 31 Dec 2014 Link to this post

    I have RadGrid on web page with ckeckbox inside it.

    I want to fetch "datakey value" of multiple selected rows using checkbox at client side on button(which is outside RadGrid) click.

    I tried below code but its not working:
    <telerik:RadGrid ID="RadGrid1" EnableViewState="false" runat="server" AllowPaging="true" OnItemDataBound="RadGrid1_ItemDataBound"
                            AllowSorting="False" AllowFilteringByColumn="true" GridLines="None" OnInit="RadGrid1_Init" OnDeleteCommand="RadGrid1_DeleteCommand" >
                            <ItemStyle Wrap="false"></ItemStyle>
                            <MasterTableView AllowMultiColumnSorting="true" TableLayout="Fixed" DataKeyNames="Id" ClientDataKeyNames="Id">
                                <Columns>     
                                    <telerik:GridTemplateColumn UniqueName="SelectRow" HeaderText="Select" AllowFiltering="false" HeaderStyle-Width="20px">
                                        <ItemTemplate>
    <telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
    <script type="text/javascript">
        function getDataKeyValues(chk) {
                
            //find datakeyvalue of selected row
            var masterTable = $find("<%=RadGrid1.ClientID%>").get_masterTableView();
            var count = masterTable.get_dataItems().length;
            var checkbox;
            var item;
            for (var i = 0; i < count; i++) {
                item = masterTable.get_dataItems()[i];
                checkbox = item.findElement("CheckBox1");
                if (checkbox.checked) {
                    var dataKeyValue = item.getDataKeyValue("Id");
                    //alert(dataKeyValue);
                   
                    var hiddenValue = document.getElementById("hdn_Id"); //get Id inside Hidden field
                    hiddenValue.value = dataKeyValue;
                    alert(hiddenValue.value);
                }
            }
        }
    </script>
    </telerik:RadScriptBlock>
                                            <asp:CheckBox ID="CheckBox1" runat="server" />
                                        </ItemTemplate>
                                    </telerik:GridTemplateColumn>
                                    <telerik:GridNumericColumn UniqueName="Id" DataField="Id" HeaderText="Id" HeaderStyle-Width="20px" AllowFiltering="False">
                                    </telerik:GridNumericColumn>
                                    <telerik:GridBoundColumn DataField="Description" HeaderText="Description" AndCurrentFilterFunction="Contains" FilterListOptions="AllowAllFilters" HeaderStyle-Width="100px">
                                    </telerik:GridBoundColumn>
                                   
                                </Columns>
                            </MasterTableView>
                            <PagerStyle AlwaysVisible="true" Mode="NumericPages"></PagerStyle>
                            <ClientSettings>
                                <Selecting  AllowRowSelect="true" />
                                <ClientEvents OnCommand="RadGrid1_Command" OnRowDataBound="RadGrid1_RowDataBound"></ClientEvents>
                            </ClientSettings>
                        </telerik:RadGrid>
    <br />
                        <asp:HiddenField ID="hdn_Id" runat="server" />
                        <asp:Button ID="btnPrint" runat="server" Text="Print" CssClass="btn btn-primary" OnClick="btnPrint_Click" />


    protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
            {
                if(e.Item is GridDataItem)
                {   
                    GridDataItem item = (GridDataItem)e.Item;
                    CheckBox chk = (CheckBox)item.FindControl("CheckBox1");
                    chk.Attributes.Add("onclick", "getDataKeyValues(this);");
                }
            }
     
    protected void btnPrint_Click(object sender, EventArgs e)
            {
                funTax();
                foreach(GridDataItem item in RadGrid1.MasterTableView.Items)
                {
                    CheckBox check = (CheckBox)item.FindControl("CheckBox1");               
                    if (check.Checked == true)
                    {
                        string itemId = hdn_Id.Value;
                        //Response.Redirect("~/Test.aspx?Id=" + itemId);
                    }
                }
            }
  2. Priyanka
    Priyanka avatar
    34 posts
    Member since:
    Dec 2014

    Posted 01 Jan 2015 in reply to Priyanka Link to this post

    In above Javscript code I can successfully retrieve datakeyvalue of all the selected rows inside Hiddenfield.
    But when I am trying to fetch the hidden field value in code behind on button click, it only shows datakeyvalue for last selected row of Grid not all selected.

    Example: If I had selected checkbox with Id: 1, 3, 6 then in Javscript code, I am getting all the three selected rows datakeyvalue inside Hiddenfield.
    But when I am trying to fetch the same hidden field values on button click, I get only last selected value i.e., 6

    Please reply what is wrong ? I also need to pass the multiple selected datakeyvalue on other page
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Priyanka
    Priyanka avatar
    34 posts
    Member since:
    Dec 2014

    Posted 03 Jan 2015 in reply to Priyanka Link to this post

    Modified javascript as below, and its working fine now.
    <telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
    <script type="text/javascript">
        function getDataKeyValues(chk) {
            
            //find datakeyvalue of selected row
            var masterTable = $find("<%=RadGrid1.ClientID%>").get_masterTableView();
            var count = masterTable.get_dataItems();       
            var checkbox;
            var item;
            var res = "";
            for (var i = 0; i < count.length; i++) {
                item = masterTable.get_dataItems()[i];
                checkbox = item.findElement("CheckBox1");
                if (checkbox.checked) {
                    var dataKeyValue = item.getDataKeyValue("Id");
                    res += dataKeyValue+",";
                    //window.location = "PrintInvoice.aspx?id=" + dataKeyValue;
                }
            }
            var hiddenValue = document.getElementById("hdn_Id"); //get selected row's Id's inside Hidden field
            hiddenValue.value = res;
        }
    </script>
    </telerik:RadScriptBlock>
    Thank you
Back to Top