使用 ajax 调用将日期时间值从视图传递到控制器

Question

我正在使用 timepicki（jquery timepickers 之一）将视图中的 DateTime 值传递给控制器​​，尤其是 ActionResult Create 方法。我已经在 Sources 选项卡下使用 F12 在视图中用 javascript 编写的 ajax 调用进行了测试，实际上，该值已成功存储在函数内部的变量中，但似乎没有将其值传递给控制器​​。你们能帮我为什么它没有将其值传递给控制器​​吗？任何帮助表示赞赏。

查看：

@model test.Models.Employee

@using (Html.BeginForm())
{
@Html.AntiForgeryToken()

<div class="form-horizontal">
    <hr />
    @Html.ValidationSummary(true, "", new { @class = "text-danger" })

    <div class="form-group">
        @Html.LabelFor(model => model.MondayId, "Monday: ", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            Start: <input type="text" name="timepicker" class="time_element" id="monStart"/>                
        </div>
    </div>

    <div class="form-group">
        <div class="col-md-offset-2 col-md-10">
            <input type="submit" value="Create" class="btn btn-default" id="submit" onclick=""/>
        </div>
    </div>
</div>
}

@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
<script src="@Url.Content("~/Scripts/jquery.min.js")" type="text/javascript"></script>       
<script src="@Url.Content("~/Scripts/timepicki.js")" type="text/javascript"></script>       
<link href="@Url.Content("~/Content/timepicki.css")" rel="stylesheet" type="text/css" />

<script>
     $(document).ready(function(){
        $(".time_element").timepicki();
    });
</script>

<script type="text/javascript">
$("#submit").click(function () {

        var monStart = $('#monStart').val();          

        $.ajax({
            url: '@Url.Action("Create", "Employees")',
            data: { employee: null, monStart: monStart },
            type: 'POST',
            success: function (data) {
            },
            error: function (xhr, status, error) {
                alert(xhr.responseText);
            }
        })
    });
</script>
}

控制器：

    [HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult Create(Employee employee, DateTime? monStart)
    {
      //codes
    }

Answer 1

您只是在您的ajax 通话中错过了AntiForgeryToken。所以你的电话：

$.ajax({
        url: '@Url.Action("Create", "Employees")',
        data: { employee: null, monStart: monStart},
        type: 'POST',
        success: function (data) {
        },
        error: function (xhr, status, error) {
            alert(xhr.responseText);
        }
 });

应该是：

 var myToken = $('[name=__RequestVerificationToken]').val();

 $.ajax({
        url: '@Url.Action("Create", "Employees")',
        data: { employee: null, monStart: monStart, __RequestVerificationToken : myToken  },
        type: 'POST',
        success: function (data) {
        },
        error: function (xhr, status, error) {
            alert(xhr.responseText);
        }
  });