Question

I have a little problem mixing a JavaScript library (Polymaps) and jQuery.
I’d like to call a different file everytime the user selects a value from the datepicker.

The filename syntax is:

4sq_'the selected day value' _ 'the selected month value'.json

This is the datepicker code:

$("#datepicker").datepicker({
    dateFormat: 'yy/mm/dd',
    inline: true,
    minDate: new Date(2011, 8 - 1, 20),
    maxDate:new Date(2011, 12 - 1, 31),
    altField: '#datepicker_value',
      onSelect: function(){
        var selDay = $("#datepicker").datepicker('getDate').getDate();                 
        var selMonth = $("#datepicker").datepicker('getDate').getMonth() + 1;             
        var selYear = $("#datepicker").datepicker('getDate').getFullYear();

        plotMap()
    }
});

and the name of the file contains the values of the selection like below:

function plotMap(){
    map.add(po.geoJson()
       .url("4sq_"+selDay+"_"+selMonth+".json")
       .on("load", loadAreas));
};

I also tried the code:

function plotMap(){
    map.add(po.geoJson()
       .url("4sq_"+
                   $("#datepicker").datepicker('getDate').getDate()
            +"_"+
                  $("#datepicker").datepicker('getDate').getMonth()
            +".json")
       .on("load", loadAreas));
};

but it throws me an Access to restricted URI denied error.

What I’m doing wrong? Any suggestion?

Answer 1

Try something like this:

$("#datepicker").datepicker({
    dateFormat: 'yy/mm/dd',
    inline: true,
    minDate: new Date(2011, 8 - 1, 20),
    maxDate:new Date(2011, 12 - 1, 31),
    altField: '#datepicker_value',
      onSelect: function(){
        var selDay = $("#datepicker").datepicker('getDate').getDate();                 
        var selMonth = $("#datepicker").datepicker('getDate').getMonth() + 1;

        plotMap(selDay, selMonth);
    }
});

function plotMap(day, month){
    map.add(po.geoJson()
       .url("4sq_"+day+"_"+month+".json")
       .on("load", loadAreas));
}