使用 ajax 调用将日期时间值从视图传递到控制器
passing datetime value from the view to controller using ajax call
我正在使用 timepicki(jquery 时间选择器之一)将视图中的 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
}
您刚刚在 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);
}
});
我正在使用 timepicki(jquery 时间选择器之一)将视图中的 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
}
您刚刚在 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);
}
});