Getting Different Date Pattern When Using Dojo.formtojson

I have changed the datePattern of dijit/form/DateTextBox by providing an attribute

Solution 1:

The sole purpose of datePattern is to format the way the user types the date into the DateTextBox.

No matter what format the user types the date in, internally Dojo works in the ISO date formatby design. This also makes it easier on you, the programmer.

If you're looking into converting ISO into another proprietary format, there's a module for that.

require(['dojo/date/locale'], function(locale) {
    var date = locale.parse('2016-01-28', {
        datePattern: 'yyyy-MM-dd',
        selector: 'date'
    });
    var formattedDate = locale.format(date, {
        datePattern: 'MM-dd-yyyy',
        selector: 'date'
    });
    console.log(formattedDate);
});

Solution 2:

The probleme is in the dojo.formToJson it return the default date format whatever you specify the format in the dijit/form/DateTextBox input.

So , I suggest to format the date inside the generated jsonForm ,

here is a solution :

First import the required js ,

//AMD loadingrequire(["dojo/date/locale","dojo/json"],
function(locale,JSON){
    ......
})

"dojo/date/locale" used here to change date pattern

"dojo/json" used to Parse o json Object or reverse (Object to String)

then declare the formatJsonFormDates function ( params are explained in the code it return a new jsonForm with formatted date)

helps you to convert all date at ones if there is many dates in the Form, by passing the name attribute of the input date in an Array parameter

//helper function/**
 * The function get  generated 'form' from dojo.formToJson(HTML from),
 * and replaces all string Date to the desired format 
 * ("YYYY-MM-dd" to "MM-dd-YYYY" by exemple)
 *
 * @param string jsonForm Value of generated jsonForm(HTML from)
 * @param Object form Value of the Dijit.form.Form
 * @param Array dateFieldsNames string array Values of date form fields to be formatted
 * @param string datepattern Values of the wanted Dateformat // "mm-dd-YYYY"
 *
 * @return string jsonFormObject Value of new Returned jsonForm with desired date format
 */var formatJsonFormDates  = function(jsonForm,form,dateFieldsNames,datepattern){
    //if no field passed to the function return defaultif(!fieldsNames.length && fieldsNames.length < 1 ) return jsonForm;

    jsonFormObject = JSON.parse(jsonForm);
    for(var i = 0; i<fieldsNames.length ;i++){
        //check if field is an instance of Dateif(form.getValues()[fieldsNames[i]] instanceof Date) {
            newDate = locale.format(form.getValues()[fieldsNames[i]],{datePattern: datepattern, selector: "date"});
            jsonFormObject[fieldsNames[i]] = newDate;
        }
    }
    return JSON.stringify(jsonFormObject);
}

finnaly , after getting your jsonForm apply the function on it :

var formData = dojo.formToJson("yourFormID");
//I recomoand  to use dijit/registry  instead of dijit 

formData = formatJsonFormDates(formData,dijit.byId("yourFormID"),["CONTRACT_DATE"],"MM-dd-yyyy");

.

Share