I would like to format a column (datatype = "datetime") to display the date only. I had tried the following but not working.
headerText: "Date Received", key: "DateReceived", width: "150px", dataType: "datetime", format: "dd/MM/yyyy"
Please help.
Hi, Mr Pavlov,
Thank You for the previous post!
I use Inite UI 2012.2, MVC Wrapper. I don't have any errors in the browser console when I try to sort.
The problem is that I want to display date and time (+ seconds) in bg format but than the sorting by this column doesn't work. I've noticed that when date format contains dots for ex: "dd.MM.yyyy hh:mm:ss" , sorting doesn't work. Now I am using slashs and sorting has incorrect behavior! I think that it sorts date like strings data. I am sending You part of my code :
<script type="text/javascript" src="~/Content/ig/js/infragistics.loader.js"></script> <script type="text/javascript" src="~/Content/ig/js/jquery-ui-i18n.js"></script>
@(Html.Infragistics() .Loader() .ScriptPath(Url.Content("~/Content/ig/js/")) .CssPath(Url.Content("~/Content/ig/css/")) .Resources("igGrid.Selection,igGrid.Paging,igGrid.Sorting") .Theme("metro") .Locale("bg") .Regional("bg") .Render() )
and the grid:
<table id="grid"></table> @(Html.Infragistics().Grid(Model.SearchResult).ID("grid") .FixedHeaders(false).FixedFooters(false) .JQueryTemplating(true) .AutoGenerateColumns(false) .RenderCheckboxes(true) .Columns(column => {column.For(x => x.ConsumerName).HeaderText(Home.ConsumerName).DataType("string").Width("110px");column.For(x => x.StartTime).HeaderText(Home.StartDate).Format("dd/MM/yyyy hh:mm:ss").Width("150px"); column.For(x => x.EndTime).HeaderText(Home.EndDate).Format("dd/MM/yyyy hh:mm:ss").Width("150px"); })
.Features(features => { features.Sorting().Type(OpType.Local).Mode(SortingMode.Single).FirstSortDirection("ascending").ApplyColumnCss(false); features.Paging().Type(OpType.Local).PageSize(10).ShowPageSizeDropDown(false) .ShowPagerRecordsLabel(false) .VisiblePageCount(3) .PrevPageLabelText("") .NextPageLabelText("") .ShowFirstLastPages(false); features.Tooltips() .Visibility(TooltipsVisibility.Always) .ColumnSettings(settings => { settings.ColumnSetting().ColumnKey("ConsumerName").AllowTooltips(true);settings.ColumnSetting().ColumnKey("StartTime").AllowTooltips(true); settings.ColumnSetting().ColumnKey("EndTime").AllowTooltips(false); }) .CursorTopOffset(10) .ShowDelay(100); features.Resizing().AllowDoubleClickToResize(true).DeferredResizing(true).ColumnSettings(settings => { settings.ColumnSetting().ColumnKey("ConsumerName").MinimumWidth(140);settings.ColumnSetting().ColumnKey("StartTime").MinimumWidth(140); settings.ColumnSetting().ColumnKey("EndTime").MinimumWidth(140); }); features.Selection().Mode(SelectionMode.Row).MultipleSelection(false); }).Width("940").DataBind().Render())
I am hoping that this is enough information.
Hi Marylka,
From your description is not obvious what the problem can be. Format only affects the presentation of the data, so it should not be the cause of the sorting problem.
One reason can be a bug.
Another reason can be the JSON date column serialization.
I need more data in order to further analyze your problem. Here are my questions:
What is your Ignite UI version (including service release)?
What is your jQuery and jQuery UI versions?
Are you using the Ignite UI MVC Wrapper to provide the data?
What type of sorting are you using (local or remote)?
Do you get any JavaScript errors in the browser console when you try to sort?
It will be good if you provide a simple sample reproducing the issue.
Best regards,
Martin Pavlov
Infragistics, Inc.
Hello,
I have a problem with formated date in column of grid. I am using Razor syntax for the grid. Locate and region are bg, one of the column has DataType("date").Format("dateTime"), but now it isn't imposible to sort this column. Could you help me?
I am just following up to see if you need any further assistance with this matter.
I have attached a sample which uses CDN references using generated dates on the client side. If the dates are coming from a backend, encoded as UTC; I would recommend you to set enableUTCDates property of grid to true as shown below:
$(".selector").igGrid({ enableUTCDates : true });
Refer to the “OPTIONS” tab from the API documents on the link below:
http://help.infragistics.com/jQuery/2012.2/ui.iggrid
You can also modify the sample I have provided to look in to the behavior you described.
I hope this helps.