Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free.

I have a project that spits out a json_encode string of date items.

Looks like this:

<input type="hidden" class="avail_dates" data-id='["12-9-2014", "7-9-2014"]' />

I've tried different things, but because of this project it has to be there, I can't simply do an ajax call and return the json_encode stuff.

So, I need to get the data-id into a javascript array somehow for a datePicker.

Using this works, but it's hard coded:

var availableDates = ["9-9-2014","5-9-2014","7-9-2014"];

Using this doesn't do anything:

var availableDatesArray = jQuery('.avail_dates').attr('data-id'); 
//alerting gives ["9-9-2014","5-9-2014","7-9-2014"]

Is there a way to convert the string into an array that works?

I can change the way the data gets into the data-id, or the way jquery interacts with the element, but I can't add a separate ajax query just for this, it has to come from that data-id.

var availableDates = ["9-9-2014","5-9-2014","7-9-2014"];    

function dates(date){
    dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();
    console.log(dmy+' : '+(jQuery.inArray(dmy, availableDates)));
    if (jQuery.inArray(dmy, availableDates) != -1) {
        return [true, "","Available"];
    } 
    else {
        return [false,"","unAvailable"];
    }           
    return;
}

jQuery('#myDates').datepicker({
changeYear: true,
maxDate: '0',
changeMonth: true,
dateFormat: "mm/dd/yy",
yearRange: '2014:2030',
beforeShowDay: dates,       
onSelect: function(dateText) {

}
});

EDIT: Should have mention I already tried json.parse. It gives an "unexpected number" error.

EDIT 2: I added the function I'm trying to pass the data too for jQuery datePicker.

share|improve this question
    
Similar to: stackoverflow.com/questions/13272406/… –  BobbyShaftoe Sep 13 '14 at 2:45
    
I'm unable to reproduce your "unexpected number" error using JSON.parse. Can you provide a jsfiddle? –  Alexander O'Mara Sep 13 '14 at 2:51
    
@David, JSON.parse works fine here using html shown jsfiddle.net/js3qnae1 –  charlietfl Sep 13 '14 at 2:52
    
@David, well most likely there is some missing piece you're not telling us, as it stands, using your example, using JSON.parse, and .data will work just fine –  Ghost Sep 13 '14 at 2:53
    
see edits, I added the functions I'm using to pass it to. When it's hard coded it works fine, dymanically not at all. json.parse gives an error –  David Sep 13 '14 at 2:55

3 Answers 3

up vote 2 down vote accepted

Yes you can, use JSON.parse. Like this:

var availableDatesArray = jQuery('.avail_dates').attr('data-id'); 
availableDatesArray = JSON.parse(availableDatesArray);
console.log(availableDatesArray);

Or much better suggestion of @charlie

var availableDatesArray = jQuery('.avail_dates').data('id'); // much better
share|improve this answer
3  
no need to use JSON.parse(), if use jQuery.data() will read it as array if it is valid JSON and parse it internally –  charlietfl Sep 13 '14 at 2:43
    
Should have mention I already tried json.parse. It gives an "unexpected number" error –  David Sep 13 '14 at 2:48
    
Doesn't work. Formats as "9-9-2014,5-9-2014,7-9-2014", apparently I need the brackets and double quotes for this function to work –  David Sep 13 '14 at 2:51
    
@David what is the origin of that data anyway? is PHP echoing that?, as your question stands in the current posting, its working fine. –  Ghost Sep 13 '14 at 2:52
    
@David You have []'s in your example. Are they not present or something you want to remove? –  Alexander O'Mara Sep 13 '14 at 2:53

Just use JSON.parse.

Example:

var availableDatesArray = JSON.parse(jQuery('.avail_dates').attr('data-id'));

If you prefer, you can use jQuery.parseJSON.

Example:

var availableDatesArray = jQuery.parseJSON(jQuery('.avail_dates').attr('data-id'));

This is actually how jQuery itself parses JSON in AJAX responses.

share|improve this answer
    
json.parse gives me an error, see edits –  David Sep 13 '14 at 2:48

Unless I'm misunderstanding your question, you just need to use JSON.parse:

var availableDatesArray = JSON.parse(jQuery('.avail_dates').attr('data-id'));

jQuery('.avail_dates').attr('data-id') is just going to return a string (the contents of the 'data-id' attribute. JSON.parse will actually create a JavaScript object from it.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.