Asp.net捆绑打破了jquery UI

时间:2014-12-22 15:59:37

标签: jquery asp.net jquery-ui bundling-and-minification

当我在发布模式下发布我的应用时,datepickers停止工作。

我很确定它与笨蛋有关,但我无法弄清楚是什么

Jquery和Jquery UI都以正确的顺序加载,只加载一次。

此外,$.ui已初始化。

如果我尝试使用

绑定Google Chrome控制台中的日期选择器
$("#birthdate").datepicker();

没有错误,但是日期选择器没有绑定,输入中没有hasDatepicker

如果我尝试

$("#birthdate").datepicker("show");

我有以下错误

  

未捕获的TypeError:无法读取未定义的属性“apply”

因为没有初始化日期选择器

这是代码

<input class="form-control default-date-picker" data-msg-date="The field Birth Date must be a date." data-msg-required="The Birth Date field is required." data-rule-date="true" data-rule-required="true" id="birthdate" name="BirthDate" type="text" value="0001-01-01 12:00:00 AM" aria-required="true">

<script type='text/javascript'>
     $(function () {
          $("#birthdate").datepicker();
     });
</script>

我无法弄清楚问题

修改

我注意到当我处于发布模式时,我从未在那些jquery函数中遇到断点

/* Attach the date picker to a jQuery selection.
     * @param  target   element - the target input field or division or span
     * @param  settings  object - the new settings to use for this date picker instance (anonymous)
     */
    _attachDatepicker: function(target, settings) {
        var nodeName, inline, inst;
        nodeName = target.nodeName.toLowerCase();
        inline = (nodeName === "div" || nodeName === "span");
        if (!target.id) {
            this.uuid += 1;
            target.id = "dp" + this.uuid;
        }
        inst = this._newInst($(target), inline);
        inst.settings = $.extend({}, settings || {});
        if (nodeName === "input") {
            this._connectDatepicker(target, inst);
        } else if (inline) {
            this._inlineDatepicker(target, inst);
        }
    },
/* Attach the date picker to an input field. */
    _connectDatepicker: function(target, inst) {
        var input = $(target);
        inst.append = $([]);
        inst.trigger = $([]);
        if (input.hasClass(this.markerClassName)) {
            return;
        }
        this._attachments(input, inst);
        input.addClass(this.markerClassName).keydown(this._doKeyDown).
            keypress(this._doKeyPress).keyup(this._doKeyUp);
        this._autoSize(inst);
        $.data(target, PROP_NAME, inst);
        //If disabled option is true, disable the datepicker once it has been attached to the input (see ticket #5665)
        if( inst.settings.disabled ) {
            this._disableDatepicker( target );
        }
    },

捆绑代码

bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                        "~/Scripts/jquery-{version}.js",
                        "~/Scripts/jquery.unobtrusive-ajax.js"));


 bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include(
                       "~/Scripts/jquery-ui-1.10.4.js",
                   "~/Scripts/jquery-ui-i18n.js"));

脚本在_layout.cs

<head>部分中呈现
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryui")

1 个答案:

答案 0 :(得分:2)

这总是发生在我身上。我不确定这是不是一回事。

确保下面的代码没有执行两次,或者在Razor页面中搜索字符串中的重复@ Script.Render。

 @Scripts.Render("~/bundles/jquery")