當我關閉它時從JQuery對話框中刪除數據

我有用於在表中插入新行的JQuery對話框。一切都很好。幾天前，當我插入FlexiGrid for Table對我來說開始有一個問題。當我插入新的行對話框消失，但是當我打開之前插入的新插入數據的對話框仍然處於對話框中時。當我關閉它時從JQuery對話框中刪除數據

如何在完成使用後重置對話框字段。

的對話框中的代碼是這樣的：

$(function() { 
    $("#dialog:ui-dialog").dialog("destroy"); 
     $("#newDialog-form").dialog({ 
      autoOpen: false, 
      height: 250, 
      width: 300, 
      modal: true, 
      buttons: { 
       Salva: function() { 
        $.ajax({ 
         url: 'agendaTipoAppuntamentoSaveJson.do', 

         type: "POST", 
         dataType: "json", 
         data: $("#newDialogForm").serialize(), 
         success: function(result) { 
          if (result.esito!='OK') { 
           alert(result.esito + ' ' + result.message); 
          } 
          else { 
           addNewTipoAppuntamento(
              result.insertedTipoApp.idTipoAppuntamento , 
              result.insertedTipoApp.codice, 
              result.insertedTipoApp.descrizione, 
              result.insertedTipoApp.descrBreve, 
              result.insertedTipoApp.colore 
          ); 
          $("#newTable").flexReload(); 
          $("#newDialog-form").dialog('close'); 
          } 
         }, 
         error:function (xhr, ajaxOptions, thrownError){ 
          alert(xhr.status); 
          alert(thrownError); 
         } 
        }); 
       }, 
       Annula : function() { 
        $(this).dialog("close"); 
       } 
       } 
     }); 

     $("#newDialog-form").dialog({ closeText: '' }); 
});

這是對話形式：

<div id="newDialog-form" title="Nuovo Tipo Appuntamento" class="inputForm" > 
    <form id="newDialogForm" action="agendaTipoAppuntamentoSaveJson.do" > 
    <input type="hidden" name="azione" id="idAzione" value="update" /> 
    <input type="hidden" name="idTipoAppuntamento" id="idTipoAppuntamentoIns" value="-1" /> 
    <fieldset> 
     <table> 
      <tr > 
      <td> 
      <label for="codiceIns">Codice </label> 
      </td><td> 
      <input type="text" name="codice" id="codiceIns" class="text ui-widget-content ui-corner-all"/> 
      </td></tr><tr> 
      <td> 
      <label for="descrizioneIns">Descrizione </label> 
      </td><td> 
      <input type="text" name="descrizione" id="descrizioneIns" value="" class="text ui-widget-content ui-corner-all" /> 
      </td></tr><tr> 
      <td> 
      <label for="descrBreveIns">descrBreve </label> 
      </td><td> 
      <input type="text" name="descrBreve" id="descrBreveIns" value="" class="text ui-widget-content ui-corner-all" /> 
      </td></tr><tr> 
      <td> 
      <label for="coloreIns">colore </label> 
      </td><td> 
      <input type="text" name="colore" id="coloreIns" value="" class="text ui-widget-content ui-corner-all" /> 
      </td> 
      </tr> 
     </table> 
    </fieldset> 
    </form> 
</div>

來源

2012-01-23 Akosha

'如何在完成使用後重置對話框字段'您能否詳細解釋 –

我只是想在表單中按下Save od Cancel按鈕時清除表單中的數據，所以當我再次打開它時，我已經清除了形式和以前的數據不形成 – Akosha

檢查Dialog Close事件。你需要存儲對話的狀態，如果你正在修改它，狀態將包括（標題，文本等）。

更新

閱讀評論後，我得到了什麼，根據它給的答案。如果我錯了，請糾正我。

在打開dailog窗體之前，將html存儲到本地變量，然後在關閉之前將html設置回對話框。

var originalContent; 
$("#newDialog-form").dialog({ 
    //Your Code, append following code 
    open : function(event, ui) { 
     originalContent = $("#newDialog-form").html(); 
    }, 
    close : function(event, ui) { 
     $("#newDialog-form").html(originalContent); 
    } 
});

希望這可以幫助你。

來源

2012-01-23 08:56:46

是的，它幫助...我有明確的對話框... – Akosha

我試過這種方法，它在恢復html結構方面工作正常。但是**對話框**上的任何控件所附帶的** events **似乎都會丟失**，因爲它們沒有保存在結構中。我將嘗試在對話框的打開事件中添加一個額外的ApplyDialogEvents（）函數，以查看是否有幫助。 – Matt

您可以使用close事件jQuery的對話框中。

有關jQuery UI的更多信息。

例如

$("#newDialog-form").dialog({ 
    ... 
    close : function() { 
     //functionality to clear data here 
    } 
});

來源

2012-01-23 08:54:07 tobias86

我會盡量避免編寫我自己的函數清除對話框中的數據...也許有人有解決方案：S – Akosha

如果將此行添加到保存或取消功能，它會起作用嗎？

$("#newDialog-form").html("");

以上直法（THX @mplungjan）：

$("#newDialog-form").empty();

它使所有的對話框裏面的內容消失，它是如此，去年的數據不會出現的最佳途徑。

來源

2012-01-23 08:56:34 netadictos

爲什麼不使用[.empty（）]（http：// jsperf。 com/jquery-empty-vs-html]）？ – mplungjan

@mplungjan：或者empty（）（我將它添加到我的答案Thx中），這是另一個直接的解決方案，問題是無論代碼如何被考慮，都可以在不查找對話方法的情況下解決。 – netadictos

它從對話框中刪除所有內容。當我第二次打開它時，沒有更多行需要插入。與html（）相同並且爲空（） – Akosha

通過將html屬性設置爲無，您可以清除DIV中的所有html內容。

$("#ElementId").html("");

來源

2012-01-23 11:24:18 Raathigesh

爲什麼不能在對話框中創建HTML每次打開它，然後做這個時間：

$(this).dialog("close"); 
$(this).remove();

..after大功告成插入新的記錄，一般經過

$('#yourForm').submit();

乾杯！

來源

2015-06-19 09:39:24

當我關閉它時從JQuery對話框中刪除數據

回答

相關問題