【问题标题】:Change not being triggered on page load页面加载时未触发更改
【发布时间】:2017-06-07 01:09:32
【问题描述】:

我有一个页面,用于为唯一的生产线、班次和日期组合创建生产记录,以及编辑现有记录。我有两个用于线路和班次的下拉菜单,以及一个用于日期的 jQuery 日期选择器。当行更改时,日期选择器被禁用并且班次下拉菜单被重置。我想在创建新班次时禁用日期选择器(在选择班次后启用),但我无法弄清楚如何去做。这是我的jQuery 代码:

$(document).ready(function() {                
       $('#lineSel').on('change',function() {
           $('#shiftSel').find('option:first').attr('selected', 'selected');
           $('#datePicker').val('').datepicker('disable');
           console.log('Datepicker disabled');
       });

       $('#shiftSel').on('change',function() {
           $.ajax({
               url: '/api/Shifts/GetDates',
               data: { plantCd: '@Model.PlantCd',
                       lineId: $('#lineSel').val(),
                       shift: $('#shiftSel').val()
                    },
               success: function(e) {
                   var dates = e.toString().split(',');
                   $('#datePicker').datepicker('option', 'beforeShowDay', function(date) {
                        var string = jQuery.datepicker.formatDate('yy-mm-dd', date);
                        return [dates.indexOf(string) == -1];
                   });
               }
            });
           $('#datePicker').datepicker('enable');
       });

       if ('@Model.Title' !== 'New Shift') {
           $('#shiftSel').change();
       }     

       $('#lineSel').change();
});

#lineSel 是行的下拉菜单,#shiftSel 是班次的下拉菜单,#datePicker 是日期选择器。

页面加载后,如果我更改下拉菜单,日期选择器会按原样禁用。但是,$('#lineSel').change(); 执行 on('change') 代码('Datepicker disabled' 显示在浏览器开发工具控制台中),但日期选择器没有被禁用。

我尝试在ready 函数中调用$('#datePicker').datepicker('disable'),将.change() 添加到事件处理程序绑定的末尾,使用.change(function() 而不是on('change', function()),以及来自this question 和@ 的其他建议987654322@.

任何想法为什么日期选择器在页面加载时没有被禁用以及我可以做些什么来解决它?在应用程序中使用jQuery UI 1.11.2 和ASP.NET MVC 5。

【问题讨论】:

  • 我认为sn-p/demo最好让我们测试代码..如果没有引起任何问题,您可以避免在演示中使用ajax
  • 检查jsfiddle.net/xpz6h12h,如果Model.Title 包含New Shift,页面加载后日期选择器输入框会奇怪地禁用。随时提供更多详细信息以在 MVC 视图中创建重现。
  • 我的小提琴:dotnetfiddle.net/cQaQjQ。这是我第一次做小提琴,无法让日期选择器工作(可能很明显,比如缺少参考),但它是我的代码的简化版本。 @TetsuyaYamamoto,看起来你的小提琴和我的代码有相同的行为,有什么想法吗?
  • @user3517375 我运行了你的小提琴并在浏览器控制台中找到了SyntaxError: missing ) after argument list。即使更改 Shift DDL(并且 console.log('Datepicker disabled') 也没有执行),日期选择器也完全没有反应。

标签: jquery asp.net-mvc jquery-ui jquery-ui-datepicker


【解决方案1】:

在玩了@TetsuyaYamamoto 的小提琴并尝试了不同的东西之后,终于弄清楚了如何让它工作。将$('#lineSel').change() 替换为$('#datePicker').prop('disabled', true) 就成功了。谢谢您的帮助。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-03-09
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多