DateTimePicker不在局部视图中工作

时间:2015-02-27 16:16:03

标签: jquery twitter-bootstrap asp.net-mvc-4 jquery-ui

DateTimePicker无法正常工作。我正在尝试使用来自外部资源的此引导程序和jquery源代码(我的解决方案中没有添加下面的链接或脚本)!

   <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>  
   <link href="<?php echo base_url();?>css/bootstrap-datetimepicker.min.css"  rel="stylesheet" type="text/css" />  
   <script type="text/javascript" src="<?php echo base_url();?>js/bootstrap-datetimepicker.min.js"></script> 

     <div style="display:inline;">
             <span id="PickUpDate" class="locationdetail-text-input">
                <input data-format="MM-dd-yyyy" type="text" style="width:110px; height:20px;" />
                <span class="add-on">
                  <i data-time-icon="icon-time" data-date-icon="icon- calendar"></i>
                </span>
              </span>
              <span id="PickUpTime" class="locationdetail-text-input">
                <input data-format="hh:mm" type="text"  style="width:110px; height:20px;" />
                <span class="add-on">
                      <i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>
                </span>
              </span>
      </div> 

<script type="text/javascript">
    $(document).ready(function () {
        $('#PickUpDate').datetimepicker({ pickTime: false });

        $('#PickUpTime').datetimepicker({ pickDate: false });
     });
</script>

1 个答案:

答案 0 :(得分:2)

如果这是您的部分代码,那么您需要删除它的所有脚本。将您需要的引用放在主页面上。将partial添加到页面后,它将可以访问这些引用,然后您只需要实例化日期选择器。把你的电话放在一个功能

function SetUpPickers(){
   $('#PickUpDate').datetimepicker({ pickTime: false });

    $('#PickUpTime').datetimepicker({ pickDate: false }); 
}

然后在加载部分后调用此函数。如果你在ajax调用中加载部分类似

.success(data){
    $('.ContentDiv').html(data);
    SetUpPickers();
}