事件功能完整日历中的多个 ajax 调用

Question

我在我们的页面中使用 fullcalendar jQuery 插件来创建/查看会议邀请。

我的新要求是在我们的页面中显示在 Outlook 中为该特定用户创建的会议。我的网络服务（用于从 Outlook 中提取会议）花了最少 45 秒来发送响应。我不希望用户完全等待 45 秒。（性能问题）所以我只想先从 db 加载事件，然后我想附加作为 web 服务响应返回的事件。因此，用户不会感到有那么大的延迟。

所以我只是进行了两次 ajax 调用来提取所需的详细信息。一种 ajax 调用是从本地数据库中提取事件（SUCCESS），另一种是调用 Web 服务来提取在 Outlook 中创建的事件。

events: function(start, end, timezone,callback) {
            $.ajax({
                url:  // url hits db and gets meeting details in db
                dataType: 'json',

                success: function(response) {
                    var events = [];
               if(response != null){
                   alert("Success");
                    $.map(response ,function ( r ){
                       alert(r.title + " "  +  r.start + " " + r.end);

                      events.push({
                            title : r.title,
                            start : r.start,
                            end : r.end
                        });
                    });

               }    
               callback(events);
          }

          $.ajax({
                url:  // url calls webservice and gets meetings in Outlook
                dataType: 'json',

                success: function(response) {
                    var events = [];
               if(response != null){
                   alert("Success");
                    $.map(response ,function ( r ){
                       alert(r.title + " "  +  r.start + " " + r.end);

                      events.push({
                            title : r.title,
                            start : r.start,
                            end : r.end
                        });
                    });

               }    
               alert("External Events  "+ events.length);  //EXECUTED 

               callback(events);  //NOT EXECUTED
               }
        });
  }

现在的问题是，

1 .第一个 ajax 调用工作正常。

2 。正在从 Webservice 获得正确的响应，但响应未附加到日历。

我的查询是，

1. 我们不能使用两次回调（事件）吗？

2. 或者，请向我推荐替代解决方案？

3. 如果分别使用两个事件函数，只会执行第二个事件函数。为什么第一个事件函数没有被执行？

Answer 1

有点旧，但可以参考。在您的第一个 ajax 调用中，而不是回调，放入第二个 ajax 调用

$.ajax({
            url:  // url hits db and gets meeting details in db
            dataType: 'json',

            success: function(response) {
                var events = [];
           if(response != null){
               alert("Success");
                $.map(response ,function ( r ){
                   alert(r.title + " "  +  r.start + " " + r.end);

                  events.push({
                        title : r.title,
                        start : r.start,
                        end : r.end
                    });
                });

           }    
           //second call
           $.ajax({
            url:  // url calls webservice and gets meetings in Outlook
            dataType: 'json',

            success: function(response) {
                var events = [];
           if(response != null){
               alert("Success");
                $.map(response ,function ( r ){
                   alert(r.title + " "  +  r.start + " " + r.end);

                  events.push({
                        title : r.title,
                        start : r.start,
                        end : r.end
                    });
                });

           }    
           alert("External Events  "+ events.length); 

           callback(events); // return all results 
           }
         });
      }

Answer 2

您的代码没有问题。确保您从服务器获得的响应是​​您所期望的（例如响应！= null）。

https://jsfiddle.net/5ds8z06p/

var foo = function(callback) {
  $.ajax({
    url: '/echo/json',
    success: function() {
      callback('first');
    }
  });

  $.ajax({
    url: '/echo/json',
    success: function() {
      callback('second');
    }
  });
};

foo(function(bar) {
  console.log(bar);
});