关闭jQuery Datepicker关闭jQuery对话框

第一次在这里，更多的网页设计师比程序员，所以要温柔！ ; o）无论如何，正如标题所暗示的那样，我有一个打开的对话窗口，并在其中显示一个日期选择器。我想要的是，如果用户打开日期选择器，然后单击对话窗口的关闭按钮，日期选择器也会关闭。关闭jQuery Datepicker关闭jQuery对话框

这里就是我目前有：

 <!--// Modal Windows -->   
     $.ui.dialog.defaults.bgiframe = true; 
     $(function() { 
      $('#advanced_search').dialog({ 
       autoOpen: false, 
       width: 600, 
       height: 400, 
       modal: true, 
       resizable: false, 
       draggable: false, 
       title: 'Advanced Search', 
      }); 
      $('.adv_search').click(function() { 
       $('#advanced_search').dialog('open'); 
      }); 
     }); 

     <!--// Date Picker --> 
     $("#advanced_search .start_date").datepicker({ 
      dateFormat: 'dd/mm/yy', 
      showButtonPanel: true, 
      duration: 0, 
      constrainInput: true, 
      showOn: 'button',    
      buttonImage: '/img/icons/50.png', 
      buttonImageOnly: true        
     }); 
     $("#advanced_search .end_date").datepicker({ 
      dateFormat: 'dd/mm/yy', 
      showButtonPanel: true, 
      duration: 0, 
      constrainInput: true, 
      showOn: 'button', 
      buttonImage: '/img/icons/50.png', 
      buttonImageOnly: true        
     });

但我有点狼狈至于如何做到这一点。任何人有任何建议？这将非常感谢！

感谢菲尔

来源

2010-01-20 Phil

添加收盘回调到您的对话框如下：

$(function() { 
    $('#advanced_search').dialog({ 
     autoOpen: false, 
     width: 600, 
     height: 400, 
     modal: true, 
     resizable: false, 
     draggable: false, 
     title: 'Advanced Search', 
     close: function() { 
      $("#advanced_search .start_date").datepicker('hide'); 
      $("#advanced_search .end_date").datepicker('hide'); 
     } 
    }); 
    $('.adv_search').click(function() { 
     $('#advanced_search').dialog('open'); 
    }); 
});

这里是一个包容各方的办法，就是稍微好一点，更简单的选择和，直到不会创建日期选择器对话框居然开，所以如果用户从来没有进入它，脚本运行少：

$(function() { 
    $('#advanced_search').dialog({ 
     autoOpen: false, 
     width: 600, 
     height: 400, 
     modal: true, 
     resizable: false, 
     draggable: false, 
     title: 'Advanced Search', 
     close: function() { 
      $("#advanced_search .start_date").datepicker('hide'); 
      $("#advanced_search .end_date").datepicker('hide'); 
     }, 
     open: function(event, ui) { 
      $(".start_date, .end_date", ui).datepicker({ 
      dateFormat: 'dd/mm/yy', 
      showButtonPanel: true, 
      duration: 0, 
      constrainInput: true, 
      showOn: 'button',    
      buttonImage: '/img/icons/50.png', 
      buttonImageOnly: true        
      }); 
     } 
    }); 
    $('.adv_search').click(function() { 
     $('#advanced_search').dialog('open'); 
    }); 
});

来源

2010-01-20 14:58:22

感谢您的超快速回复尼克。我很尴尬，这是一个简单的解决方案; o） – Phil 2010-01-20 15:02:43

@Phil：没问题，再次检查一个更紧凑的整体解决方案，如果你要运行很多脚本，那么它会节省一些CPU周期直到他们被要求时才创造事物。需要注意的一点是，所有的jQuery对象都是集合，你也可以执行'$（“＃advanced_search .start_date，＃advanced_search .end_date，”）'并减少重复的代码。 – 2010-01-20 15:09:37

嗨，尼克，感谢您的更新。我已经添加了该代码，并且Firebug给了我以下错误：缺失}属性列表后打开：function（event，ui）{\ n 任何想法？ – Phil 2010-01-20 16:05:17

关闭jQuery Datepicker关闭jQuery对话框

回答

相关问题