Pull in JSON data

Question

Я пытаюсь получить календарь событий, работающий с данными json. Я просто хочу выделить даты и обновить div под календарем с информацией о событии, когда пользователь нажимает на дату. Мое приложение служит JSON в виде:

[ 
    {"Date":"02/06/2012","Title":"Eat, Bike, and Swim"}, 
    {"Date":"02/03/2012","Title":"Sleep"}, 
    {"Date":"02/02/2012","Title":"Laugh"} 
] 

У меня есть скрипку JS, который работает с определением переменной, но я не могу заставить его ответить на запрос JSON.

Вот моя лучшая попытка: http://jsfiddle.net/PGmFv/2/

Javascript является:

 
$(document).ready(function() { 
    var dp, events; 
    events = []; 
    return dp = $(".blog_calendar").datepicker({ 
    beforeShowDay: function(date) { 
     var matching, result; 
     $.getJSON("https://raw.github.com/gist/1676157/15ce81851e57dfcecb985039e970a749585959de/my.json", function(data) { 
     return events = data; 
     }); 
     result = [true, "", null]; 
     matching = $.grep(events, function(event) { 
     return event.Date.valueOf() === date.valueOf(); 
     }); 
     if (matching.length) { 
     result = [true, "highlight", null]; 
     } 
     return result; 
    }, 
    onSelect: function(dateText) { 
     var date, event, i, selectedDate; 
     date = void 0; 
     selectedDate = new Date(dateText); 
     i = 0; 
     event = null; 
     while (i < events.length && !event) { 
     date = events[i].Date; 
     if (selectedDate.valueOf() === date.valueOf()) { 
      event = events[i]; 
     } 
     i++; 
     } 
     if (event) { 
     return alert(event.Title); 
     } 
    } 
    }); 
}); 

Я пытаюсь загрузить в формате JSON внутри функции Datepicker, потому что я хочу, чтобы иметь возможность иметь несколько календарей на на той же странице и this.id содержит определенную переменную URL, поэтому я могу позвонить $.getJSON('/events/' + this.id + '/data.json',function() {}

Любые мысли очень ценятся. Я сильно опираюсь на: Events in jQuery UI Datepicker with json data source и Datepicker with events?, но просто не могу получить json для загрузки в нужное время и в правильном направлении.

Отсутствие ошибки в консоли не помогает.

Answer 1

Чтобы получить данные JSON из другого домена, вы должны использовать JSONP с функцией обратного вызова. Github API поддерживает это (example), а дескрипторы jQuery автоматически выполняют обратный вызов с dataType: 'jsonp'.

Это, как я получаю JSON данные с сутью Github с JQuery:

$.ajax({ 
    url: 'https://api.github.com/gists/'+gistid, 
    type: 'GET', 
    dataType: 'jsonp' 
}).success(function(gistdata) { 
    // This can be less complicated if you know the gist file name 
    var objects = []; 
    for (file in gistdata.data.files) { 
    if (gistdata.data.files.hasOwnProperty(file)) { 
     var o = JSON.parse(gistdata.data.files[file].content); 
     if (o) { 
     objects.push(o); 
     } 
    } 
    } 
    if (objects.length > 0) { 
    // DoSomethingWith(objects[0]) 
    } 
}).error(function(e) { 
    // ajax error 
}); 

(jsFiddle)

Answer 2

Достаточно много кода для прокрутки, но разве вы не выполняете асинхронный вызов, а затем пытаетесь вернуть значение из анонимной функции? Попытка использовать events сразу после , инициируя getJSON, но, вероятно, совсем немного до данные на самом деле выбраны?

Answer 3

Эта ошибка приходит из-за запроса

$.getJSON("https://raw.github.com/gist/1676157/15ce81851e57dfcecb985039e970a749585959de/my.json") 

не в той же domain.So console.log() показывает эту ошибку

Origin http://fiddle.jshell.net is not allowed by Access-Control-Allow-Origin. 

Запуск $ .getJSON ('запрос же домен') не приведет к ошибке.

См. Скрипку и см. Сообщение об ошибке консоли. http://jsfiddle.net/PGmFv/10/