Change date format who is stored in text field

Question

I have a common date field having a displayDD-MM-YYYY but the real value stored in database is YYYY-MM-DD. The problem is this value is also transmitted to a remote server inside a simple text field (having readonly properties) and I would like interact on this field for change his display in DD-MM-YYYY.

I don't want touch something in database structure for change the way on how the date is stored. I precise I don't have access to html of this remote server but I'm allowed to modify some field by putting code in JS file.

I looked here and in some forum but I don't find a solution and due to my poor javascript knowledge I'm stuck. Thank.

this may helps you http://www.w3schools.com/jsref/jsref_obj_date.asp — caramba, Sep 02 '13 at 11:33
Try these links [http://stackoverflow.com/questions/13459866/javascript-change-date-into-format-of-dd-mm-yyyy] [http://stackoverflow.com/questions/17032735/javascript-change-date-format-from-yyyy-mm-dd-hhmmss-to-mm-dd-yyyy] — user1574078, Sep 02 '13 at 11:34
Try these links [link]http://stackoverflow.com/questions/13459866/javascript-change-date-into-format-of-dd-mm-yyyy [link]http://stackoverflow.com/questions/17032735/javascript-change-date-format-from-yyyy-mm-dd-hhmmss-to-mm-dd-yyyy — user1574078, Sep 02 '13 at 11:37

Anand · Answer 1 · 2013-09-02T12:51:53.637

1

Use inbuilt javascript functions to build the format you want. PArse the string in to a date object and use the following functions to create your desired format

getDate() -> to get date
getMonth() -> to get  month
getFullYear() -> to get  year

Example

//var birth_date = document.getElementById('birth_date');
//use birth_date instead of hard coded date
//var day = new Date(Date.parse(birth_date));
var day = new Date(Date.parse("2013-09-02"));
alert(day.getDate() + "-" + day.getMonth() + "-" +  day.getFullYear());


//set value

document.getElementById('birth_date').value = day.getDate() + "-" + day.getMonth() + "-" +  day.getFullYear();

JSFIDDLE

edited Sep 02 '13 at 12:51

answered Sep 02 '13 at 11:34

Anand

14,545
8
32
44

could you please give an example of code? For example I have this code:var birth_date = document.getElementById('birth_date'); Could you complete it ? – dotcom22 Sep 02 '13 at 11:38
Ok but how to do without alert box ? I would like just change the display without anything else.. – dotcom22 Sep 02 '13 at 11:48
I tried but this don't work. As I said the value is inside a simple text field. So is matter to re-arrange the content and I suppose using "date" variable have no effect. Is not possible to use instead something such Innerhtml for this task ? – dotcom22 Sep 02 '13 at 11:58
Updated the JS Fiddle and it works. Check the fiddle. It sets the input value again by converting the type – Anand Sep 02 '13 at 12:52

score 0 · Answer 2 · answered Sep 02 '13 at 11:37

Say you have a string var s = '1989-05-06';. You can get the year, month and day separately like so:

var my_date = s.split('-');
var year = my_date[0];
var month = my_date[1];
var day = my_date[2];

Then, you can display the string below (or organize the day, month and year in any format you would like):

var display_str = '' + day + '-' + month + '-' + year;

Vikash Pandey · Answer 3 · 2013-09-02T13:02:19.707

well, we can do that using simple javascript function. we just need to pass server date(YYYY-MM-DD) and it wll return expected date (DD-MM-YYYY) format.

        function convertDate(serverDate) {
            var dateCollection = serverDate.match(/\d+/g),
                year = dateCollection[0],
                month = dateCollection[1],
               day = dateCollection[2];

           return day + '-' + month + '-' + year;
          }

Example:-

     convertDate('2013-09-02'); // (YYYY-MM-DD) format

output:-

    '02-09-2013' //(DD-MM-YYYY) format

Hope this will help you...

score 0 · Answer 4 · answered Sep 02 '13 at 12:01

You can catch the form submit event and change the value before it is sent:

Let's say you have a form #myForm:

var form = document.getElementById('myForm');

To catch submission:

try {
    form.addEventListener("submit", changeValue, false);
} catch(e) {
    form.attachEvent("onsubmit", changeValue); //Internet Explorer 8-
}

Now you can change the desired value inplace.

function changeValue(){
    var field = document.getElementById('idOfField');
    field.value = field.value.split('-').reverse().join('-');
}

Change date format who is stored in text field

4 Answers4

Linked