DevExtreme
DevExtreme copied to clipboard
DataSource: fix OData filters behavior using Dates
fixes 1204
1.1) set default behavior deserializeDates to false (before it was undefined but it was counted as true)
1.2) if fieldType for field is not specified - then it will be automatically solved for date
2.2) It was achived by adding additional regexp check/statement to serialize func
3) to verify you can use that example 'paste the following code to playground'
<!DOCTYPE html>
<html lang="en">
<head>
<title>DevExtreme jQuery Example</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="text/javascript">
const currentThemeId = localStorage.getItem("currentThemeId") || "light";
const link = document.createElement("link");
link.href = `../artifacts/css/dx.${currentThemeId}.css`;
link.type = "text/css";
link.rel = "stylesheet";
document.getElementsByTagName("head")[0].appendChild(link);
</script>
<script type="text/javascript" src="../artifacts/js/jquery.js"></script>
<!-- HtmlEditor -->
<!-- <script type="text/javascript" src="../artifacts/js/dx-quill.min.js"></script> -->
<!--<script type="text/javascript" src="../artifacts/js/cldr.js"></script>
<script type="text/javascript" src="../artifacts/js/cldr/event.js"></script>
<script type="text/javascript" src="../artifacts/js/cldr/supplemental.js"></script>
<script type="text/javascript" src="../artifacts/js/cldr/unresolved.js"></script>
<script type="text/javascript" src="../artifacts/js/globalize.js"></script>
<script type="text/javascript" src="../artifacts/js/globalize/message.js"></script>
<script type="text/javascript" src="../artifacts/js/globalize/number.js"></script>
<script type="text/javascript" src="../artifacts/js/globalize/currency.js"></script>
<script type="text/javascript" src="../artifacts/js/globalize/date.js"></script>-->
<!--
<script type="text/javascript" src="../artifacts/js/dx-exceljs-fork.min.js"></script>
<script type="text/javascript" src="../artifacts/js/FileSaver.min.js"></script>
<script type="text/javascript" src="../artifacts/js/jszip.min.js"></script>
<script type="text/javascript" src="../artifacts/js/jspdf.umd.min.js"></script>
<script type="text/javascript" src="../artifacts/js/jspdf.plugin.autotable.min.js"></script>
-->
<script type="text/javascript" src="../artifacts/js/dx.all.debug.js" charset="utf-8"></script>
<script type="text/javascript" src="./themeSelector.js"></script>
<script type="text/javascript" src="../../../node_modules/axe-core/axe.min.js"></script>
</head>
<body class="dx-surface">
<div role="main">
<h1 style="position: fixed; left: 0; top: 0; clip: rect(1px, 1px, 1px, 1px);">Test header</h1>
<div class="dx-viewport demo-container">
<div id="gridContainer"></div>
</div>
<script>
$(function(){
$(function(){
$("#gridContainer").dxDataGrid({
showBorders: true,
// dateSerializationFormat: null,
dataSource: {
store: {
type: "odata",
url: "https://services.odata.org/Experimental/Northwind/Northwind.svc/Orders",
version: 4,
// deserializeDates: true,
fieldTypes: {
ShippedDate: 'String'
}
},
},
filterRow: {
visible: true
},
columns: [
{ dataField: "ShippedDate", dataType: "datetime"}
]
});
});
});
</script>
</div>
</body>
</html>