I have an mvc application which pulls data from a SQL database and passes the data to a view. I have a kendo grid in the view which receives the data. One of the grid columns is a date column. The data is stored in the sql database as DateTime and the model in the application has the variable as DateTime? When the data is sent to the view, the date column is formatted as follows:
columns.Bound(sc => sc.RefundDate).Width(10).Title("Refund Date").Format("{0:MM/dd/yyyy}");
When the date is displayed, it is as I would expect. For example, a date of March 7, 2023 gets displayed as 03/07/2023.
Now, I am setting up an ajax call to the controller that executes on a specific button click. The ajax call retrieves a new set of data and gets displayed into generic kendo text boxes. I have a javascript that the ajax executes on success. This is the code of the javascript:
function SetSmallClaimsDetails(data) {
console.log(data);
$("#SmallClaimsRefundDate").val(data.RefundDate);
}
When the code runs, and I look at the console log, I see this:
Object
ActualRefund: 0
RefundDate: "/Date(1678206755990)/"
So I am thinking that the date is being converted by JSON. This is the code of the ajax call:
var url = '/Case/GetSmallClaimsByRecordNumber?ID=789456';
$.ajax({
type: 'GET',
url: url,
dataType: 'text',
success: function (data) {
if (data != undefined) {
var jsonData = JSON.parse(data);
jsonData.ID = ID;
SetSmallClaimsDetails(jsonData);
}
}
});
If I change my javascript to this:
function SetSmallClaimsDetails(data) {
console.log(data);
var date = new Date();
if (!data.RefundDate) {
date=''
} else {
date = new Date(parseInt(data.RefundDate.substr(6)));
}
$("#SmallClaimsRefundDate").val(date);
}
Then the date displays as
Tue Mar 07 2023 11:32:35 GMT-0500 (Eastern Standard Time)
How can I get the date to display as 03/07/2023?
Thank you.
>Solution :
function SetSmallClaimsDetails(data) {
console.log(data);
var date = new Date(parseInt(data.RefundDate.substr(6)));
var formattedDate = date.toLocaleDateString('en-US', { month: '2-digit', day: '2-digit', year: 'numeric' });
$("#SmallClaimsRefundDate").val(formattedDate);
}
Please check the options it can solve your problem very well.