2013-10-26 37 views
0

我正在使用MVC4開發,我正在使用模態對話框來編輯記錄。我正在使用ajaxform將更新的值提交給控制器。到目前爲止,功能正常。但是我正在面臨緩存問題,我一直在試圖解決但沒有成功。 主頁上的記錄顯示在各個選項卡中,每個選項卡都有一個編輯選項。點擊編輯時,我在模態對話框中加載相應的局部視圖。在我啓動模態對話框並點擊取消之後,更改選項卡並再次單擊編輯,對話框將正確加載相應的局部視圖以進行編輯。但是,如果我點擊編輯啓動模式對話框並更新值,然後再從另一個選項卡加載模式彈出窗口,它會顯示前一個選項卡的編輯視圖,而不是我想要編輯的視圖。我調試了代碼,但它似乎不是代碼問題。我試圖通過緩存禁用:在模態對話框和應用程序級別爲false,但沒有任何作用!我添加了我的模式啓動jQuery和模態對話框表單代碼片段。無法禁用jQuery模態對話框緩存

$(".model-edit").click(function() { 
     var viewid = $(this).attr("id"); 
     var key = $("#KeyField").val(); 
     var functionurl = '@Url.Action("ShowEditModel")'; 

     if (key != "") { 
      $.ajax({ 
       type: 'POST', 
       url: functionurl, 
       cache: false, 
       context: this, 
       data: { key: key, viewid: viewid }, 
       success: function (data) { 
        $('#model-editor').html(data); 
        $('#model-editor').dialog({ modal: true, 
         width: 'auto', resizable: false, autoOpen: false, 
         closeOnEscape: true, position: 'middle' 

        }); 
        myModal = $('#model-editor').dialog('open'); 
        $.validator.unobtrusive.parse("#EditForm"); 
       } 
      }); 
     } 
    }); 

模態對話視圖。

@using (Ajax.BeginForm("UpdateRecord",null,null,new AjaxOptions { InsertionMode = InsertionMode.Replace, HttpMethod = "POST", UpdateTargetId = "SelectedRecord", OnSuccess = "closeModal();" }, new { id = "EditForm" })) 
{ 

    <table cellspacing="3" cellpadding="3" align="left" width="950px"> 
     <tr> 
     <td align="center" colspan="3"> 
      <input type="hidden" [email protected] id="CurrentStep" name="CurrentStep"/> 
     </td> 
     </tr>  
     <tr> 
     <td align="center"> 
     @for (int i = 0; i < ((string[])Model.StepView).Count(); i++) 
     { 
      if (i == (int)Model.CurrentStep) 
      { 
       <h2 class="StepTitle">@((string)Model.StepTitle[i])</h2> 
      <div class="wizard-step" [email protected] style="height:auto;position:relative;display:inherit"> 
       @Html.Partial((string)Model.StepView[i]) 
      </div> 
      } 
      else 
      { 
       <div class="wizard-step" style="height:auto;position:relative;"> 
       @Html.Partial((string)Model.StepView[i]) 
       </div> 
      } 
     } 
     </td> 
    </tr> 
    <tr> 
     <td align="center"> 
     <div id="buttons" class="actionBar"> 
      <input type="button" class="button" id="CancelButton" value="Cancel" onclick="closeModal();" /> 
      <input type="submit" class="button" id="SaveButton" value="Update" style="float:left"/> 
     </div> 
     </td> 
    </tr> 
    </table> 

<script type="text/javascript"> 

     function closeModal() { 
     $(myModal).dialog('close'); 

    } 

</script> 
} 

我不確定是什麼導致了這個問題,因爲當我點擊取消或使用X按鈕關閉模式對話框時它工作得很好。但是,當我提交表單並關閉使用相同的JavaScript closeModal()

回答

1

我發現了這個錯誤。我只是做了如下改變

   $('#model-editor').dialog({ modal: true, 
        width: 'auto', resizable: false, autoOpen: false, 
        closeOnEscape: true, position: 'middle' 

       }); 

       $('#model-editor').html(data); <<= Moved this line after modal initialization 
        myModal = $('#model-editor').dialog('open'); 
       $.validator.unobtrusive.parse("#EditForm"); 
0

我想你應該嘗試

dialog('destroy') instead dialog('close')