RadDropdownList in itemtemplate and EditItemTemplate

[Mohammed]

I am trying to create a RadGrid that shows RadDropDownList in both ItemTemplate and EditTemplate.

When the user clicks on the the dropdown list in ItemTemplate mode and changes the selected item and then clicks off the grid to collapse the dropdown list, the red icon does not appear in the top corner of the cell to show a change has been. When the grid is saved the changes are not saved and the value remains the same as it was before the user made the change.

However if the user clicks on the actual cell (the space on the side of the dropdown list in the same column) then changes the selected item, the red icon appears and the change is saved as expected.

I'm assuming this is because the grid only enters batch edit mode when the cell is clicked but when the dropdown list itself is clicked it remains in the ItemTemplate and shows the dropdown list that is in ItemTemplate mode.

What is the fix for this?

Code:

<telerik:RadGrid ID="RadGrid1" runat="server" DataSourceID="sqlDisplayRegisters" AllowSorting="True" AutoGenerateColumns="False" ShowStatusBar="True"
    AllowFilteringByColumn="false" OnItemCommand="RadGrid1_ItemCommand" OnBatchEditCommand="RadGrid1_BatchEditCommand">
    <GroupingSettings CaseSensitive="false" />
    <MasterTableView AutoGenerateColumns="False" DataSourceID="sqlDisplayRegisters" DataKeyNames="RegID" EditMode="Batch" CommandItemDisplay="Bottom"
        NoMasterRecordsText="There are no registers for this selection" >
        <CommandItemSettings ShowAddNewRecordButton="false"  SaveChangesText="Submit Register" ShowCancelChangesButton="false" ShowRefreshButton="false"  />
        <CommandItemStyle Font-Size="Larger"/>
            <Columns>
                <telerik:GridBoundColumn HeaderStyle-Width="10%" DataType="System.String" DataField="P_Forename" HeaderText="Forename"
                    SortExpression="P_Forename" UniqueName="P_Forename" ReadOnly="true"></telerik:GridBoundColumn>
                <telerik:GridTemplateColumn FilterControlWidth="60%" DataField="Mark" FilterControlAltText="Filter Mark column"
                    HeaderText="Mark" UniqueName="Mark" SortExpression="Mark" DataType="System.String">
                    <HeaderStyle Width="80px" HorizontalAlign="Left" />
                    <ItemTemplate>
                         <telerik:RadDropDownList runat="server" ID="ddlMarkItem" DataSourceID="SqlDataSource1" DataValueField="Code" DataTextField="Description"
                             SelectedValue=<%# Eval("Mark") %> >
                        </telerik:RadDropDownList>
                    </ItemTemplate>
                    <EditItemTemplate>
                         <telerik:RadDropDownList runat="server" ID="ddlMarkEdit" DataSourceID="SqlDataSource1" DataValueField="Code" DataTextField="Description">
                        </telerik:RadDropDownList>
                    </EditItemTemplate>
                </telerik:GridTemplateColumn>
            </Columns>
    </MasterTableView>
    <ClientSettings>
        <Selecting AllowRowSelect="true" />
    </ClientSettings>
</telerik:RadGrid>

[Mohammed]

Anyone have any ideas?

[Viktor Tachev]

Hi Mohammed,

As I described in the support ticket you have submitted such functionality is not available out of the box. It will interfere with the default functionality of RadGrid.

In order for a cell to be placed in edit mode the user needs to click in the cell itself. If there is another component there the cell will not enter edit mode. As a result this will be unexpected behavior from the user's perspective as they would think the cell was edited.

I would recommend to use the approach illustrated in the Batch Edit mode demo for RadGrid. Note the Category column for reference.

• http://demos.telerik.com/aspnet-ajax/grid/examples/data-editing/batch-editing/defaultcs.aspx

Regards,
Viktor Tachev
Telerik by Progress

[Mohammed]

The problem with only showing the current value in preview mode and not the dropdown is some of the users won't know they can change the value by clicking on it because it is only displayed as a label, whereas if a dropdown is displayed in preview mode the user will know it can be changed.

Would it be possible to enter edit mode programmatically on client side when a dropdown is first clicked before it expands? or for the grid to enter edit mode as soon as the page is loaded so preview mode is never shown? 

[Viktor Tachev]

Hi,

Placing all cells for a column in edit mode at the same time is not possible. This is because only a single editor is used per column when Batch editing is enabled. The Grid is using complex internal logic to show and hide that editor and set its value accordingly.

In order to use dropdown controls in both preview and edit mode you would need to implement complex logic that synchronizes the values between the two dropdown controls and set the value for the cell manually.

Such logic will introduce a lot of overhead and can result in unwanted behavior from RadGrid. Thus, I strongly recommend not to go that route.

I recommend using the built-in features for RadGrid and use a DropDown control only in edit mode. This would ensure best performance for your application. Moreover, there will be smaller chance of errors due to additional custom logic.


Regards,
Viktor Tachev
Telerik by Progress