我有一个关于使用 ajax 将数据从视图发送到控制器的问题。
这是我的观点:
@model GDMfrontEnd.Models.DeliverableViewModel
@{
ViewBag.Title = "Create";
}
<div class="row">
<div class="large-12 columns">
<h2>Uploaden!</h2>
@using (Html.BeginForm("Create", "Deliverable", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
@Html.ValidationSummary(true)
<p><img src="~/Content/images/step1.png" />Selecteer jouw afbeeldingen</p>
<div class="editor-label">
@Html.LabelFor(model => model.Thumbnail)
</div>
<div class="editor-field">
@Html.TextBoxFor(model => model.Thumbnail, new { type = "file" })
@Html.ValidationMessageFor(model => model.Thumbnail)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Image)
</div>
<div class="editor-field">
@Html.TextBoxFor(model => model.Image, new { type = "file" })
@Html.ValidationMessageFor(model => model.Image)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.VideoUrl)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.VideoUrl)
@Html.ValidationMessageFor(model => model.VideoUrl)
</div>
<p><img src="~/Content/images/step2.png" />Informatie</p>
<div class="editor-label">
@Html.LabelFor(model => model.Title)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Title)
@Html.ValidationMessageFor(model => model.Title)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Projects)
</div>
<div class="editor-field">
@Html.DropDownListFor(model => model.ProjectID, new SelectList(ViewBag.Projects, "project_id", "project_name", Model.ProjectID))
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Description)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Description)
@Html.ValidationMessageFor(model => model.Description)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.TagName)
</div>
<div class="editor-field">
<input type="text" id="tags" />
</div>
<p>
<input id="submit" type="submit" value="Create" />
</p>
}
</div>
</div>
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
@Scripts.Render("~/bundles/jqueryui")
@Styles.Render("~/Content/themes/base/css")
<script type="text/javascript" language="javascript">
$(function () {
var object = {};
$.ajax({
type: "GET",
url: "/Deliverable/Tags",
dataType: "json",
success: function (data) {
object.tags = data;
}
});
function split(val) {
return val.split(/,\s*/);
}
function extractLast(term) {
return split(term).pop();
}
$("#tags")
// don't navigate away from the field on tab when selecting an item
.bind("keydown", function (event) {
if (event.keyCode === $.ui.keyCode.TAB &&
$(this).data("ui-autocomplete").menu.active) {
event.preventDefault();
}
})
.autocomplete({
minLength: 0,
source: function (request, response) {
// delegate back to autocomplete, but extract the last term
response($.ui.autocomplete.filter(
object.tags, extractLast(request.term)));
},
focus: function () {
// prevent value inserted on focus
return false;
},
select: function (event, ui) {
var terms = split(this.value);
// remove the current input
terms.pop();
// add the selected item
terms.push(ui.item.value);
// add placeholder to get the comma-and-space at the end
terms.push("");
this.value = terms.join(", ");
return false;
}
});
});
$("#submit").click(function () {
$.ajax({
type: "POST",
url: "/Deliverable/AddTags",
data: terms,
contentType: "application/json; charset=utf-8",
success: function () {
alert('success');
},
error: function () {
alert('failure');
}
});
});
</script>
}
我有一个 html 表单,底部有一个文本框,您可以在其中向文本框添加标签。(标签在数据库中定义)
问题是 ajax 没有做任何事情。他甚至没有进入我的行动方法。
谁能帮我这个?我想将数组项发送到我的控制器中的操作方法。
编辑:
我的行动:
[HttpPost]
public ActionResult AddTags(List<string> data)
{
return View();
}
我只是在动作开始时有一个断点来检查它是否到达动作但没有结果..