This is a migrated thread and some comments may be shown as answers.
Need to Change RadGrid EditItemTemplate's Filter to Drop-Down List
5 Answers 38 Views
This is a migrated thread and some comments may be shown as answers.
Tonya
Top achievements
Rank 1
Tonya asked on 06 Dec 2018, 12:29 AM

I added an editable grid on my page, based on forum posts I found on this site (see attached images). The grid works as expected; however, the filtering & sorting do not.

In edit mode, the grid has a few drop-down lists using <EditItemTemplate>. Unfortunately, the default filter for these columns ends up being a textbox instead of a drop-down list. How can I change them? Also, these fields lose their sorting capability - the column headers can't be clicked, like the other columns in the grid.

If I change the tag from <EditItemTemplate> to <FilterTemplate> the filter becomes a drop-down list; but, then the fields are no longer listed on the edit screen (see attached image). 

How can I implement a grid that has both capabilities - a drop-down for editing & for filtering?

 

This is how I've implemented things...

ASPX page

<telerik:RadGrid ID="RadGrid2" RenderMode="Lightweight" runat="server" AutoGenerateColumns="false" AllowSorting="True" AllowPaging="True" ShowStatusBar="true" OnItemDataBound="RadGrid2_ItemDataBound" AllowFilteringByColumn="True" >

    <MasterTableView Name="PlantTypeGrid" DataKeyNames="ID" CommandItemDisplay="Top" ShowFooter="false" >
        <HeaderStyle Font-Bold="true"/>
        <Columns>
            <telerik:GridEditCommandColumn ButtonType="FontIconButton" />
            <telerik:GridCheckBoxColumn DataField="Active" HeaderText="Active" />
            <telerik:GridBoundColumn DataField="Description" HeaderText="Description" AllowFiltering="false" />
            <telerik:GridTemplateColumn HeaderText="Process Unit Category" UniqueName="ProcessUnitCategoryID" AllowFiltering="true" >
                <EditItemTemplate>
                    <telerik:RadDropDownList runat="server" ID="ddlProcessUnitCatTelerik" AppendDataBoundItems="true" >
                    </telerik:RadDropDownList>
                </EditItemTemplate>
            </telerik:GridTemplateColumn>
            <telerik:GridButtonColumn ConfirmText="Delete this Plant Type?" ConfirmDialogType="RadWindow" ConfirmTitle="Delete" CommandName="Delete" ButtonType="FontIconButton" />
        </Columns>
    </MasterTableView>
    <PagerStyle Mode="NextPrevAndNumeric" />
  </telerik:RadGrid>

VB Page

Private Sub BuildPlantTypeGrid()
    Dim myCollection As EMSLookupItems = Nothing
    myCollection = _lookupMgr.GetPlantTypes(-1, -1)
    If Not myCollection.Count = 0 Then
        RadGrid2.DataSource = myCollection.Items
    Else
        RadGrid2.DataSource = ""
    End If
End Sub

Protected Sub RadGrid2_ItemDataBound(ByVal sender As Object, ByVal e As GridItemEventArgs)

    If TypeOf e.Item Is GridEditableItem Then
        If e.Item.IsInEditMode Then
            Dim item As GridEditableItem = CType(e.Item, GridEditableItem)
            Dim mySubCollection As EMSLookupItems = Nothing
            Dim ddlProcessUnitCatTelerik As RadDropDownList = CType(item.FindControl("ddlProcessUnitCatTelerik"), RadDropDownList)
            ddlProcessUnitCatTelerik.Width = Unit.Pixel(300)

            If Not ddlProcessUnitCatTelerik Is Nothing Then
                mySubCollection = _lookupMgr.GetLookupValues("PROCESS_UNIT_CATEGORIES")
                If Not mySubCollection.Count = 0 Then
                    ddlProcessUnitCatTelerik.DataSource = mySubCollection.Items
                    ddlProcessUnitCatTelerik.DataValueField = "ID"
                    ddlProcessUnitCatTelerik.DataTextField = "Description"
                Else
                    ddlProcessUnitCatTelerik.DataSource = ""
                End If
                ddlProcessUnitCatTelerik.DataBind()
                ddlProcessUnitCatTelerik.Items.Insert(0, "Please Select...")
            End If
        End If
    End If
End Sub

 

5 Answers, 1 is accepted

Sort by
0
Attila Antal
Telerik team
answered on 10 Dec 2018, 05:10 PM
Hi Tonya,

RadGrid will only have one filter regardless whether it is editing an item or not. You can use filter template if you would like to change the built-in filter controls, and that change applies in all scenarios.

When using GridTemplateColumns, there are three different Templates that you can set. 


Once Template is used, whether it is for filtering, editing or displaying data, the functionalities must be implemented by the developer manually. 

Here are couple of online demos that you can check out and test. 

I hope the suggestions from above will help get a better understanding on working with Template Columns.

Please let us know if you have any questions.

Kind regards,

Attila Antal
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Tonya
Top achievements
Rank 1
answered on 10 Dec 2018, 08:57 PM

Attila-

Thanks! Now I'm 90% there!

I understand now that I needed to add <ItemTemplate> & <FilterTemplate> to my code, to get the value to show on the page & to change the filter from a textbox filter to a drop-down. Now, my problem is that the drop-down for the filter is not being populated (see attached pic).

I'm populating the drop-downs for my edit screen in the RadGrid2_ItemDataBound code (as shown in my original post). However, this only affects items inside the grid. Since the filter is outside the rows, I'm not sure how to access it to populate it.

All of the examples I've seen show the drop-down filters get populated by using <asp:SqlDataSource>. Can this not be done in the VB code?

 

ASPX page

<telerik:RadGrid ID="RadGrid2" RenderMode="Lightweight" runat="server" AutoGenerateColumns="false" AllowSorting="True" AllowPaging="True" ShowStatusBar="true" OnItemDataBound="RadGrid2_ItemDataBound" AllowFilteringByColumn="True" >

 

<telerik:GridTemplateColumn HeaderText="Process Unit Category" UniqueName="ProcessUnitCategoryID" AllowFiltering="true" >
    <ItemTemplate>
        <%# Eval("ProcessUnitCategoryID")%>
    </ItemTemplate>
    <EditItemTemplate>
        <telerik:RadDropDownList runat="server" ID="ddlProcessUnitCatTelerik" AppendDataBoundItems="true" >
        </telerik:RadDropDownList>
    </EditItemTemplate>
    <FilterTemplate>
        <telerik:RadDropDownList runat="server" ID="ddlProcessUnitCatFilter" AppendDataBoundItems="true"  >
        </telerik:RadDropDownList>
    </FilterTemplate>
</telerik:GridTemplateColumn>

 

0
Tonya
Top achievements
Rank 1
answered on 10 Dec 2018, 08:58 PM
Here's the missing pic
0
Tonya
Top achievements
Rank 1
answered on 10 Dec 2018, 09:01 PM
Hopefully the jpg will get posted this time.
0
Attila Antal
Telerik team
answered on 13 Dec 2018, 04:52 PM
Hi Tonya,

I am wondering how is the data bound to RadDropDownList in the FilterTemplate? It is not happening automatically, so you will need to handle that too.

Kind regards,
Attila Antal
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
Grid
Asked by
Tonya
Top achievements
Rank 1
Answers by
Attila Antal
Telerik team
Tonya
Top achievements
Rank 1
Share this question
or