首页 > 解决方案 > 如何修复 Sharepoint Client 对象中的 Datepicker?

问题描述

 //Date Picker Object
        $(document).ready(function () {

            var myCounter = 1;
            $(".myDate").datepicker();



            $(".myDate").on('focus', function () {
                var $this = $(this);
                if (!$this.data('datepicker')) {
                    $this.removeClass("hasDatepicker");
                    $this.datepicker();
                    $this.datepicker("show");
                }
            });


        });
<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
  <script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" />


 <input class="myDate" type="text" name="inputDate1" size="autofill" placeholder="Select End Date"
                        style="margin-right: 20px; text-align: right" readonly /></input>

我在将 datepicker js 文件修复到共享点时遇到问题。我尝试了 datepicker() 函数,但它显示“Uncaught TypeError: $(...).datepicker is not a function”。

但实际上我得到了没有共享点内容的ans。我需要在 sharepoint 中工作的流程。你能建议我如何纠正这个问题吗?

提前致谢...

//日期选择器对象 $(document).ready(function () {

        var myCounter = 1;
        $(".myDate").datepicker();



        $(".myDate").on('focus', function () {
            var $this = $(this);
            if (!$this.data('datepicker')) {
                $this.removeClass("hasDatepicker");
                $this.datepicker();
                $this.datepicker("show");
            }
        });


    });

标签: jquerysharepoint

解决方案


不确定为什么要为 datepicker 添加焦点功能。

下面的脚本在我的本地运行良好。

<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
    <script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" />


    <input class="myDate" type="text" name="inputDate1" size="autofill" placeholder="Select End Date"
           style="margin-right: 20px; text-align: right" readonly />


    <script type="text/javascript">
        $(document).ready(function () {
            var myCounter = 1;
            $(".myDate").datepicker();
            //$(".myDate").on('focus', function () {
            //    var $this = $(this);
            //    if (!$this.data('datepicker')) {
            //        $this.removeClass("hasDatepicker");
            //        $this.datepicker();
            //        $this.datepicker("show");
            //    }
            //});
        });
    </script>

在此处输入图像描述

用于故障排除。

使用开发者工具检查加载成功的库。

如果库未成功加载,请下载并保存到 SharePoint 并加载表单 SharePoint。

例如:

<script src="/SiteAssets/jquery-1.8.3.js"></script>
    <script src="/SiteAssets/jquery-ui.js"></script>

在此处输入图像描述


推荐阅读