Parse XML and Javascript functions issue

Question

I need to create a countdown script that reads the due date from an XML file,

The XML FILE:

<?xml version="1.0" ?>
<Imskia ID="Ramadan2012">
<day date="2012, 7 - 1, 23">
    <Fagr>3:26</Fagr>
    <Shrok>5:22</Shrok>
    <Dohr>12:02</Dohr>
    <Asr>3:38</Asr>
    <Maghrb>6:57</Maghrb>
    <Ishaa>8:27</Ishaa>
</day>
<day date="2012, 7 - 1, 24">
    <Fagr>3:26</Fagr>
    <Shrok>5:22</Shrok>
    <Dohr>12:02</Dohr>
    <Asr>3:38</Asr>
    <Maghrb>6:59</Maghrb>
    <Ishaa>8:27</Ishaa>
</day>  
</Imskia>

and here the Javascipt in the HTML file:

$(document).ready(function(){
    $.get('test.xml', function(d){
    $(d).find('day').each(function(){

        var $day = $(this); 
        var date = $day.attr("date");
        var Maghrb = $day.find('Maghrb').text();

        $('body').append($(html));

    //countdown 
    $('#defaultCountdown').countdown({ 
        until: new Date(date), timezone: +2
    });             

    });
});


});

the problem was that the countdown script doesn't read the variable stores the Date from the XML file, but it works fine when put it manually as below:

    //countdown 
    $('#defaultCountdown').countdown({ 
        until: new Date(2012, 7 - 1, 24), timezone: +2
    });

That date string will be interpreted as a string, and it's not a date format that JavaScript will recognize. Perhaps you could have the date in 3 attributes on your `` elements, one for the year, one for the month, and one for the day. Then you could convert those strings to numbers and use the 3-argument constructor. — Pointy, Jul 22 '12 at 12:18

score 1 · Accepted Answer · answered Jul 22 '12 at 13:20

When you do

var date = $day.attr("date");

date holds a string literal ("2012, 7 - 1, 23" for the first case). What you need to do is to somehow convert this string literal into a JavaScript Date object. If you can do without the subtraction in the month component (i.e., keep your date string as "2012, 6, 23", then the simplest way to get the date would be

// split along the commas to get an array
var dateComponents = $day.attr("date").split(', '); 
var date = new Date(dateComponents[0], dateComponents[1], dateComponents[2]);

Note that the second argument to new Date() (the month component) is 0-indexed so January is 0 and December is 11.

And you can change the countdown to

$('#defaultCountdown').countdown({ 
    until: date, timezone: +2
});

However, if changing the format of the date isn't an option, eval should help you convert the subtraction string to its actual value. In this case, the code would be

// split along the commas to get an array
var dateComponents = $day.attr("date").split(', ');
var date = new Date(dateComponents[0], eval(dateComponents[1]), dateComponents[2]);

Incidentally, read [this answer](http://stackoverflow.com/a/198031/342886) about `eval` if you decide to go that way. — spinningarrow, Jul 22 '12 at 13:25
i used your approach and everything is going to be ok, but iam still need to fix last issue in the code. if you review my question you will found in the xml file this `6:57` this stores the time and i need to add this after the date to display datetime like this format 2012 7 23 6:56:00 — ahmedsaber111, Jul 22 '12 at 15:23
Jvascript's `Date` object's constructor also includes parameters for hours, minutes and milliseconds. (you can read about it [here](https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects)). You can parse your times by doing `var Maghrb = $day.find('Maghrb').text().split(':');` if you're sure that's exactly how the timestamps will be stored. Do note that the times will have to be according to the 24-hour clock. — spinningarrow, Jul 22 '12 at 15:50

Parse XML and Javascript functions issue

1 Answers1