7

我正在尝试让我的 MVC3、EF4 项目与 javascript datepicker 一起使用，但我遇到了问题，因为我希望日期采用英国格式 (dd/mm/yyyy)。

我花了几个小时研究这个问题，我决定实现我在这个链接中看到的“全球化”库脚本。

但是，当我运行它时，我Uncaught TypeError: Cannot read property 'methods' of undefined在 javascript 中得到了一个（来自该行）。$.validator.methods.date我对 javascript 的了解非常有限，我发现使用“全球化”库的所有示例都没有提到这个错误，因此我很困惑。

我从下面的视图中显示了相关代码：

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-1.5.1.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-ui-1.8.11.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-ui-1.8.11.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.globalize/globalize.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.globalize/cultures/globalize.culture.en-GB.js")" type="text/javascript"></script>

<link href="../../Content/themes/base/jquery.ui.all.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
    Globalize.culture("en-GB");
    $.validator.methods.date = function (value, element) { return this.optional(element) || Globalize.parseDate(value); }
</script>

<script type="text/javascript">
    $(document).ready(function () {
        $('.date').datepicker({ dateFormat: "dd/mm/yy" });
    });
</script>

//SNIP

<div class="editor-field">
    @Html.TextBox("Expires", Model.Expires, new { @class = "date" })
    @Html.ValidationMessageFor(model => model.Expires)
</div>

有人可以帮我解决这个问题。

非常感谢。

4

1 回答 1

0

我已经有一段时间没有使用 Globalize 库了，但我觉得它对你来说可能有点过头了——假设你只需要 en-GB 中的日期值，下面的 Javascript/jQuery 代码就可以工作（这里是一个小提琴) :

<input type="text" class="date" placeholder="en-gb datepicker" />
<button id="btnGetVal">Get Value</button>

<script type="text/javascript">
$(document).ready(function () {
    /* you correctly have the date format set when initializing the datepicker */
    $('.date').datepicker({ dateFormat: "dd/mm/yy" });
    /* create an event handler for the "click" function of the button */
    $('#btnGetVal').on('click', function() {
       /* event handler */
       var targetValue = $('.date').val();
       alert(targetValue);
    });
});
</script>

我使用 jQuery 2.1.0 和 jQuery UI 1.10.4 对此进行了测试 - 您可能需要为两者更新 NuGet 包（我看到您使用的是非常旧版本的 jQuery，所以我假设您需要支持 IE8 或正在使用旧版本的 MVC）。

顺便说一句，您可能希望确保在 document.ready() 函数内初始化所有 Javascript 代码，以便在加载时可以访问所有函数（因为在初始化 datepicker() 时无法访问 Globalize 代码. 我建议在这里阅读更多内容：http ://learn.jquery.com/using-jquery-core/document-ready/

于 2014-07-22T21:18:35.983 回答