页面加载时未触发更改

Question

我有一个页面，用于为独特的生产线、班次和日期组合创建生产记录，以及编辑现有记录。我有两个用于行和班次的下拉菜单，还有一个用于日期的 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() 而不是 [=23] =]，以及来自 this question and this question.

的其他建议

知道为什么日期选择器在页面加载时没有被禁用吗？我可以做些什么来解决这个问题？在和 ASP.NET MVC 5 应用程序中使用 jQuery UI 1.11.2。

Answer 1

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

页面加载时未触发更改

Change not being triggered on page load

asp.net-mvc

jquery

jquery-ui

jquery-ui-datepicker