如何在每次關閉模式窗口時在SimpleModal中刪除數據

我正在使用Eric Martin的SimpleModal插件1.4.1和JQuery 1.4.2在模態窗口中顯示基本窗體。如何在每次關閉模式窗口時在SimpleModal中刪除數據

表單有2個JQuery UI Datpicker元素。

一切按預期工作（我認爲）。當用戶給日期選擇器文本框賦予焦點時，Datepickers顯示他們的日曆。當用戶單擊「取消」按鈕時，模式將消失，Datepicker元素中的值將被隱藏。這是問題所在。

當窗口關閉時，我需要模態窗口「忘記」它包含的所有窗體值，因爲窗體被提交或點擊取消按鈕，而不僅僅是隱藏它們。我不介意如果必須以編程方式執行此操作。

我當前SimpleModal代碼如下所示：

$('#NewDeliverable').click(function() { 
      $("#DeliverableFormContainer").modal({onOpen: function (dialog) { 
       dialog.overlay.fadeIn('slow', function() { 
        dialog.data.hide(); 
        dialog.container.fadeIn('slow', function() { 
         dialog.data.slideDown('slow'); 
        }); 
       });

編輯感謝@Josiah Ruddell對他的幫助。以下是此問題的其他人的完整工作代碼：

$('#NewDeliverable').click(function() 
     { 
      $("#DeliverableFormContainer").modal({ 
       onOpen: function (dialog) 
       { 
        dialog.overlay.fadeIn('slow', function() 
        { 
         dialog.data.hide(); 
         dialog.container.fadeIn('slow', function() 
         { 
          dialog.data.slideDown('slow'); 
         }); 
        }); 
       }, 
       onClose: function(dialog) 
       { 
        dialog.data.find(':input').each(function() 
        { 
         switch (this.type) 
         { 
          case 'password': 
           $(this).val(''); 
           break; 
          case 'select-multiple': 
          case 'select-one': 
           $(this).val(-1); 
           break; 
          case 'text': 
          case 'textarea': 
           $(this).val(''); 
           break; 
          case 'checkbox': 
          case 'radio': 
           this.checked = false; 
         } 
        }); 

        $.modal.close(); // must call this! 

       }, persist: true 
      }); 
     }); 


      }}); 
     });

來源

2010-12-06 Kyle Noland

添加清除模態數據的onclose回調。你可以很容易地將它作爲一個名爲clear form的jquery插件。

$("#DeliverableFormContainer").modal({ 
    persist: true, // don't clone the data 
    onOpen: function(){ /* code */ }, 
    onClose: function(dialog){ 
     dialog.data.find(':input').each(function() { 
      if(this.type.match(/password|text|textarea/)) 
       $(this).val(''); 
      else if(this.type.match(/select\-multiple|select\-one/)) 
       $(this).val('-1'); 
      else if(this.type.match(/checkbox|radio/)) 
       this.checked = false; 
     }); 
     $.modal.close(); // must call this! 
    } 
});

來源

2010-12-06 20:51:32

無論哪種方式應該工作，我更新的例子。如果您願意，您可以查看編輯並提取該代碼。 – 2010-12-06 21:04:32