Hello,
I am going to start telerik controls into my projects and so first of all creating sample apps to become familiar with the controls.
For Radgrid, my requirement is as follows for the filters:
1. If I have a "GridDateTimeColumn" into my grid and I don't want to use <FilterTemplate> for the "From" and "To" date pickers. And I wanted the Between operator always for DateFilters and I added a Reset Filter button also to reset that Date filter. So, to achieve that I did some changes intoItemCreated event. Everything is working like a charm. The issue comes when user is trying to enter the same dates into From and To date pickers nd press <Tab> key, its not filtering the grid. I tried to debug the code and I found that the the FilterExpression of grid getting built like this:
(([ShippingDate] >= '2/3/2020,12:00:00,AM') AND ([ShippingDate] <= '2/3/2020,12:00:00,AM'))
Time is included here. So, can you please help me out for this issue.
2. How can I validate the filter for the column where I want to display the currency or a number value. It is right now allowing me to enter any text I want. It should allow me to enter digits and decimal only.
For the assistance, I am attaching a sample project here which can describe what I am trying to achieve.
Thanks in advance. Please look into these issues and try to assist me ASAP.
Regards,
Vertis Software
ASPX Page code
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestFilters.aspx.cs" Inherits="RadGridFilters.TestFilters" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
<script type="text/javascript">
function ResetCurrentDateColumnFilter(dateFilterUniqueName, radgridClientID) {
var masterTableView = $find(radgridClientID).get_masterTableView();
masterTableView.filter(dateFilterUniqueName, "", Telerik.Web.UI.GridFilterFunction.NoFilter);
}
</script>
</telerik:RadCodeBlock>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager runat="server" ID="TestFilterScriptManager" />
<telerik:RadAjaxLoadingPanel runat="server" ID="TestFilterRadAjaxLoadingPanel" />
<telerik:RadAjaxManager ID="RadAjaxLoadingPanelRadAjaxManager" runat="server" DefaultLoadingPanelID="TestFilterRadAjaxLoadingPanel">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="TestFilterRadGrid">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="TestFilterRadGrid" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManager>
<table style="width: 900px; padding-left: 250px;">
<tr>
<td>
<telerik:RadGrid ID="TestFilterRadGrid" runat="server" Skin="Outlook" Width="600px"
GridLines="None" AllowSorting="true" AllowPaging="true" AllowFilteringByColumn="true" AutoGenerateColumns="false"
EnableLinqExpressions="false" OnNeedDataSource="TestFilterRadGrid_NeedDataSource" OnItemCreated="TestFilterRadGrid_ItemCreated">
<PagerStyle Mode="NextPrevAndNumeric" AlwaysVisible="true" />
<MasterTableView TableLayout="Fixed" CommandItemDisplay="None" Width="100%">
<Columns>
<telerik:GridBoundColumn UniqueName="ShippedToPerson" HeaderText="Shipped To" AutoPostBackOnFilter="true"
DataField="ShippedToPerson" DataType="System.String" HeaderStyle-Width="150px" CurrentFilterFunction="Contains" />
<telerik:GridDateTimeColumn UniqueName="ShippingDate" HeaderText="Shipping Date" AutoPostBackOnFilter="true"
DataField="ShippingDate" DataType="System.DateTime" HeaderStyle-Width="150px" CurrentFilterFunction="Between"
PickerType="DatePicker" EnableRangeFiltering="true" ShowFilterIcon="false" />
<telerik:GridBoundColumn UniqueName="Amount" HeaderText="Amount" AutoPostBackOnFilter="true"
DataField="Amount" DataType="System.Double" HeaderStyle-Width="150px" CurrentFilterFunction="EqualTo"
DataFormatString="{0:C}" />
</Columns>
<CommandItemSettings ShowExportToWordButton="false" ShowExportToExcelButton="true"
ShowExportToCsvButton="false" ShowExportToPdfButton="false" />
</MasterTableView>
<GroupingSettings CaseSensitive="false" />
</telerik:RadGrid>
</td>
</tr>
</table>
</form>
</body>
</html>
ASPX.CS Page code
public partial class TestFilters : Page
{
protected void TestFilterRadGrid_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)
{
DataTable dataTable = new DataTable();
dataTable.Columns.Add(new DataColumn("ShippedToPerson", typeof(string)));
dataTable.Columns.Add(new DataColumn("ShippingDate", typeof(DateTime)));
dataTable.Columns.Add(new DataColumn("Amount", typeof(double)));
for (int index = 1; index <= 10; index++)
{
DataRow row = dataTable.NewRow();
row["ShippedToPerson"] = string.Format("Person {0}", index);
row["ShippingDate"] = DateTime.Now.AddDays(index);
row["Amount"] = 1.4 * index;
dataTable.Rows.Add(row);
}
TestFilterRadGrid.DataSource = dataTable;
}
protected void TestFilterRadGrid_ItemCreated(object sender, GridItemEventArgs e)
{
if (e.Item is GridFilteringItem)
{
GridFilteringItem filters = e.Item as GridFilteringItem;
if (filters == null)
return;
foreach (GridTableCell control in filters.Controls)
{
if (control.Column.DataType == typeof(DateTime))
{
string dateFilterUniqueName = control.Column.UniqueName;
LiteralControl fromLiteralControl = filters[dateFilterUniqueName].Controls[0] as LiteralControl;
if (fromLiteralControl != null)
fromLiteralControl.Text = string.Format("<span style='padding-right: 2px; vertical-align: top;'>{0}:</span>", "From");
LiteralControl toLiteralControl = filters[dateFilterUniqueName].Controls[3] as LiteralControl;
if (toLiteralControl != null)
toLiteralControl.Text = string.Format("<br /><span style='padding-right: 18px; vertical-align: top;'>{0}:</span>", "To");
ImageButton clearCurrentDateFilterButton = new ImageButton();
clearCurrentDateFilterButton.ID = dateFilterUniqueName;
clearCurrentDateFilterButton.ImageUrl = "clearFilter.png";
clearCurrentDateFilterButton.ToolTip = "Reset Filter";
clearCurrentDateFilterButton.Attributes.Add("style", "width: 19px; vertical-align: top; padding-left: 2px;");
clearCurrentDateFilterButton.Attributes.Add("onclick", string.Format("javascript: ResetCurrentDateColumnFilter('{0}', '{1}'); return false;",
dateFilterUniqueName, TestFilterRadGrid.ClientID));
filters[dateFilterUniqueName].Controls.AddAt(6, clearCurrentDateFilterButton);
}
}
}
}
}
8 Answers, 1 is accepted
Rank 1
Hi Vertis,
Judging by the description, you may overcome this problem by setting a couple of properties in the Grid.
For the first issue you have described, you try setting the EnableTimeIndependentFiltering property of the GridDateTimeColumn to True and see if that works.
<telerik:GridDateTimeColumn EnableTimeIndependentFiltering="true"></telerik:GridDateTimeColumn>For the second issue, I suggest using GridNumericColumn. This column was designed specifically to allow only numeric values. To see a list of Column types visit the Column Types article. You can also check out our online demo with the different column types at Grid - Column Types
Keep in mind, that Template columns are there to allow the developer to add additional/custom functionality that is not included out of the box. Everything inside the Template column has to be handled by the developer, meaning that, if you are using Template columns for both Date and Numeric values, you will also need to implement the input validation manually. One to allow only dates, the other to allow only numbers.
Kind regards,
Attila Antal
Progress Telerik
Rank 1
Hi Attila Antal,
First of all thank you so much for the response for the issues. And your suggestions are working like a charm for me.
One more thing if you can help me with will be really appreciable:
I want to have a simple cross kind of button into the string filter textboxes and once user started typing then those should become available and user should be able to remove the filter by clicking on that small image. and if user remove the text manually by using keyboard then that image should be disappeared. I am attaching an image for the reference.
Thanks
Hi Vertis,
That functionality you have described is beyond the RadTextBox's capabilities. You will need to implement that additionally.
Take a look at the following article to see how Peter implemented the ShowPassord button for the RadTextBox: ShowPassword button for RadTextBox with TextMode Password.
You can follow this approach and implement a close ( x ) icon there instead of the eye and when that Icon is clicked, clear the TextBox value.
Kind regards,
Attila Antal
Progress Telerik
Rank 1
Hi Attila Antal,
Thanks once again for the reply and I tried to implement the same kind of methodology in RadGrid filters into my project. But I was facing some issues actually. For your kind reference I am pasting my code here and I am sure you will be able to solve my issues.
Here is the .aspx file code:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestFilters.aspx.cs" Inherits="TestProject.TestFilters" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<style type="text/css">
.textFiltersCrossButtonCss {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
position: absolute;
top: 1px;
bottom: 1px;
z-index: 2;
width: 20px;
background: #fff url('../remove.png') 85% 50% no-repeat;
cursor: pointer;
visibility: hidden;
opacity: 0;
transition: opacity .2s ease 0s,visibility 0s linear .2s;
}
</style>
<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
<script type="text/javascript">
function ResetCurrentDateColumnFilter(dateFilterUniqueName, radgridClientID) {
var masterTableView = $find(radgridClientID).get_masterTableView();
masterTableView.filter(dateFilterUniqueName, "", Telerik.Web.UI.GridFilterFunction.NoFilter);
}
function IsNumericKey(event) {
if ((window.event.keyCode >= 48 && window.event.keyCode <= 57) ||
event.key === ',' || event.key === '.' || event.key === '$') {
return true;
}
return false;
}
function ResponseEnd(sender, eventArgs) {
var endTime = new Date();
}
function onRequestStart(sender, args) {
if (args.get_eventTarget().indexOf("ExportToExcelButton") >= 0 || args.get_eventTarget().indexOf("ExportToPdfButton") >= 0) {
args.set_enableAjax(false);
}
}
var gridColumn = null;
//get current column of radgrid as an object when clicked on filter icon.
function OnFilterMenuShowing(sender, eventArgs) {
gridColumn = eventArgs.get_column();
}
//reset the filter menu options for radgrid columns.
function ReduceGridFilterMenuOptions(sender, args) {
if (gridColumn === null)
return;
var menu = sender;
var items = menu.get_items();
var columnDataType = gridColumn.get_dataType();
var item;
if (columnDataType === "System.String") {
var i = 0;
while (i < items.get_count()) {
if (!(items.getItem(i).get_value() in { 'NoFilter': '', 'Contains': '', 'NotEqualTo': '', 'EqualTo': '' })) {
item = items.getItem(i);
if (item !== null)
item.set_visible(false);
}
else {
item = items.getItem(i);
if (item !== null) {
item.set_text(item.get_text().replace(/([A-Z])/g, ' $1').trim());
item.set_visible(true);
}
}
i++;
}
} else if (columnDataType === "System.Int16" || columnDataType === "System.Int32" || columnDataType === "System.Int64" ||
columnDataType === "System.Decimal" || columnDataType === "System.Double") {
var j = 0;
while (j < items.get_count()) {
if (!(items.getItem(j).get_value() in { 'NoFilter': '', 'GreaterThan': '', 'LessThan': '', 'NotEqualTo': '', 'EqualTo': '' })) {
item = items.getItem(j);
if (item !== null)
item.set_visible(false);
}
else {
item = items.getItem(j);
if (item !== null) {
item.set_text(item.get_text().replace(/([A-Z])/g, ' $1').trim());
item.set_visible(true);
}
}
j++;
}
}
gridColumn = null;
menu.repaint();
}
function SetCrossIconStyle(element, width) {
element.css({ "display": "block" });
element.css({ "visibility": "visible" });
element.css({ "opacity": "1" });
element.css({ "transition": "opacity .2s ease 0s,visibility 0s linear 0s;" });
element.css({ "left": width - 20 });
}
function HideCrossIconStyle(element) {
element.css({ "display": "" });
element.css({ "visibility": "" });
element.css({ "opacity": "" });
element.css({ "transition": "" });
element.css({ "left": "" });
}
function CrossIcon_Click(textBox) {
textBox.value = '';
HideCrossIconStyle($(textBox).parent().find(".textFiltersCrossButtonCss"));
}
function ShowHideTextFilterCrossButton(event, sender) {
var $textFiltersCrossButtonCss = $(sender).parent().find(".textFiltersCrossButtonCss");
if (sender.value !== "") {
SetCrossIconStyle($textFiltersCrossButtonCss, parseInt(sender.style.width));
} else {
HideCrossIconStyle($textFiltersCrossButtonCss);
}
$textFiltersCrossButtonCss.on({
mousedown: function () {
CrossIcon_Click(sender);
}
});
}
</script>
</telerik:RadCodeBlock>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager runat="server" ID="TestFilterScriptManager" />
<telerik:RadAjaxLoadingPanel runat="server" ID="TestFilterRadAjaxLoadingPanel" />
<telerik:RadAjaxManager ID="RadAjaxLoadingPanelRadAjaxManager" runat="server">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="TestFilterRadGrid">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="TestFilterRadGrid" LoadingPanelID="TestFilterRadAjaxLoadingPanel" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
<ClientEvents OnResponseEnd="ResponseEnd" OnRequestStart="onRequestStart" />
</telerik:RadAjaxManager>
<table style="width: 900px; padding-left: 250px;">
<tr>
<td>
<telerik:RadGrid ID="TestFilterRadGrid" runat="server" Skin="Outlook" Width="99%" GridLines="None"
AllowSorting="true" AllowPaging="true" AllowFilteringByColumn="true" AutoGenerateColumns="false" EnableLinqExpressions="true"
OnNeedDataSource="TestFilterRadGrid_NeedDataSource" OnPreRender="TestFilterRadGrid_PreRender"
OnItemCommand="TestFilterRadGrid_ItemCommand" OnItemCreated="TestFilterRadGrid_ItemCreated"
OnGridExporting="TestFilterRadGrid_GridExporting" OnPdfExporting="TestFilterRadGrid_PdfExporting">
<PagerStyle Mode="NextPrevAndNumeric" AlwaysVisible="true" />
<GroupingSettings CaseSensitive="false" />
<MasterTableView TableLayout="Fixed" CommandItemDisplay="Top">
<CommandItemTemplate>
<div style="float: right; height: 22px; margin: 4px 7px 0 0;">
<asp:ImageButton ID="RefreshGridButton" runat="server" ImageUrl="~/refresh-icon.png"
CommandName="RebindGrid" ToolTip="Refresh" Height="19px" style="padding: 0 2px;" />
<asp:ImageButton ID="ExportToExcelButton" runat="server" ImageUrl="~/ExcelExport.png"
CommandName="ExportToExcel" ToolTip="Export To Excel" Height="19px" style="padding: 0 2px;" />
<asp:ImageButton ID="ExportToPdfButton" runat="server" ImageUrl="~/PdfExport.png"
CommandName="ExportToPdf" ToolTip="Export To Pdf" Height="19px" style="padding: 0 2px;" />
</div>
</CommandItemTemplate>
<Columns>
<telerik:GridBoundColumn UniqueName="ShippedToPerson" HeaderText="Shipped To" DataField="ShippedToPerson" DataType="System.String"
CurrentFilterFunction="Contains" AutoPostBackOnFilter="true" FilterControlWidth="100px">
<HeaderStyle HorizontalAlign="Left" VerticalAlign="Top" Width="200px" />
<ItemStyle HorizontalAlign="Left" VerticalAlign="Top" />
</telerik:GridBoundColumn>
<telerik:GridDateTimeColumn UniqueName="ShippingDate" HeaderText="Shipping Date" DataField="ShippingDate" DataType="System.DateTime"
CurrentFilterFunction="Between" AutoPostBackOnFilter="true" FilterControlWidth="65px" ShowFilterIcon="false" PickerType="DatePicker"
EnableTimeIndependentFiltering="true" EnableRangeFiltering="true">
<HeaderStyle HorizontalAlign="Left" VerticalAlign="Top" Width="170px" />
<ItemStyle HorizontalAlign="Left" VerticalAlign="Top" />
</telerik:GridDateTimeColumn>
<telerik:GridNumericColumn UniqueName="Amount" HeaderText="Amount" DataField="Amount" DataType="System.Double"
CurrentFilterFunction="EqualTo" AutoPostBackOnFilter="true" FilterControlWidth="60px" DataFormatString="{0:C}">
<HeaderStyle HorizontalAlign="Right" VerticalAlign="Top" Width="150px" />
<ItemStyle HorizontalAlign="Right" VerticalAlign="Top" />
</telerik:GridNumericColumn>
</Columns>
</MasterTableView>
<ClientSettings AllowColumnsReorder="true" AllowKeyboardNavigation="true" ReorderColumnsOnClient="true" ColumnsReorderMethod="Reorder">
<Resizing AllowColumnResize="true" AllowResizeToFit="true" EnableRealTimeResize="false" ResizeGridOnColumnResize="true" ClipCellContentOnResize="false" />
<Scrolling AllowScroll="true" UseStaticHeaders="true" SaveScrollPosition="false" />
<Selecting AllowRowSelect="true" />
<ClientEvents OnFilterMenuShowing="OnFilterMenuShowing" />
</ClientSettings>
<FilterMenu OnClientShowing="ReduceGridFilterMenuOptions" />
</telerik:RadGrid>
</td>
</tr>
</table>
</form>
</body>
</html>
-------------------------------------------------------------------------------------------------------------------------------------------------------------
Here is the .aspx.cs file code:
using System;
using System.Collections.Generic;
using System.Data;
using System.Text;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using Telerik.Web.UI;
namespace TestProject
{
#region enumerations
public enum HideRadGridFilters
{
ExportToExcel = 0,
ExportToPdf = 1
}
public enum PdfOrientation
{
Portrait = 0,
Landscape = 1
}
#endregion
public partial class TestFilters : Page
{
#region private constants
private const string defaultFontNameForExport = "Segoe UI";
#endregion
#region private properties
HideRadGridFilters? HideFiltersForExport { get; set; }
string ExportedFileName { get; set; }
List<string> HiddenColumnsList { get; set; }
PdfOrientation ExportedPdfOrientation { get; set; }
#endregion
#region radgrid events for performing tasks like export grid, hide filters in exporting, setting export file attributes etc
protected void Page_Load(object sender, EventArgs e)
{
GridFilterFunction.IllegalStrings = new string[] { " LIKE ", " AND ", " OR ", "\"", ">", "<", "<>", " NULL ", " IS " };
//setting parameters for the export functionaliy.
HiddenColumnsList = new List<string>();
ExportedFileName = string.Empty;
ExportedPdfOrientation = PdfOrientation.Portrait;
}
protected void TestFilterRadGrid_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)
{
string[] names = { "John Cena", "Garret Gray", "Munendra Kumar", "Adam Gilchrist", "Dion Smith", "Nick Hindle",
"Chris Carpenter", "Ryan North", "Jack Daniel", "Tyler Walker", "Paul Dicosta", "Ted Nitz", "Catlin Rios", "Pam Kegal",
"Ryan Pichkota", "Philip Parker", "Susan Abott", "James Barker", "Steve Smith", "Eric Pruitt"};
DataTable dataTable = new DataTable();
dataTable.Columns.Add(new DataColumn("ShippedToPerson", typeof(string)));
dataTable.Columns.Add(new DataColumn("ShippingDate", typeof(DateTime)));
dataTable.Columns.Add(new DataColumn("Amount", typeof(double)));
for (int index = 1; index <= 20; index++)
{
DataRow row = dataTable.NewRow();
row["ShippedToPerson"] = string.Format("{0}", names[index - 1]);
row["ShippingDate"] = DateTime.Now.AddDays(index);
row["Amount"] = 1907.46 * index;
dataTable.Rows.Add(row);
}
TestFilterRadGrid.DataSource = dataTable;
}
protected void TestFilterRadGrid_PreRender(object sender, EventArgs e)
{
HideFiltersForExport = HideFiltersInExportingData((RadGrid)sender, HideFiltersForExport);
}
protected void TestFilterRadGrid_ItemCommand(object sender, GridCommandEventArgs e)
{
HideFiltersForExport = ExportRadgridData((RadGrid)sender, e, HideFiltersForExport, ExportedFileName, HiddenColumnsList, ExportedPdfOrientation);
}
protected void TestFilterRadGrid_ItemCreated(object sender, GridItemEventArgs e)
{
if (e.Item is GridFilteringItem)
{
SetRadgridFilterAppearance(e, ((RadGrid)sender).ClientID);
}
if (HideFiltersForExport.HasValue && HideFiltersForExport == HideRadGridFilters.ExportToPdf && e.Item is GridHeaderItem)
{
SetPdfColumnHeaderWidthAndAlignment((RadGrid)sender);
}
if (HideFiltersForExport.HasValue && HideFiltersForExport == HideRadGridFilters.ExportToPdf && e.Item is GridDataItem)
{
SetPdfColumnDataAlignment(e);
}
}
protected void TestFilterRadGrid_GridExporting(object sender, GridExportingArgs e)
{
if (e.ExportType == ExportType.Excel)
{
StringBuilder cssToUpdate = new StringBuilder();
cssToUpdate.Append("<style>body { border: 0.1pt solid #CCCCCC; } td { border: 0.1pt solid;");
cssToUpdate.AppendFormat("font-family: '{0}';", defaultFontNameForExport);
cssToUpdate.Append("font-size: 9pt; }</style>");
e.ExportOutput = e.ExportOutput.Replace("</head>", cssToUpdate.ToString() + "</head>").Replace("width:100%;", "width:50%;");
}
}
protected void TestFilterRadGrid_PdfExporting(object sender, GridPdfExportingArgs e)
{
e.RawHTML = e.RawHTML.Replace("width:100%;", "width:50%;font-size:8px;");
}
#endregion
#region private methods
private static void SetRadgridFilterAppearance(GridItemEventArgs eventArgs, string radgridClientID)
{
GridFilteringItem filters = eventArgs.Item as GridFilteringItem;
if (filters == null)
return;
foreach (GridTableCell control in filters.Controls)
{
GridColumn column = control.Column;
if (column.Display && column.SupportsFiltering())
{
if (column.DataType == typeof(string))
{
TextBox textbox = filters[column.UniqueName].Controls[0] as TextBox;
Button button = filters[column.UniqueName].Controls[1] as Button;
HtmlGenericControl textFiltersCrossButtonSpan = new HtmlGenericControl();
textFiltersCrossButtonSpan.Attributes.Add("class", "textFiltersCrossButtonCss");
textbox.Attributes.Add("onkeyup", "ShowHideTextFilterCrossButton(event, this);");
HtmlGenericControl wrapperDiv = new HtmlGenericControl();
wrapperDiv.Attributes.Add("style", "display: inline-block; position: relative;");
wrapperDiv.Controls.Add(textbox);
wrapperDiv.Controls.Add(textFiltersCrossButtonSpan);
wrapperDiv.Controls.Add(button);
control.Controls.Add(wrapperDiv);
}
else if (column.DataType == typeof(long) || column.DataType == typeof(int) || column.DataType == typeof(short) ||
column.DataType == typeof(double) || column.DataType == typeof(decimal))
{
filters[column.UniqueName].HorizontalAlign = HorizontalAlign.Right;
RadNumericTextBox numericTextbox = filters[column.UniqueName].Controls[0] as RadNumericTextBox;
numericTextbox.Attributes.Add("onkeypress", "return IsNumericKey(event);");
}
else if (column.DataType == typeof(DateTime))
{
LiteralControl fromLiteralControl = filters[column.UniqueName].Controls[0] as LiteralControl;
LiteralControl toLiteralControl = filters[column.UniqueName].Controls[3] as LiteralControl;
RadDatePicker fromDateControl = filters[column.UniqueName].Controls[1] as RadDatePicker;
RadDatePicker toDateControl = filters[column.UniqueName].Controls[4] as RadDatePicker;
if (fromLiteralControl != null)
fromLiteralControl.Text = string.Format("<span style='padding-right: 2px; vertical-align: top;'>{0}:</span>", "From");
if (toLiteralControl != null)
toLiteralControl.Text = string.Format("<br /><span style='padding-right: 18px; vertical-align: top;'>{0}:</span>", "To");
if (fromDateControl != null)
fromDateControl.Width = Unit.Pixel(100);
if (toDateControl != null)
toDateControl.Width = Unit.Pixel(100);
ImageButton clearCurrentDateFilterButton = new ImageButton()
{
ID = column.UniqueName,
ImageUrl = "clearFilter.png",
ToolTip = "Clear"
};
clearCurrentDateFilterButton.Attributes.Add("style", "width: 19px; vertical-align: top; padding-left: 2px;");
clearCurrentDateFilterButton.Attributes.Add("onclick", string.Format("javascript: ResetCurrentDateColumnFilter('{0}', '{1}'); return false;",
column.UniqueName, radgridClientID));
filters[column.UniqueName].Controls.AddAt(6, clearCurrentDateFilterButton);
}
}
}
}
private static HideRadGridFilters? ExportRadgridData(RadGrid radGrid, GridCommandEventArgs e, HideRadGridFilters? hideRadGridFilters,
string fileName, List<string> hiddenColumnsList, PdfOrientation exportedPdfOrientation)
{
if (e.CommandName == RadGrid.ExportToExcelCommandName || e.CommandName == RadGrid.ExportToPdfCommandName)
{
radGrid.ExportSettings.ExportOnlyData = true;
radGrid.ExportSettings.IgnorePaging = true;
radGrid.ExportSettings.OpenInNewWindow = true;
radGrid.ExportSettings.HideStructureColumns = true;
if (!string.IsNullOrEmpty(fileName))
{
radGrid.ExportSettings.FileName = fileName;
}
foreach (string columnToHide in hiddenColumnsList)
{
radGrid.MasterTableView.GetColumn(columnToHide).Visible = false;
}
}
if (e.CommandName == RadGrid.RebindGridCommandName)
{
radGrid.Rebind();
}
else if (e.CommandName == RadGrid.ExportToExcelCommandName)
{
radGrid.ExportSettings.Excel.Format = GridExcelExportFormat.Html;
hideRadGridFilters = HideRadGridFilters.ExportToExcel;
}
else if (e.CommandName == RadGrid.ExportToPdfCommandName)
{
if (exportedPdfOrientation == PdfOrientation.Landscape)
{
radGrid.ExportSettings.Pdf.PageHeight = Unit.Parse("210mm");
radGrid.ExportSettings.Pdf.PageWidth = Unit.Parse("297mm");
}
radGrid.ExportSettings.Pdf.BorderType = GridPdfSettings.GridPdfBorderType.AllBorders;
radGrid.ExportSettings.Pdf.PageTopMargin = 30;
radGrid.ExportSettings.Pdf.PageBottomMargin = 30;
radGrid.ExportSettings.Pdf.PageLeftMargin = 30;
radGrid.ExportSettings.Pdf.PageRightMargin = 20;
hideRadGridFilters = HideRadGridFilters.ExportToPdf;
}
return hideRadGridFilters;
}
private static HideRadGridFilters? HideFiltersInExportingData(RadGrid radGrid, HideRadGridFilters? hideRadGridFilters)
{
if (hideRadGridFilters.HasValue &&
(hideRadGridFilters == HideRadGridFilters.ExportToExcel || hideRadGridFilters == HideRadGridFilters.ExportToPdf))
{
GridFilteringItem filterItem = (GridFilteringItem)radGrid.MasterTableView.GetItems(GridItemType.FilteringItem)[0];
filterItem.Visible = false;
}
return null;
}
private static void SetPdfColumnHeaderWidthAndAlignment(RadGrid radGrid)
{
foreach (GridHeaderItem headerItem in radGrid.MasterTableView.GetItems(GridItemType.Header))
{
foreach (GridColumn column in radGrid.MasterTableView.Columns)
{
if (column.Display)
{
if (column.ColumnType == "GridTemplateColumn" && column.HeaderStyle.Width.Value > 80)
{
column.HeaderStyle.Width = column.ItemStyle.Width = Unit.Pixel((int)column.HeaderStyle.Width.Value / 2);
headerItem[column.UniqueName].HorizontalAlign = HorizontalAlign.Left;
headerItem[column.UniqueName].Style.Add("padding-left", "3px;");
}
else if (column.DataType == typeof(string) && column.HeaderStyle.Width.Value > 80)
{
column.HeaderStyle.Width = column.ItemStyle.Width = Unit.Pixel((int)column.HeaderStyle.Width.Value / 2);
headerItem[column.UniqueName].HorizontalAlign = HorizontalAlign.Left;
headerItem[column.UniqueName].Style.Add("padding-left", "3px;");
}
else if (column.DataType == typeof(long) || column.DataType == typeof(int) || column.DataType == typeof(short) ||
column.DataType == typeof(double) || column.DataType == typeof(decimal))
{
column.HeaderStyle.Width = column.ItemStyle.Width = Unit.Pixel(65);
headerItem[column.UniqueName].HorizontalAlign = HorizontalAlign.Right;
headerItem[column.UniqueName].Style.Add("padding-right", "5px");
}
else if (column.DataType == typeof(DateTime))
{
column.HeaderStyle.Width = column.ItemStyle.Width = Unit.Pixel(60);
headerItem[column.UniqueName].HorizontalAlign = HorizontalAlign.Left;
headerItem[column.UniqueName].Style.Add("padding-left", "3px;");
}
headerItem[column.UniqueName].Style.Add("font-family", defaultFontNameForExport);
}
headerItem[column.UniqueName].VerticalAlign = VerticalAlign.Top;
}
}
}
private static void SetPdfColumnDataAlignment(GridItemEventArgs eventArgs)
{
GridDataItem item = eventArgs.Item as GridDataItem;
foreach (GridTableCell control in item.Controls)
{
GridColumn column = control.Column;
if (column.Display)
{
if (column.ColumnType == "GridTemplateColumn")
{
item[column.UniqueName].HorizontalAlign = HorizontalAlign.Left;
item[column.UniqueName].Style.Add("padding-left", "3px");
}
else if (column.DataType == typeof(string))
{
item[column.UniqueName].HorizontalAlign = HorizontalAlign.Left;
item[column.UniqueName].Style.Add("padding-left", "3px");
}
else if (column.DataType == typeof(long) || column.DataType == typeof(int) || column.DataType == typeof(short) ||
column.DataType == typeof(double) || column.DataType == typeof(decimal))
{
item[column.UniqueName].HorizontalAlign = HorizontalAlign.Right;
item[column.UniqueName].Style.Add("padding-right", "5px");
}
else if (column.DataType == typeof(DateTime))
{
item[column.UniqueName].HorizontalAlign = HorizontalAlign.Left;
item[column.UniqueName].Style.Add("padding-left", "3px");
}
item[column.UniqueName].Style.Add("font-family", defaultFontNameForExport);
}
item[column.UniqueName].VerticalAlign = VerticalAlign.Top;
}
}
#endregion
}
}
The issue is when I started searching into the string column it show me the CROSS symbol and as soon as I hit tab or press enter it did filter the data but the actual filter text which I typed and CROSS symbol goes away. So can you please help me out so that after searching the text into the grid, the filter text and CROSS symbol still remains there.
For the references, I attached the screenshots and also attached the images which are in use in the code units.
Rank 1
Rank 1
Hi Attila Antal,
Any updates for my queries which I posted above on 13 March?
Please keep me posted ASAP as I am in need of the requested functionality.
Thanks,
Vertis
Hi Vertis,
If the articles I have shared did not help achieve the desired behavior, I suggest that you open a formal support ticket and we will discuss them further. With the support ticket, you will also have the benefit to receive an answer within a guaranteed 24 hours.
Kind regards,
Attila Antal
Progress Telerik
Our thoughts here at Progress are with those affected by the outbreak.