This is a migrated thread and some comments may be shown as answers.
DESPERATE - DetailsTable, checkbox, checkall
1 Answer 11 Views
This is a migrated thread and some comments may be shown as answers.
John
Top achievements
Rank 1
John asked on 27 Aug 2015, 03:15 PM

All

I've been messing with a couple of problems far too long and I desperately need some help.

I have a RadGrid, EditMode=Batch, with 1:M DetailsTable

I have 2 major problems

1. Checkbox ​and edit mode. I know you can't select a checkbox. I have this kind of working using a GridTemplateColumn instead of a GridCheckboxColumn. It works fine in Chrome using code below, but in IE and FF, it still requires 2 clicks.

2. I need to add a CheckAll Button or Checkbox in the footer of each DetailsTable/GridTableView Flag column that will force all checkboxes in that single DetailsTable to checked, even if they are already checked. All samples work with MasterTable only and I can't figure out how to have it iterate in javascript through the particular DetailsTable.

PLEASE, any help or direction would be most appreciated.

            <telerik:RadGrid ID="RadGrid1" runat="server" CssClass="transparentRadGrid" AllowPaging="False"
                AllowSorting="True" AutoGenerateColumns="False" ShowStatusBar="False" AllowAutomaticDeletes="True"
                AllowAutomaticInserts="True" AllowAutomaticUpdates="True" DataSourceID="sdsGrid1"
                Width="99%" ShowGroupPanel="False" AllowFilteringByColumn="False" AutoGenerateHierarchy="True"
                ShowHeader="false" EnableLinqExpressions="false" >
                <SortingSettings EnableSkinSortStyles="False" />
                <MasterTableView Name="MasterTableView" CommandItemDisplay="None" DataSourceID="sdsGrid1"
                    DataKeyNames="SubSystemID" AllowSorting="True" Width="100%" EditMode="InPlace"
                    HierarchyDefaultExpanded="true" NoMasterRecordsText="No SubSystems have been created. Create a SubSystem by clicking the green + button above." >
                    <DetailTables>
                        <telerik:GridTableView AllowAutomaticInserts="false" Name="DetailTableView" TableLayout="Fixed" CommandItemDisplay="None"
                            ShowHeader="true" ShowFooter="true" HierarchyLoadMode="ServerBind" EnableHierarchyExpandAll="true"
                            EditMode="Batch" DataKeyNames="SystemRowID" DataSourceID="sdsGrid3" Width="100%"
                            runat="server" NoDetailRecordsText="No Parts in this SubSystem." >
                            <CommandItemStyle HorizontalAlign="Right" />
                            <CommandItemSettings ShowRefreshButton="false" ShowAddNewRecordButton="false" RefreshText="" AddNewRecordText=""
                                CancelChangesText="" SaveChangesText="" />
                            <BatchEditingSettings EditType="Row" />
                            <ParentTableRelation>
                                <telerik:GridRelationFields DetailKeyField="SubSystemID" MasterKeyField="SubSystemID" />
                            </ParentTableRelation>
                            <Columns>
                                <telerik:GridBoundColumn UniqueName="SystemRowID" HeaderText="ID" DataField="SystemRowID"
                                    DataType="System.Int32" ReadOnly="True" SortExpression="SystemRowID" Visible="false" />
 
....(other fields)...
                                <telerik:GridTemplateColumn HeaderText="Flag" SortExpression="Flag" UniqueName="Flag">
                                    <ItemTemplate>
                                        <asp:CheckBox id="cbFlag" runat="server" checked='<%# Bind("Flag") %>' onclick="changeEditor(this);" />
                                    </ItemTemplate>
                                    <EditItemTemplate>
                                        <asp:CheckBox ID="cbFlag" runat="server" Checked='<%# Bind("Flag") %>' />
                                    </EditItemTemplate>
                                    <FooterTemplate>
                                        <input type="checkbox" runat="server" value="check" ID="checkbox" onclick="checkAll();"  />
                                    </FooterTemplate>
                                    <HeaderStyle Width="40px" HorizontalAlign="Center" />
                                    <ItemStyle HorizontalAlign="Center" />
                                </telerik:GridTemplateColumn>
                            </Columns>
                            <FooterStyle />
                        </telerik:GridTableView>
                    </DetailTables>
                    <Columns>
                        <telerik:GridBoundColumn UniqueName="SubSystemID" HeaderText="ID" DataField="SubSystemID"
                            DataType="System.Int32" ReadOnly="True" SortExpression="SubSystemID" Display="False" />
 
                        <telerik:GridTemplateColumn HeaderText="SubSystem Name" SortExpression="SubSystemName"
                            UniqueName="SubSystemName">
                            <ItemTemplate>
                                <asp:Label ID="SubSystemName" runat="server" Text='<%# Eval("SubSystemName").ToUpper %>' />
                            </ItemTemplate>
                            <InsertItemTemplate>
                                SubSystem Name: 
                                <telerik:RadTextBox ID="SubSystemName" runat="server" Text='<%# Bind("SubSystemName") %>'
                                    Width="200px" MaxLength="100" />
                                <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="SubSystemName"
                                    ErrorMessage="SubSystem Name is required." Text="*" />
                            </InsertItemTemplate>
                            <EditItemTemplate>
                                SubSystem Name: 
                                <telerik:RadTextBox ID="SubSystemName" runat="server" Text='<%# Bind("SubSystemName") %>'
                                    Width="200px" MaxLength="100" />
                                <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="SubSystemName"
                                    ErrorMessage="SubSystem Name is required." Text="*" />
                            </EditItemTemplate>
                            <ItemStyle Font-Bold="true" Font-Size="Larger" Width="400px" />
                        </telerik:GridTemplateColumn>
 
                        <telerik:GridTemplateColumn HeaderText="Phase" SortExpression="Phase" UniqueName="Phase">
                            <ItemTemplate>
                                <asp:Label ID="Phase" runat="server" Text='<%# Eval("Phase") %>' />
                            </ItemTemplate>
                            <InsertItemTemplate>
                                Phase: 
                                <telerik:RadDropDownList ID="Phase" runat="server" AppendDataBoundItems="true" DataSourceID="sdsProjectPhases"
                                    DataTextField="Phase" DataValueField="PhaseID" SelectedValue='<%# Bind("PhaseID") %>'
                                    Skin='<%# Session("UserSkin") %>' />
                            </InsertItemTemplate>
                            <EditItemTemplate>
                                Phase: 
                                <telerik:RadDropDownList ID="Phase" runat="server" AppendDataBoundItems="true" DataSourceID="sdsProjectPhases"
                                    DataTextField="Phase" DataValueField="PhaseID" SelectedValue='<%# Bind("PhaseID") %>'
                                    Skin='<%# Session("UserSkin") %>' />
                            </EditItemTemplate>
                            <ItemStyle Font-Size="Larger" />
                        </telerik:GridTemplateColumn>
 
                        <telerik:GridEditCommandColumn UniqueName="EditCommandColumn" ButtonType="ImageButton"
                            Exportable="false">
                            <ItemStyle Width="40px" />
                        </telerik:GridEditCommandColumn>
                        <telerik:GridButtonColumn CommandName="Delete" Text="Delete" ButtonType="ImageButton"
                            ConfirmText="Are you sure you want to delete this record?" Exportable="false">
                            <ItemStyle Width="23px" />
                        </telerik:GridButtonColumn>
                    </Columns>
                </MasterTableView>
                <ClientSettings AllowKeyboardNavigation="True" AllowDragToGroup="false" EnableRowHoverStyle="true"
                    AllowColumnsReorder="False" ReorderColumnsOnClient="false">
                    <%--<ClientEvents OnKeyPress="keyPress" />--%>
                </ClientSettings>
            </telerik:RadGrid>
 
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
        <script type="text/javascript">
            function checkAll() {
                var grid = $find("<%=RadGrid1.ClientID%>");
                var detailTables = grid.get_detailTables(0);
                setSelectedToAllDataItems(detailTables[1].get_dataItems(), true);
                //var items = grid.get_masterTableView().get_dataItems();
                //for (var i = 0; i < detailTables.length; i++) {
                    //alert(i);
                    //var cb = detailTables.get_dataItems()[i].findElement("cbFlag");
                    //cb.checked = !cb.checked;
                    //checkBox2.checked obj.checked;
                    //setSelectedToAllDataItems(detailTables[i].get_dataItems(), true);
                    //grid.get_batchEditingManager().openRowForEdit(sender.parentElement.parentElement.parentElement);
                //}
            }
            function setSelectedToAllDataItems(dataItems, selected) {
                for (var i = 0; i < dataItems.length; i++) {
                    alert(i);
                    //dataitems[i].get_cell("cbDisplay"), true);
                    //dataItems[i].set_selected(selected);
 
                    var cb = dataItems[1].get_cell("Flag");
                    var checkBox2 = detailTables.get_dataItems()[i].findElement("cbFlag");
                    checkBox2.checked = obj.checked;
                }
            }
 
            function changeEditor(sender, args) {
                var grid = $find("<%=RadGrid1.ClientID%>");
                var batchManager = grid.get_batchEditingManager();
                //grid.get_batchEditingManager().openRowForEdit(sender.parentElement.parentElement);
                grid.get_batchEditingManager().openRowForEdit(sender.parentElement.parentElement.parentElement);
                sender.checked = !sender.checked;
            }
 
            function refreshGrid() {
                var masterTable = $find("<%=radGrid1.clientId%>").get_masterTableView();
                masterTable.rebind();
            }
            function saveGridChanges(sender, args) {
                var grid = $find("<%=RadGrid1.ClientID%>");
                var batchManager = grid.get_batchEditingManager();
                batchManager.saveAllChanges();
                //__doPostBack("btnSaveAll", "");
            }
            function cancelGridChanges() {
                var masterTable = $find("<%=radGrid1.clientId%>").get_masterTableView();
                masterTable.rebind();
            }
        </script>
    </telerik:RadCodeBlock>

1 Answer, 1 is accepted

Sort by
0
Viktor Tachev
Telerik team
answered on 01 Sep 2015, 11:51 AM
Hello John,

I have prepared a sample WebSite project where the functionality is implemented. It is working as expected on my end. Try to use similar approach and let me know how it works for you.


Regards,
Viktor Tachev
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Tags
Grid
Asked by
John
Top achievements
Rank 1
Answers by
Viktor Tachev
Telerik team
Share this question
or