下拉触发更改功能以获取要在 datetimepicker 中禁用的日期

Question

我有一个员工姓名和 StaffId 的下拉列表。这连接到约会业务逻辑。我正在尝试触发 select 更改，以便设置存储在数据库中的日期在连接的 jquery 日期时间选择器中不可用。我已经组装了下面似乎不起作用的代码。谁能指出我正确的方向。谢谢

<script type="text/javascript">
        $(document).ready(function () {
            getdates();
        });

        var unavailableDates;
        $(document).ready( function getdates() {

            $("#StaffId").change(function (e) {
                $this = $(e.target);
                    $.ajax({
                        type: "POST",
                        url: "/Appointment/GetOffdays",
                        data: { StaffId: $this.val()  },
                        //contentType: "application/json"
                        success: function (data) {
                            debugger;
                            unavailableDates = data;

                            $(".jqueryui-marker-datepicker").datepicker({
                                dateFormat: "dd/M/yy",
                                changeMonth: true,
                                changeYear: false,
                                yearRange: "-1:+0",
                                //beforeShowDay: $.datepicker.noWeekends,
                                minDate: new Date(@(ViewBag.year+","+ViewBag.month+","+ViewBag.day)),
                                maxDate: new Date(@(ViewBag.eyear+","+ViewBag.emonth+","+ViewBag.eday)),

                                beforeShowDay: function (date) {
                                    var dmy = date.getDate() + "-" + (date.getMonth() + 1) + "-" + date.getFullYear();
                                    debugger;
                                    if ($.inArray(dmy, unavailableDates) == -1) {
                                        return [true, ""];
                                    } else {
                                        return [false, "myclass", "Unavailable"];
                                    }
                                }
                                });
                            },
                             dataType: "json",
                            traditional: true,
                            })


                }

           )
            $('#StaffId').trigger('change');
        });
        </script>

Answer 1

可能是因为您没有先为下拉列表定义值。试试这个：

$('#StaffId').val('12345');
$('#StaffId').trigger('change');

其他备注：为什么2个文件准备好了？

Answer 2

为了降低代码的复杂性，我删除了 getdates 的内容并用一个简单的 log() 替换它，我将在下面放置它。如果我按原样执行此页面，则首先调用发送到 $(document.ready() 的匿名函数，甚至在提到函数 getdates 之前，导致控制台抛出

jQuery.Deferred exception: getdates is not defined ReferenceError: getdates is not defined

根据这个问题

jQuery - multiple $(document).ready ...?

当多次连续调用 $(document).ready 时，在 DOM 准备就绪后，每个函数将按照它们设置的顺序被调用。即使您颠倒了对 ready 的调用顺序，因为命名函数 getDates 仅在函数调用期间命名，因此在其他任何地方都无法使用该名称调用。编辑：另请注意，如果排队等候 documentready 的第一个函数抛出异常，jquery 将不会调用下一个。所以如果匿名函数失败，命名函数将被完全跳过。

请多多包涵，因为我在这个网站上确实没有回答很多问题，而且我可能严重误解了您的代码。但我认为您要做的是定义一个函数 getDates 并在名为“#StaffId”的 HTML 元素的值发生更改时调用它。要实现这一点，您只需要调用一次 $(document).ready()，它可以调用必须在其范围内定义的函数 getdates，或者您可以完全摆脱 getdates 并调用它的内容是匿名的。

<script type="text/javascript">
    $(document).ready(function () {
        getdates();
    });

    var unavailableDates;
    //this function might as well be anonymous since getdates is not available anywhere else by that name.
    //The function it refers to is passed and executed on document ready, but the alias getdates goes away.
    $(document).ready( function getdates() {

        console.log("getting dates");
    });
</script>

应该是

<script type="text/javascript">
    //if unavailableDates is not used outside this function, it probably shouldn't be in the global scope.
    var unavailableDates;
    function getDates(){
        //now getDates is available everywhere, by its name
        console.log("getting dates");
    };

    //or $(document).ready(getDates);
    $(getDates);
</script>

或者只是

<script type="text/javascript">
        $(function (){
            //no need for named getdates polluting global namespace if you only intend to call it once.

            //do whatever you want here
    });
</script>

下拉触发更改功能以获取要在 datetimepicker 中禁用的日期

Dropdown trigger change function to fetch dates to disable in datetimepicker

ajax

asp.net-mvc

jquery

json

datetimepicker