jQuery UI Widgets › Forums › Grid › Sorting Dates with occasional string
This topic contains 5 replies, has 2 voices, and was last updated by Benji6996 11 years, 6 months ago.
-
Author
-
I have a grid that contains a date column. However, every now and again the value is a string instead of a date like so:
Logged In
————————-
17-April-2013 20:32
16-April-2013 06:21
Never
17-April-2013 21:04Is it possible to either, make this column sortable but ignore the ‘Never’ values and just treat them as 00-January-0000 00:00, or can I specify a value for an empty field instead of passing ‘Never’ as a string from my JSON?
Thanks in Advance
B
Hi Benji6996,
Please take a look at the following example at: http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/index.htm#demos/jqxgrid/customsorting.htm . The sample shows how to implement custom sort comparer function.
If you have any further questions do not hesitate to contact us.
Best Wishes,
MariyajQWidgets Team
http://www.jqwidgets.comBrilliant, thank you very much
Whilst your reply was very helpful and has pointed me in the right direction, I was wandering whether you could help me further?
I do not want to override the sorting algorithm for the grid, especially as the sorting algorithm for dates is quite complex and jqWidgets does it brilliantly… Instead, what I would like to do is treat any none date value in the column as a date of 00-January-0000 00:00. Effectively the cell would have a date value but display as a string. Is this possible?
Alternatively, could I instead override the sort function with my own (as you have suggested) to simply separate the strings from the dates, and then call the jQWidgets sort method to sort the dates, then I could simply add my strings to the end or the beginning of the data table? In other words, is it possible and how can I call the JQWidgets sort method on an array or object containing custom data?
Thanks in advance
Hi Benji6996,
The “Never” value is interpreted as Min Date by default.
<!DOCTYPE html><html lang="en"><head> <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" /> <script type="text/javascript" src="../../scripts/jquery-1.8.3.min.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxdata.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxscrollbar.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxmenu.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgrid.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgrid.edit.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgrid.sort.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgrid.selection.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxlistbox.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxdropdownlist.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxcheckbox.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxcalendar.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxnumberinput.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxdatetimeinput.js"></script> <script type="text/javascript" src="../../jqwidgets/globalization/globalize.js"></script> <script type="text/javascript" src="../../scripts/gettheme.js"></script> <script type="text/javascript" src="generatedata.js"></script> <script type="text/javascript"> $(document).ready(function () { var theme = ''; // prepare the data var data = generatedata(200); data[0].date = "Never"; var source = { localdata: data, datatype: "array", updaterow: function (rowid, rowdata, commit) { // synchronize with the server - send update command // call commit with parameter true if the synchronization with the server is successful // and with parameter false if the synchronization failder. commit(true); }, datafields: [ { name: 'firstname', type: 'string' }, { name: 'lastname', type: 'string' }, { name: 'productname', type: 'string' }, { name: 'available', type: 'bool' }, { name: 'quantity', type: 'number' }, { name: 'price', type: 'number' }, { name: 'date', type: 'date' } ] }; var dataAdapter = new $.jqx.dataAdapter(source); // initialize jqxGrid $("#jqxgrid").jqxGrid( { width: 685, source: dataAdapter, editable: true, sortable: true, selectionmode: 'multiplecellsadvanced', columns: [ { text: 'First Name', columntype: 'textbox', datafield: 'firstname', width: 80 }, { text: 'Last Name', datafield: 'lastname', columntype: 'textbox', width: 80 }, { text: 'Product', columntype: 'dropdownlist', datafield: 'productname', width: 195 }, { text: 'Available', datafield: 'available', columntype: 'checkbox', width: 67 }, { text: 'Ship Date', datafield: 'date', columntype: 'datetimeinput', width: 110, align: 'right', cellsalign: 'right', cellsformat: 'd', validation: function (cell, value) { if (value == "") return true; var year = value.getFullYear(); if (year >= 2014) { return { result: false, message: "Ship Date should be before 1/1/2014" }; } return true; } }, { text: 'Quantity', datafield: 'quantity', width: 70, align: 'right', cellsalign: 'right', columntype: 'numberinput', validation: function (cell, value) { if (value < 0 || value > 150) { return { result: false, message: "Quantity should be in the 0-150 interval" }; } return true; }, createeditor: function (row, cellvalue, editor) { editor.jqxNumberInput({ decimalDigits: 0, digits: 3 }); } }, { text: 'Price', datafield: 'price', align: 'right', cellsalign: 'right', cellsformat: 'c2', columntype: 'numberinput', validation: function (cell, value) { if (value < 0 || value > 15) { return { result: false, message: "Price should be in the 0-15 interval" }; } return true; }, createeditor: function (row, cellvalue, editor) { editor.jqxNumberInput({ digits: 3 }); } } ] }); }); </script></head><body class='default'> <div id='jqxWidget'> <div id="jqxgrid"></div> </div></body></html>
Best Wishes,
MariyajQWidgets Team
http://www.jqwidgets.comHow odd! I tested this before and it didn’t work… Must have been something else in my code.
Thank you very much
-
AuthorPosts
You must be logged in to reply to this topic.