Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
180
Restrict filtering options to only String type columns
posted

Hi,

I want the user to only filter on String type columns in my webdatagrid and that too with only "Equals" and "Clear" options. I have hidden the other filtering options on String type columns using CSS but on int and DateTime columns, there are many filters available. How do I disable filtering on these columns of non string data type.

I have the following markup on grid. I am using WebDatagrid V12.2

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<table>
<tr>
<td>
<asp:ImageButton ID="ImageButton" runat="server"/>
</td>
<td>
<asp:Label ID="lblHeader" runat="server" Text=""></asp:Label>
</td>
</tr>
</table>
<asp:Button runat="server" ID="saveLayoutBtn" Text="Save" OnClick="SaveBtn_Click" ToolTip="Save current grid layout"/>
<asp:PlaceHolder ID="placeHolder" runat="server" ></asp:PlaceHolder>
<asp:Label ID="notificationLbl" runat="server" Text="" Font-Bold="true"></asp:Label>
<asp:Panel ID="Panel" runat="server">
<ig:WebDataGrid ID="UltraWebGrid" runat="server" oninitializerow="UltraWebGrid_InitializeRow"
EnableRelativeLayout="false" HeaderCaptionCssClass="GridHeaderCaption"
OnInit="UltraWebGrid_Init" onrowupdated="UltraWebGrid_RowUpdated" OnRowUpdating="UltraWebGrid_RowUpdating" OnColumnMoved="UltraWebGrid_ColumnMoved"
EnableAjax="true" EnableAjaxViewState="true" EnableDataViewState="True" OnColumnResized="UltraWebGrid_ColumnResized" OnColumnSorted="UltraWebGrid_ColumnSorted"
OnDataFiltered="UltraWebGrid_DataFiltered">
<Behaviors>
<ig:Sorting >
</ig:Sorting>
<ig:ColumnMoving EnableInheritance="True">
</ig:ColumnMoving>

<ig:Filtering FilterType="RowFilter">
</ig:Filtering>
<ig:ColumnResizing EnableInheritance="True" >
</ig:ColumnResizing>

<ig:EditingCore AutoCRUD="false">
<EditingClientEvents CellValueChanged="UltraWebGrid_Editing_CellValueChanged" />
<Behaviors>
<ig:CellEditing>
<CellEditingClientEvents />
<EditModeActions EnableOnActive="True" MouseClick="Single" />
</ig:CellEditing>
</Behaviors>
</ig:EditingCore>
</Behaviors>
</ig:WebDataGrid>
</asp:Panel>
<%-- <asp:Button ID="saveBtn" runat="server" Text="Save" />--%>
<asp:CollapsiblePanelExtender ID="Panel_CollapsiblePanelExtender" runat="server"
Enabled="True" TargetControlID="Panel" CollapseControlID="ImageButton" ExpandControlID="ImageButton"
CollapsedImage="~/ig_res/Default/images/igsli_MinusFocusV.gif"
ExpandedImage="~/ig_res/Default/images/igsli_PlusFocusV.gif"
ImageControlID="ImageButton">
</asp:CollapsiblePanelExtender>
</ContentTemplate>
</asp:UpdatePanel>

<!-- Hiding other filters except equals using CSS-->
<style type="text/css">
.igg_FilterRuleDropDown ul li[mkr="DoesNotEqual_item"],
.igg_FilterRuleDropDown ul li[mkr="BeginsWith_item"],
.igg_FilterRuleDropDown ul li[mkr="EndsWith_item"],
.igg_FilterRuleDropDown ul li[mkr="Contains_item"],
.igg_FilterRuleDropDown ul li[mkr="DoesNotContain_item"],
.igg_FilterRuleDropDown ul li[mkr="IsNull_item"],
.igg_FilterRuleDropDown ul li[mkr="IsNotNull_item"]
{
display: none;
}
</style>

<script type="text/javascript">
function UltraWebGrid_Editing_CellValueChanged(grid, args) {
grid.get_behaviors().get_editingCore().commit();
}

function PostExtenderState(data) {
dataString = "{'id' :'" + data + "'}";
jQuery.ajax({
type: 'POST',
url: "Default.aspx/SetExtender",
data: dataString,
contentType: "application/json; charset=utf-8",
dataType: "json",
processData: 'false'
});
}

</script>

Please let me know if this is possible and I am using Row Filter type. I switched from Excel type filtering so the user can store the columns and their values which is not possible in Excel style filtering.

  • 1740
    Offline posted

    Hello Pulihara,

    I couldn't reproduce your sample, that's why I've made a new sample. I'm showing how you can hide by css your filter dropdown items (item by item), and also I'm showing how you can hide all filter dropdown for numeric and dataTime type fields, by selecting through css their id's attributes that contains this types. In my sample has a comments that can navigate you. 

    If you have further questions, please feel free to contact us.

    WebDataGrid.zip