JQuery UI對話框沒有正確關閉

Question

我正在使用JQuery對話框來渲染局部視圖。

場景：

第1步：點擊「添加」錨鏈接，文本框將打開對話框。

第2步：用戶填寫文本框的值，然後單擊保存按鈕。

第3步：詳細信息將被保存，對話框將被關閉。

第4步：現在用戶將點擊'查看'錨鏈接，再次打開帶有隻讀文本框值的對話框。

第5步：用戶將點擊取消按鈕。

第6步：再次點擊「添加」錨點鏈接，並打開文本框對話框。

第7步：用戶填寫文本框的值，然後單擊保存按鈕。

第8步：問題從這裏開始。它應該保存剛剛輸入的用戶的詳細信息，但它保存了舊值（我們在步驟4中已經查看過）。

我曾嘗試下面的代碼來渲染上點擊打開的對話框

var div = $("#DivTaskDetail"); 
var Title = ""; 

if (Mode == 1) { 
    Title = "Edit Task Detail"; 
} 
else if (Mode == 2) { 
    Title = "View Task Detail"; 
} 
else { 
    Title = "Add Task Detail"; 
} 

div.load("/Task/TaskDetailEditView?taskID=" + TaskID + "&mode=" + Mode, function() { 
    div.dialog({ 
     modal: true, 
     width: 500, 
     height: 450, 
     title: Title, 
     resizable: false, 
     close: function() { 
      $(this).dialog("close");    
     } 
    }); 
}); 

和取消按鈕的點擊局部視圖，我寫了下面的代碼

function onClickCancelTask() { 
$('#DivTaskDetail').dialog("close"); 
} 

我曾嘗試下面不同的代碼關閉對話框，但沒有一個對我工作正常。

1. $('#DivTaskDetail').empty(); 

2. $('#DivTaskDetail').remove(); 

3. $('#DivTaskDetail').dialog('destroy').remove(); 

4. $('.ui-icon-closethick').click(); 

5. $('#DivTaskDetail').dialog("close"); 

6. $('#DivTaskDetail').dialog("destroy"); 

7. $("#DivTaskDetail").dialog("destroy"); 
    $('#DivTaskDetail').dialog('close').dialog('remove'); 

8. $('#DivTaskDetail').dialog("destroy"); 
    $('#DivTaskDetail').remove(); 

任何人都可以請指導我這一點。

Answer 1

我找到了解決辦法，它對我來說工作得很好。

我已經使用下面的代碼來打開Partial View作爲JQuery對話框。

var div = $("#DivTaskDetail"); 
var Title = ""; 

if (Mode == 1) { 
    Title = "Edit Task Detail"; 
} 
else if (Mode == 2) { 
    Title = "View Task Detail"; 
} 
else { 
    Title = "Add Task Detail"; 
} 

$.ajax({ 
    url: "/Task/TaskDetailEditView", 
    type: "Post", 
    datatype: "html", 
    data: { "taskID": TaskID, "mode": Mode }, 
    success: function (data) { 
     $('#DivTaskDetail').html(data);    

     $("#DivTaskDetail").dialog({ 
      autoopen: false, 
      width: 500, 
      height: 450, 
      modal: true, 
      resizable: false, 
      draggable: true, 
      title: Title, 
      open: function() { 
       $('div.ui-widget-overlay').hide(); 
       $("div.ui-dialog").not(':first').remove(); 
      } 
     }); 

     $('a.ui-dialog-titlebar-close').remove(); 
     $('#divProcessImage').css({ "display": "none" }); 
    }, 
    error: function (req, status, error) { 
     ErrorMessage(req.responseText); 
     $('#screen').css({ "display": "block", "width": "", "height": "" }); 
     $('#divProcessImage').css({ "display": "none" }); 
    } 
}); 

並點擊關閉按鈕，我使用下面的代碼。

$('#DivTaskDetail').dialog("destroy"); 
    $('#DivTaskDetail').html("");