Javascript处理和ASP.NET MVC

Question

我有以下的JavaScript和JsonResult。我遇到的问题是ajax文章没有足够的时间让JsonResult返回适当的数据。我可能不完全理解JavaScript处理，并且我确信这是通过设计，但我想知道如何让这个同步请求。简而言之，在继续处理javascript之前，请等待JsonResult操作完成。

<script type="text/javascript"> 
$(document).ready(function() { 

    var table = document.getElementById("updateTable"); 
    var tasks = new Array("shutdown", "prep", "boot", "ready"); 
    var tasksLength = tasks.length; 

    for (var i in tasks) { 

     for (var loop = 1, max = table.rows.length; loop < max; loop++) { 

      id = table.rows[loop].cells[0].innerHTML; 
      task = tasks[i]; 

      ImageUpdateStatus = { 
       ImageId: parseInt(id), 
       Task: task, 
       Status: "pending" 
      } 

      $.ajax({ 
       type: "POST", 
       url: "UpdateStatus", 
       data: $.postify(ImageUpdateStatus), 
       success: function (data) { 
        var status = data.status; 
       } 
      }); 

      ImageUpdateStatus.Status = status; 

      if (ImageUpdateStatus.Status == "success") { 

       task = task.concat(" "); 

       document.getElementById(task.concat(id)).src = "/PVSUtil_ver2/Assets/Images/Image.Success.png"; 

       j = parseInt(i) + 1; 
       if (j < tasksLength) { 
        nextTask = tasks[j]; 
        nextTask = nextTask.concat(" "); 
        document.getElementById(nextTask.concat(id)).src = "/PVSUtil_ver2/Assets/Images/Image.Load.gif"; 
       } 
      } 
     } 
    } 

    document.getElementById('nextButton').className = "navigation"; 
    document.getElementById('nextButton').disabled = false; 
}); 

// 
    // GET: /Build/UpdateStatus 
    public JsonResult UpdateStatus(ImageUpdateStatus imageUpdateStatus, SessionStateItemCollection sessionItems = null) 
    { 
     var data = new object(); 
     string status = null; 

     ImageInfo imageInfo = new ImageInfo(); 
     IImageInfoServices svcImageInfo = new ImageInfoServicesRepository(); 
     imageInfo = svcImageInfo.GetImageByImageId(imageUpdateStatus.ImageId); 

     IDeviceControlServices svcDevice = new DeviceControlServicesRespository(); 
     IPVSCommandServices svcPVSCmds = new PVSCommandServicesRespository(); 

     if (imageUpdateStatus.Task == "shutdown") 
     { 
      status = svcDevice.Shutdown(imageInfo.ImageId); 
      //status = "success"; 

      data = new 
      { 
       status 
      }; 
     } 

     if (imageUpdateStatus.Task == "prep") 
     { 
      List<UpdateReasonForm> updateReasonForms; 

      if (sessionItems.Keys.Count > 0) 
      { 
       updateReasonForms = sessionItems["UpdateReasonForms"] as List<UpdateReasonForm>; 
      } 
      else 
      { 
       updateReasonForms = Session["UpdateReasonForms"] as List<UpdateReasonForm>; 
      } 

      foreach (var item in updateReasonForms) 
      { 
       if (item.ImageId == imageInfo.ImageId) 
       { 
        status = svcPVSCmds.PrepImage(imageInfo, item.NewVersion); 
       } 
      } 

      data = new 
      { 
       status 
      }; 
     } 

     if (imageUpdateStatus.Task == "boot") 
     { 
      status = svcDevice.Boot(imageInfo.ImageId); 

      data = new 
      { 
       status 
      }; 
     } 

     if (imageUpdateStatus.Task == "ready") 
     { 
      status = "success"; 

      data = new 
      { 
       status 
      }; 
     } 

     return this.Json(data, JsonRequestBehavior.AllowGet); 
    } 

Answer 1

只是移动依赖于结果从Ajax请求到成功回调函数的代码：

$.ajax({ 
    type: "POST", 
    url: "UpdateStatus", 
    data: $.postify(ImageUpdateStatus), 
    success: function (data) {  
     ImageUpdateStatus.Status = data.status; 

     if (ImageUpdateStatus.Status == "success") { 

      task = task.concat(" "); 

      document.getElementById(task.concat(id)).src = "/PVSUtil_ver2/Assets/Images/Image.Success.png"; 

      j = parseInt(i) + 1; 
      if (j < tasksLength) { 
       nextTask = tasks[j]; 
       nextTask = nextTask.concat(" "); 
       document.getElementById(nextTask.concat(id)).src = "/PVSUtil_ver2/Assets/Images/Image.Load.gif"; 
      } 
     } 
    } 
}); 

Answer 2

$.ajax({ 
       type: "POST", 
       async: false, 
       url: "UpdateStatus", 
       data: $.postify(ImageUpdateStatus), 
       success: function (data) { 
        var status = data.status; 
       } 
      }); 

，但你真的应该避免这种情况，你应该考虑让你的应用程序的工作与等待Ajax请求

Answer 3

你不想使请求同步;你想要把那要看结果到你的回调所有代码：

$.ajax({ 
     type: "POST", 
     url: "UpdateStatus", 
     data: $.postify(ImageUpdateStatus), 
     success: function (data) { 
      var status = data.status; 

      ImageUpdateStatus.Status = status; 

      if (ImageUpdateStatus.Status == "success") { 
       task = task.concat(" "); 
       document.getElementById(task.concat(id)).src = "/PVSUtil_ver2/Assets/Images/Image.Success.png"; 

       j = parseInt(i) + 1; 
       if (j < tasksLength) { 
        nextTask = tasks[j]; 
        nextTask = nextTask.concat(" "); 
        document.getElementById(nextTask.concat(id)).src = "/PVSUtil_ver2/Assets/Images/Image.Load.gif"; 
       } 
      } 
     } 
    }); 

Answer 4

我真的觉得你应该聚合任何你需要在服务器端首次渲染你的视图的数据，然后把它推到页面上。一旦数据在页面中，您可以使用JavaScript来进行渲染（可以以JSON格式存储在隐藏字段中），但我认为让页面在首次渲染时进行Ajax调用并不理想。