Enhancing Date formatting in Jquery Data tables following ASP.NET Serialization

Currently, I am facing an issue with formatting dates in a SQL database query that is being serialized by ASP and then converted to JSON for display in Datatables using JavaScript. Instead of the correct date format, I am seeing: /Date(1424563200000)/.

I have attempted to rectify this problem by implementing the following code snippet:

function ToJavaScriptDate(value) {
    var pattern = /Date\(([^)]+)\)/;
    var results = pattern.exec(value);
    var dt = new Date(parseFloat(results[1]));
    return (dt.getMonth() + 1) + "/" + dt.getDate() + "/" + dt.getFullYear();
}

However, I am uncertain how to invoke this function every time my Datatable attempts to read a date.

The configuration of my table is as follows:

$('#YourTaskTable').dataTable({
    "ajax": "App_JSON/YourTaskTable.txt",
    "columns": [
        { "data": "TName" },
        { "data": "RegistrationNo" },
        { "data":  "DueDate"}
    ]
});

I have tried modifying it like this:

$('#YourTaskTable').dataTable({
    "ajax": "App_JSON/YourTaskTable.txt",
    "columns": [
        { "data": "TName" },
        { "data": "RegistrationNo" },
        { "data": ToJavaScriptDate("DueDate")} //Function call added here  
    ]
});

Unfortunately, this approach does not seem to be effective as I am still unable to see the formatted date. How can I properly utilize this function to convert the date in this scenario?

Answer №1

It is recommended to utilize the mRender method in this scenario. Remember to make use of aoColumns instead of columns, and extract your data from full[], which serves as the datasource for the corresponding row.

"aoColumns": [
{
    'mRender': function(data, type, full) {
       return ConvertToJavaScriptDate(full[2])
    }
},
etc...

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

A guide to downloading a file linked to Javascript with the help of Java

I have a unique request here. I am looking for a solution using HttpUrlConnection that can interact with JavaScript directly on a webpage, instead of relying on Selenium as a workaround. Can anyone assist me with this? The webpage contains a link (hidden ...

Is there a way I can create a conditional statement to determine the values of my selection?

I need to customize the order status values for 'confirmed', 'on the way' and 'delivered'. How can I map these statuses to specific numerical values based on the options available in a select menu? Confirmed - 10 On the way - ...

What is the best way to fill HTML tables using an ajax response?

This is a Laravel blade view/page that requires updating without the need to refresh the entire page. The blade.php code functions correctly and retrieves data from a MySQL database, but there seems to be an issue with the AJAX and JavaScript implementati ...

JavaScript error leading to ERR_ABORTED message showing up in the console

When I try to load my HTML page, my JavaScript code keeps throwing an error in the console. I am attempting to import some JavaScript code into VSCode using an app module for future reuse. The code is being run through a local server. Error Message: GET ...

Utilizing JavaScript to update the content of a React page

Recently, I came across an API using Swagger for documentation. Swagger generates a ReactJs webpage to document and test the API endpoints. However, my lack of knowledge in React architecture has led to a problem: Prior to accessing any endpoint, an authe ...

Retrieve the modal ID when the anchor tag is clicked in order to open the modal using PHP

I am facing an issue with opening a modal and passing the id value using JavaScript. The id value is shown in a hidden input field. <a href="#modal2" data-toggle="modal" data-id="<?php echo $CRow['id'];?>" id="<?php echo $CRow[& ...

Insert the user's choice as a MenuItem within the Select component

I currently have a default list of options for the user. However, I want to allow users to add their own category dynamically. This will trigger a dialog box to appear. How can I modify my code so that the value property starts from number 4? Take a look ...

What is the best way to get process.argv to display only the arguments and exclude the node command and path?

As the title suggests, I am working on a substantial project that involves AppleScript and iMessage. After testing the script, it successfully opens Terminal and executes: node ~/Desktop/chatbot [argument]. However, at the moment, all it returns is: [ &apo ...

Using AngularJS in conjunction with Ruby on Rails is causing compatibility issues

Trying to implement Angular with Ruby on Rails is presenting some challenges. While simple expressions like 1+1 work fine, binding a number or string to a scope seems to be causing issues. I am looking for suggestions on how to resolve this problem. app. ...

Reassigning Click Functionality in AJAX After Initial Use

Encountering an issue with a click event on an AJAX call. The AJAX calls are nested due to the click event occurring on a div that is not present until the first AJAX call is made. Essentially, I am fetching user comments from a database, and then there ar ...

Stopping the execution of code in Node.js after returning a JSON response

When a user is not found, the code still continues executing after sending the JSON response. The JSON response is generated in a separate class and returned from there. var user = new UserClass(obj, null); var userObj = user.getUser(res, req, 'user ...

Crafting a Customized Form with JSON using Kendo-UI

I have successfully created a dynamic form using JSON and Kendo.Observable. However, I am facing issues with initializing the dropdownlist values within the same JSON object. The only workaround I found is to bind the dropdown lists to a separate JSON requ ...

retrieve information at varying intervals through ajax

In my web page, there are two div elements that both fetch server data using AJAX. However, div-a retrieves data every second while div-b retrieves data every minute. How can I adjust the frequency at which each div fetches server data? ...

What is the advantage of using event.target over directly referencing the element in eventListeners?

Suppose there are several buttons in an HTML file and the following code is executed: const buttons = document.querySelectorAll('button'); buttons.forEach((btn) => { btn.addEventListener('click', (e) => { console.log(btn.te ...

Modal obstructing BsDatePicker

<!-- The Server Modal --> <div class="modal" id="serverModal"> <div class="modal-dialog" style="max-width: 80%;overflow-y: initial !important;" > <div class=" ...

The React.js project I created is showcased on GitHub pages and has a sleek black design

After developing a project using React.js and deploying it on github pages, everything was functioning smoothly. However, I encountered an issue where the screen turned black after logging in and out multiple times. Are there any suggestions on how to reso ...

Calculating values within dynamically generated elements requires utilizing JavaScript to target and extract the

I am working on creating input fields inside an HTML table using Vue.js. On click of a button, I want to perform some calculations based on the input values. However, it seems that the calculations are not happening as desired. What I have attempted so fa ...

Accessing deeply nested JSON objects in AngularJS

I've been working on an AngularJS single page application and I have successfully fetched files from a JSON. var app = angular.module("MyApp", []); app.controller("TodoCtrl", function($scope, $http) { $http.get('todos.json'). success ...

How come the instanceof operator returns false for a class when its constructor is present in its prototype chain?

While working on a NodeJS app, I encountered unexpected behavior when trying to verify that a value passed into a function is an instance of a specific Class. The issue arises when using instanceof between modules and checking the equality of the Class. e ...

Animated Debugging with Node.js

Encountering an issue with code that runs smoothly on other devices but seems to be laptop-specific. Even a simple "hello world" application is only displaying a debug image instead of the expected output. repository folder> node app.js Express Server ...