dojox.calendar和JsonRest - 如何更新?

时间:2012-09-25 14:23:02

标签: json dojo

我对道场很新,所以请耐心等待我。我目前正在创建一个dojo日历,其中包含来自数据库的事件。日历默认为网格(每月)视图,并在加载时进行初始调用以获取第一组事件。默认视图会调用以获取当前月份事件+/-一周。我在Observable中使用JsonRest对象来完成此任务。

目前这项工作毫无问题。我遇到问题的地方是拉动/更新其他月份的数据。期望的效果是让用户单击向前或向后按钮以移动到下个月或上个月。发生这种情况时,我想查询数据库以查看要显示的新事件。我能够返回新数据并将其记录到控制台,但我无法将其显示在日历上。我确定我错过了一些简单的东西(希望如此),但是我无法弄明白,或者找不到任何好的文档。这就是我所拥有的:

require(['dojo/parser', 
         'dojo/ready',
         'dojox/calendar/Calendar',
         'dojo/store/Observable',
         'dojo/store/JsonRest',
         'dijit/registry'],
  function(parser, ready, Calendar, Observable, JsonRest, registry) {
    ready(function(){
        var MM   = new Date().getMonth() + 1;
        if (MM < 10)
          { MM = '0' + MM};

        var YYYY = new Date().getFullYear();
        var monthStore  = new Observable(JsonRest({target: '/levelx/teamSchedule/getMonthInfo/'}));
        calendar = new Calendar({
          store: monthStore,
          dateInterval: 'month',
          style: styleText,
          editable: false,
          cssClassFunc: function(e){
            return e.calendar;
          },
          query: '?q=' + YYYY + '-' + MM
        }, 'calendar');

    calendar.on("timeIntervalChange",function(e){
      var YYYY = e.startTime.getFullYear();
      var MM   = e.startTime.getMonth() + 1;
      if (MM < 10)
        { MM = '0' + MM};
      monthStore.query('?q=' + YYYY + '-' + MM).then(function(results){
        console.log(results);
      });
    });

我觉得我太近了。就像我说的那样,我将正确的数据返回到控制台(console.log(results)),但没有任何线索如何让它在实际日历中显示。

2 个答案:

答案 0 :(得分:2)

通过以下修改,我能够完成所需的工作。每当用户更改显示的日期范围时,它将自动运行查询以收集和显示正确的事件。

require(['dojo/parser',
         'dojo/ready',
         'dojox/calendar/Calendar',
         'dojo/store/JsonRest',
         'dijit/registry',
         'dojo/dom',
         'dojo/html'],
  function(parser, ready, Calendar, JsonRest, registry, dom, html) {
    ready(function(){
        var MM   = new Date().getMonth() + 1;
        if (MM < 10)
          { MM = '0' + MM};
        var YYYY = new Date().getFullYear();
        var detailStore = JsonRest({target: '/levelx/teamSchedule/getDayInfo/'});
        var monthStore  = JsonRest({target: '/levelx/teamSchedule/getMonthInfo/'});

        calendar = new Calendar({
          dateInterval: 'month',
          style: styleText,
          editable: false,
          cssClassFunc: function(e){
            return e.calendar;
          }
        }, 'calendar');

        calendar.on("timeIntervalChange",function(e){
          var YYYY = e.startTime.getFullYear();
          var MM   = e.startTime.getMonth() + 1;
          if (MM < 10)
            { MM = '0' + MM};

          calendar.set('query','?q=' + YYYY + '-' + MM);
          calendar.set('store', monthStore);
        });
    });
});

答案 1 :(得分:0)

尝试更改间隔更改功能,以便通过Calendar对象设置查询,而不是直接在商店中设置。

calendar.on("timeIntervalChange",function(e){
  var YYYY = e.startTime.getFullYear();
  var MM   = e.startTime.getMonth() + 1;
  if (MM < 10)
    { MM = '0' + MM};

// this
  this.query('?q=' + YYYY + '-' + MM).then(function(results){
    console.log(results);
  });
});

从来没有使用过日历,所以它是猜测...但看起来在日历属性中设置了初始query,这应该反映在dojo.store.api 。日历本身很可能无法正确观察,然后在新数据到达时不会呈现。