如何在每次关闭模式窗口时在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