Question

我有一个关于使用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();
    }

我只是在动作开始时有一个断点来检查它是否到达动作但是没有结果..

Answer 1

您正在为您的操作设置HTTPPost属性，这意味着该操作只会映射到帖子请求。在您的ajax脚本中，您可以按类型Get定义，这意味着将使用get请求触发ajax请求。

删除该属性或更改请求的类型

使用Ajax从视图发送到控制器

1 个答案: