使用 @Url.Action 传递 JQuery datepicker 值以控制操作答案

【问题标题】：Pass JQuery datepicker value to control action using @Url.Action使用 @Url.Action 传递 JQuery datepicker 值以控制操作
【发布时间】：2017-10-30 11:31:12
【问题描述】：

我正在尝试将 asp.net mvc 视图日期时间值传递给 mvc 控制器。但它得到空值。

Chtml 代码

<input type="date" id="start_date" class="form-control" placeholder="Check in" data-ng-model="departuredate" />
<input type="date" id="end_date" class="form-control" placeholder="Check Out" data-ng-model="returndate" />
<a class="link_button2" ng-href="@Url.Action("Booking", "home")?DepartureDate={{departuredate1}}&ReturnDate={{returndate}}"> Search </a>

脚本

<script>
    if (datefield.type != "date") { //if browser doesn't support input type="date", initialize date picker widget:
        jQuery(function ($) { //on document.ready
            $('#start_date').datepicker({
                dateFormat: 'yy-mm-dd',
                minDate: 0,
                onSelect: function (date) {
                    var date2 = $('#start_date').datepicker('getDate');
                    $("input[name='something']").val(date2);
                    date2.setDate(date2.getDate() + 1);
                    $('#end_date').datepicker('setDate', date2);
                    //sets minDate to start_date date + 1
                    $('#end_date').datepicker('option', 'minDate', date2);

                }
            });
            $('#end_date').datepicker({
                dateFormat: 'yy-mm-dd',
                onClose: function () {
                    var start_date = $('#start_date').datepicker('getDate');
                    console.log(start_date);
                    var end_date = $('#end_date').datepicker('getDate');
                    if (end_date <= start_date) {
                        var minDate = $('#end_date').datepicker('option', 'minDate');
                        $('#end_date').datepicker('setDate', minDate);
                    }
                }
            });

        });
    }



</script>

操作结果

public ActionResult Booking(string DepartureDate, string ReturnDate){}

当按下搜索按钮时，操作结果为空值。我想知道这段代码有什么问题？

【问题讨论】：

你在 url 中看到日期了吗？
不，我不能在那一点上调试。网址正在工作。按搜索操作结果后获得空值。但我从页面中删除了 JQueryUI，它的工作原理。
我认为问题是 JQueryUI。这有什么问题？
你的网址是这样的吗？ home/Booking?DepartureDate=17-09-09 &ReturnDate=17-09-09
没有。就像home/Booking?DepartureDate=2017-06-24T18:30:00.000Z&ReturnDate=2017-06-24T18:30:00.000Z

标签： jquery angularjs asp.net-mvc jquery-ui-datepicker

【解决方案1】：

由于日期选择器“yy-mm-dd”中给出的日期格式，日期没有正确附加到 URL 中，因为它还附加了时间。尝试在 javascript 中手动转换并发布它以用于测试目的，以了解问题是否在 JqueryUi 日期选择器中。

【讨论】：