Hi i am using Telerik RadGrid control.in which I added FilterTemplate as RadCombobox for providing filter to particular column but That combobox is not looking proper.
PFA for screenshot of ComBobox.
Code:
<telerik:RadGrid ID="RadGridApplications" Skin="Metro" SkinID="Metro" AutoGenerateColumns="false"
OnNeedDataSource="RadGridApplications_NeedDataSource" AllowPaging="true" PageSize="10"
ShowStatusBar="true" AllowFilteringByColumn="true" runat="server">
<MasterTableView DataKeyNames="ProductID">
<Columns>
<telerik:GridBoundColumn DataField="ProductID" HeaderText="Application ID" HeaderStyle-Width="10%" AllowFiltering="false">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="Name" HeaderText="Application Name" HeaderStyle-Width="65%" AllowFiltering="false">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="Status" HeaderText="Status" HeaderStyle-Width="15%" FilterControlAltText="Status"
ReadOnly="true">
<FilterTemplate>
<telerik:RadComboBox ID="Status_filter" runat="server" Height="200px" Width="100%"
AppendDataBoundItems="true" OnClientSelectedIndexChanged="selectedindexchanged"
SelectedValue='<%# ((GridItem)Container).OwnerTableView.GetColumn("Status").CurrentFilterValue %>'>
<Items>
<telerik:RadComboBoxItem Text="Active" Value="Active"/>
<telerik:RadComboBoxItem Text="In-Active" Value="In-Active" ViewStateMode="enabled" />
</Items>
</telerik:RadComboBox>
<telerik:RadScriptBlock ID="radscriptblock1" runat="server">
<script type="text/javascript">
function selectedindexchanged(sender, args) {
var tableview = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");
tableview.filter("status", args.get_item().get_value(), "equalto");
}
</script>
</telerik:RadScriptBlock>
</FilterTemplate>
</telerik:GridBoundColumn>
<telerik:GridHyperLinkColumn Text="Edit" ItemStyle-CssClass="editlink" DataNavigateUrlFields="ProductID" HeaderStyle-Width="10%"
DataNavigateUrlFormatString="AddEditApplication.aspx?Mode=Edit&ID={0}" AllowFiltering="false">
</telerik:GridHyperLinkColumn>
</Columns>
</MasterTableView>
</telerik:RadGrid>
PFA for screenshot of ComBobox.
Code:
<telerik:RadGrid ID="RadGridApplications" Skin="Metro" SkinID="Metro" AutoGenerateColumns="false"
OnNeedDataSource="RadGridApplications_NeedDataSource" AllowPaging="true" PageSize="10"
ShowStatusBar="true" AllowFilteringByColumn="true" runat="server">
<MasterTableView DataKeyNames="ProductID">
<Columns>
<telerik:GridBoundColumn DataField="ProductID" HeaderText="Application ID" HeaderStyle-Width="10%" AllowFiltering="false">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="Name" HeaderText="Application Name" HeaderStyle-Width="65%" AllowFiltering="false">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="Status" HeaderText="Status" HeaderStyle-Width="15%" FilterControlAltText="Status"
ReadOnly="true">
<FilterTemplate>
<telerik:RadComboBox ID="Status_filter" runat="server" Height="200px" Width="100%"
AppendDataBoundItems="true" OnClientSelectedIndexChanged="selectedindexchanged"
SelectedValue='<%# ((GridItem)Container).OwnerTableView.GetColumn("Status").CurrentFilterValue %>'>
<Items>
<telerik:RadComboBoxItem Text="Active" Value="Active"/>
<telerik:RadComboBoxItem Text="In-Active" Value="In-Active" ViewStateMode="enabled" />
</Items>
</telerik:RadComboBox>
<telerik:RadScriptBlock ID="radscriptblock1" runat="server">
<script type="text/javascript">
function selectedindexchanged(sender, args) {
var tableview = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");
tableview.filter("status", args.get_item().get_value(), "equalto");
}
</script>
</telerik:RadScriptBlock>
</FilterTemplate>
</telerik:GridBoundColumn>
<telerik:GridHyperLinkColumn Text="Edit" ItemStyle-CssClass="editlink" DataNavigateUrlFields="ProductID" HeaderStyle-Width="10%"
DataNavigateUrlFormatString="AddEditApplication.aspx?Mode=Edit&ID={0}" AllowFiltering="false">
</telerik:GridHyperLinkColumn>
</Columns>
</MasterTableView>
</telerik:RadGrid>