Skip to main content
1 of 4
Mark Pond
  • 23.1k
  • 2
  • 60
  • 104

What is the correct way to send DateTime member types in the payload to RemoteActions?

I have seen quite a few questions and answers regarding the conversion and display of a JSON serialized DateTime field in JavaScript and the effects of UTC on that data related to the user's locale but I have yet to be able to find a solution to the issue I'm facing here.

I am using @RemoteAction methods to expose a custom Apex Type to the page. When performing the retrieve operation, the DateTime members on the class are serialized into the unix epoch format.

{
    name: "Item Name",
    theDate: 1440797362525
}

However, when performing a commit back to the controller with this exact same data, the unix epoch format is not able to be deserialized back into the concrete type and it throws an exception.

Visualforce Remoting Exception: Unable to convert date '1440797362525' to Apex type Datetime.

What is the correct way to implement this very simple pattern? Am I just doing it wrong? This seems like "JS Remoting: 101" and it shocks me that it does not work.

Controller

public with sharing class DateTimeSerializationController {
    
    public class MyItem {
        public String name      { get; set; }
        public DateTime theDate { get; set; }
    }
    
    @RemoteAction
    public static MyItem fetchTheItem() {
        MyItem item = new MyItem();
        item.name = 'Item Name';
        item.theDate = DateTime.now();
        return item;
    }
    
    @RemoteAction
    public static MyItem storeTheItem(MyItem item) {
        // DML or something similar could happen here
        system.debug(item);
        
        return item;
    }
    
}

VF Page

<apex:page controller="DateTimeSerializationController">
    <script>
        window.myApp = window.myApp || {};
        
        window.myApp.fetch = function() {
        
            Visualforce.remoting.Manager.invokeAction(
                'DateTimeSerializationController.fetchTheItem',
                function(result, event){
                    if (event.status) {
                        console.log(result);
                        myApp.myItem = result;    
                    } else {
                        console.log(event.message);
                    }
                }, 
                {escape: true}
            );
        
        }
        
        window.myApp.store = function() {
            Visualforce.remoting.Manager.invokeAction(
                'DateTimeSerializationController.storeTheItem',
                myApp.myItem,
                function(result, event){
                    if (event.status) {
                        console.log(result);
                    } else {
                        console.log(event.message);
                    }
                }, 
                {escape: true}
            );
        }
    </script>

    <p>Open the browser console and then click the buttons.</p>
    
    <button onclick="myApp.fetch();">Fetch</button>
    <button onclick="myApp.store();">Store</button>

</apex:page>
Mark Pond
  • 23.1k
  • 2
  • 60
  • 104