jquery datepicker在部分视图中不起作用

时间:2014-04-23 06:19:13

标签: jquery

Datepicker jquery在视图中不起作用,它作为部分视图返回。

主视图中的

      <link href="~/css/jquery.ui.all.css" rel="stylesheet" />
        <script src="~/Scripts/jquery-1.10.2.js"></script>
    <script src="~/Scripts/jquery.ui.core.js"></script>
    <script src="~/Scripts/jquery.ui.widget.js"></script>
    <script src="~/Scripts/jquery.ui.datepicker.js"></script>

    <script type="text/javascript">

        $(".datepicker").datepicker({
            minDate: 0,

            dateFormat: 'mm/dd/yy', beforeShow: function () {
                $(".ui-datepicker").css('font-size', 12)

            },

        });



  </script>

在第二个视图中:

<td >
 <input type="text" id="startDate" name="startDate" class="datepicker" />
  </td>
控制器中的

return PartialView(secondView);

仅在主视图中给出jquery

编辑:在ajax成功时调用datepicker

$.ajax({
            url: '/a/b/',
            data: { datepicker: $('#datepicker').val(), id: id },
            cache: false,
            success: function (data) {
                var htmldata = $.parseHTML(data);
                if (id == 1) {
                    $('#a').html(data);
                    $(".datepicker").datepicker();

                }
                else { $('#a').html(data); $(".datepicker").datepicker(); }


            },

        });

    };

2 个答案:

答案 0 :(得分:1)

将您的代码设置如下所示

 <script type="text/javascript">
     (function() {
            $(".datepicker").datepicker({
            minDate: 0,

            dateFormat: 'mm/dd/yy', beforeShow: function () {
                $(".ui-datepicker").css('font-size', 12)
            },
        });
          })();
</script>

答案 1 :(得分:0)

在渲染局部视图之后立即放置这些线,而不是将它们放在局部视图中:

 <script type="text/javascript">

        $(".datepicker").datepicker({
            minDate: 0,

            dateFormat: 'mm/dd/yy', beforeShow: function () {
                $(".ui-datepicker").css('font-size', 12)

            },

        });



  </script>

如果通过ajax调用加载,则在将部分视图附加到页面后将此脚本写入成功函数,如果在该语句之后使用Razor助手。