2014-02-19 47 views
0

我想在按鈕單擊事件期間打開一個對話框模式窗口,當我打開此窗口時,我希望能夠調用獲取最新信息和更新的視圖加載時模式對話框的正確信息。但它總是抓住第一個記錄並顯示出來。在查看代碼時,它會打開對話框,然後它會運行操作結果的代碼,但View從不會使用正確的記錄進行更新。JQuery對話框在MVC更新之前打開Partial View

所以我有一個送貨地址的下拉列表。我想獲取所選記錄的ID,將其傳遞給我已完成的ActionResult方法,獲取我需要的數據並打開一個對話框,並將它傳遞給我要顯示的信息,但它不是更新與我通過它,因爲模態已經彈出了我猜想的列表中的第一個地址的原始模態值,而不是我現在選擇的那個,如果這是有道理的。

控制器:

public ActionResult PublicInfo(string widgetZone) 
    { 
     var address = _workContext.CurrentCustomer.Addresses 
      .FirstOrDefault(a => a.Id == _workContext.CurrentCustomer.ShippingAddress.Id); 

     PublicInfoModel model = new PublicInfoModel(); 

     model.FirstName = address.FirstName; 
     model.LastName = address.LastName; 
     model.Address1 = address.Address1; 
     model.Address2 = address.Address2; 
     model.City = address.City; 
     model.StateProvinceId = 1; 
     model.StateProvinceName = address.StateProvince.Name; 
     model.CountryId = 1; 
     model.CountryName = address.Country.TwoLetterIsoCode; 
     model.PostalCode = address.ZipPostalCode; 

     return View("Nop.Plugin.Widgets.AddressVerification.Views.WidgetsAddressVerification.PublicInfo", model); 
    } 

    [HttpPost] 
    public ActionResult PublicInfo(int id) 
    { 
     ViewBag.selectedShippingId = id; 

     var address = _workContext.CurrentCustomer.Addresses 
      .FirstOrDefault(a => a.Id == id); 

     PublicInfoModel model = new PublicInfoModel(); 

     model.FirstName = address.FirstName; 
     model.LastName = address.LastName; 
     model.Address1 = address.Address1; 
     model.Address2 = address.Address2; 
     model.City = address.City; 
     model.StateProvinceId = 1; 
     model.StateProvinceName = address.StateProvince.Name; 
     model.CountryId = 1; 
     model.CountryName = address.Country.TwoLetterIsoCode; 
     model.PostalCode = address.ZipPostalCode; 

     return View("Nop.Plugin.Widgets.AddressVerification.Views.WidgetsAddressVerification.PublicInfo", model); 
    } 

型號:

@model Nop.Plugin.Widgets.AddressVerification.Models.PublicInfoModel 

<div id="dialog-modal" style="display:none;"> 
    @Html.Partial("Nop.Plugin.Widgets.AddressVerification.Views.Shared._Address", Model) 
</div> 

<script type="text/javascript"> 
    $(document).ready(function() { 
     $("#shipping-buttons-container .new-address-next-step-button")[0].onclick = null; 
     $("#shipping-buttons-container .new-address-next-step-button").click(function() { 
      newContent(); 
      if (e.preventDefault) { 
       // For modern browsers 
       e.preventDefault(); 
      } 
      else { 
       // For older IE browsers 
       e.returnValue = false; 
      } 


      //Shipping.save(); 
     }); 

     function newContent() { 
      $(function() { 
       var selectedShippingAddressId = $('#shipping-address-select').val(); 
       //alert(selectedShippingAddressId); 
       if (selectedShippingAddressId != null) { 
        $('#dialog-modal').dialog({ 
         autoOpen: true, 
         width: 500, 
         resizable: false, 
         title: 'An updated address has been determined, would you like to use this one?', 
         modal: true, 
         open: function (event, ui) { 
          var url = '@Url.Action("PublicInfo", "WidgetsAddressVerification")'; 
          $.post(url, { id: selectedShippingAddressId }); 

         }, 
         buttons: { 
          "Close": function() { 
           $(this).dialog("close"); 
          } 
         } 
        }); 
       } 

      }); 
     } 
    }); 
</script> 

任何幫助,將不勝感激。只是爲了獲取當前選定的信息以模態形式彈出。

+0

使用ajax調用來獲取頁面上的部分,然後打開對話框。看到我的答案在這裏http://stackoverflow.com/questions/19643864/how-do-i-render-a-partial-form-element-using-ajax/19643974#19643974 –

回答

0

我不完全確定你想如何流動,但更新你的模態的內容,你只需要更新你的對話框模式div與從你的ajax調用拉下來的部分視圖沿這些線路的東西JS

$("#shipping-buttons-container .new-address-next-step-button").click(function() { 
     $.ajax({ 
      type: 'post', 
      url: "@Url.Action("PublicInfo", "WidgetsAddressVerification")", 
      success: function(data) { 
       $("#dialog-modal").html(data); 
       $('#dialog-modal').modal('show'); 
      } 
     }); 
    }); 

與傳遞迴HTML中的局部視圖,因此它不包括_layout模板和僅僅是原始HTML的控制器。

public PartialViewResult PublicInfo(string widgetZone) 
    { 
     var address = _workContext.CurrentCustomer.Addresses 
     .FirstOrDefault(a => a.Id == _workContext.CurrentCustomer.ShippingAddress.Id); 

     PublicInfoModel model = new PublicInfoModel(); 

     model.FirstName = address.FirstName; 
     model.LastName = address.LastName; 
     model.Address1 = address.Address1; 
     model.Address2 = address.Address2; 
     model.City = address.City; 
     model.StateProvinceId = 1; 
     model.StateProvinceName = address.StateProvince.Name; 
     model.CountryId = 1; 
     model.CountryName = address.Country.TwoLetterIsoCode; 
     model.PostalCode = address.ZipPostalCode; 

     return PartialView("Nop.Plugin.Widgets.AddressVerification.Views.WidgetsAddressVerification.PublicInfo", model); 
    } 
+0

我試過這個。它正確進入partialviewresult,但現在它不打開對話窗口並顯示信息。 – sramsay

+0

你用於模態代碼的是什麼?我使用bootstrap,因此.modal('show')命令。 – PlTaylor

+0

其實我現在開始工作了。謝謝你的幫助。 – sramsay

0

Jquery默認情況下工作在異步模式下。

在使用

$.post(url, { id: selectedShippingAddressId }); 

做後,您可以使用

$.ajax({ 
    url: url, 
    data: { id: selectedShippingAddressId }, 
    success: success, 
    type: 'POST', 
    async:false 
}); 

現在流行時,上面的代碼經過處理了將永遠載入。