Jquery $.AJAX.post（）不工作-服务器响应状态为404（未找到）？

我正在开发MVC5应用程序的视图。这是一个具有多个属性的

Edit

视图，其中几个属性与其他模型相关。我有我的主要

INV_资产

模型，然后还有几个其他表，用于

位置、制造商、型号、状态、类型、供应商

等。在这个

编辑

视图中，我将这些特定属性显示为下拉列表，其中包含这些表中当前的所有值，以及每个列表旁边的[CREATE NEW]按钮

当用户选择[CREATE NEW]按钮时，会出现一个隐藏表单，允许用户为特定表格/下拉列表输入新值。我已经让所有的东西都工作了，除了我在表中添加值并刷新下拉列表的帖子

下面是我为第一个下拉列表（型号选择）ModelPOST所做的准备工作：

库存资产.编辑视图：

<div class="form-group">
        <span class="control-label col-md-2">Manufacturer:</span>
        <div class="col-md-4">
            @Html.DropDownListFor(model => model.Manufacturer_Id, (SelectList)ViewBag.Model_List, htmlAttributes: new { @class = "form-control dropdown" })
            @Html.ValidationMessageFor(model => model.Manufacturer_Id, "", new { @class = "text-danger" })
        </div>
        <div class="col-md-1">
            <div class="btn-group">
                <button type="button" class="btn btn-success" aria-expanded="false">CREATE NEW</button>
            </div>
        </div>
    </div>

<script type="text/javascript">

        $(document).ready(function () {
            // Show() form to enter new Model.
            $('#createNewModel').click(function () {
                $('#createModelFormContainer').show();
            })

            // Submit new Model value and refresh dropdown
            $('#submitNewModel').click(function () {
                alert("New Function!"); // WORKING

                var form = $(this).closest('form');
                var url = form.attr('action');
                var data = { Text: form.find('input').first().val() };

                alert("Prior to Post"); // WORKING

                $.post(url, form.serialize(), function (data) {

                    alert("Begin POST!"); // NOT BEING REACHED!

                    $('#selectModel').append($('<option></option>').val(data.ID).text(data.Text));
                    form[0].reset();
                    $('#createModelFormContainer').hide();
                })
            });
        });
</script>

            <div id="createModelFormContainer" style="display:none">
                <form action="/createNewModel">
                    <input type="text" name="model_description" />
                    <input type="button" id="submitNewModel" value="Submit" />
                </form>
            </div>

        $('#submitNewModel').click(function () {

            var form = $(this).closest('form');

            var test = form.find('input').first().val();
            alert(test);

            var data = { model_description: form.find('input').first().val() };
            alert(data.model_description);

            //var data = { model_description: $("input[name = 'model_description']").text.toString() };

            var jsonData = JSON.stringify(data);
            alert(jsonData.valueOf());

            $.ajax({
                type: "POST",
                dataType: "JSON",
                url: '@Url.Action("createNewModel", "INV_Assets")',
                data: jsonData,
                success: function (resp) {
                    alert("SUCCESS!");
                },
                error: function () {
                    alert("ERROR!");
                }
            });

假设这与我的路由有关，这是我当前的

RouteConfig.cs

：

public static void RegisterRoutes(RouteCollection routes)
    {
        routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

        routes.MapRoute(
            name: "Default",
            url: "{controller}/{action}/{id}",
            defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
        );
    }

有谁比我更专业，能看出我做错了什么

---

编辑：

<div class="form-group">
        <span class="control-label col-md-2">Manufacturer:</span>
        <div class="col-md-4">
            @Html.DropDownListFor(model => model.Manufacturer_Id, (SelectList)ViewBag.Model_List, htmlAttributes: new { @class = "form-control dropdown" })
            @Html.ValidationMessageFor(model => model.Manufacturer_Id, "", new { @class = "text-danger" })
        </div>
        <div class="col-md-1">
            <div class="btn-group">
                <button type="button" class="btn btn-success" aria-expanded="false">CREATE NEW</button>
            </div>
        </div>
    </div>

<script type="text/javascript">

        $(document).ready(function () {
            // Show() form to enter new Model.
            $('#createNewModel').click(function () {
                $('#createModelFormContainer').show();
            })

            // Submit new Model value and refresh dropdown
            $('#submitNewModel').click(function () {
                alert("New Function!"); // WORKING

                var form = $(this).closest('form');
                var url = form.attr('action');
                var data = { Text: form.find('input').first().val() };

                alert("Prior to Post"); // WORKING

                $.post(url, form.serialize(), function (data) {

                    alert("Begin POST!"); // NOT BEING REACHED!

                    $('#selectModel').append($('<option></option>').val(data.ID).text(data.Text));
                    form[0].reset();
                    $('#createModelFormContainer').hide();
                })
            });
        });
</script>

            <div id="createModelFormContainer" style="display:none">
                <form action="/createNewModel">
                    <input type="text" name="model_description" />
                    <input type="button" id="submitNewModel" value="Submit" />
                </form>
            </div>

        $('#submitNewModel').click(function () {

            var form = $(this).closest('form');

            var test = form.find('input').first().val();
            alert(test);

            var data = { model_description: form.find('input').first().val() };
            alert(data.model_description);

            //var data = { model_description: $("input[name = 'model_description']").text.toString() };

            var jsonData = JSON.stringify(data);
            alert(jsonData.valueOf());

            $.ajax({
                type: "POST",
                dataType: "JSON",
                url: '@Url.Action("createNewModel", "INV_Assets")',
                data: jsonData,
                success: function (resp) {
                    alert("SUCCESS!");
                },
                error: function () {
                    alert("ERROR!");
                }
            });

根据wahwahwah的建议，我对我的脚本进行了以下修改：

        $('#createNewModel').click(function () {
            $('#createModelFormContainer').show();
        })

        $('#submitNewModel').click(function () {
            var form = $(this).closest('form');
            var data = { Text: form.find('input').first().val() };
            $.ajax({
                type: "POST",
                dataType: "JSON",
                url: '@Url.Action("createNewModel", "INV_Assets")',
                data: data,
                success: function (resp) {
                    alert("SUCCESS!");
                },
                error: function () {
                    alert("ERROR!");
                }
            });

按照此路线，我的

createNewModel（）

操作在控制器中正确调用，但在

db.savechangessync（）

处失败：

错误如下：

An exception of type 'System.Data.Entity.Validation.DbEntityValidationException' occurred in EntityFramework.dll but was not handled in user code

Additional information: Validation failed for one or more entities. See 'EntityValidationErrors' property for more details.

---

EDIT2：

<div class="form-group">
        <span class="control-label col-md-2">Manufacturer:</span>
        <div class="col-md-4">
            @Html.DropDownListFor(model => model.Manufacturer_Id, (SelectList)ViewBag.Model_List, htmlAttributes: new { @class = "form-control dropdown" })
            @Html.ValidationMessageFor(model => model.Manufacturer_Id, "", new { @class = "text-danger" })
        </div>
        <div class="col-md-1">
            <div class="btn-group">
                <button type="button" class="btn btn-success" aria-expanded="false">CREATE NEW</button>
            </div>
        </div>
    </div>

<script type="text/javascript">

        $(document).ready(function () {
            // Show() form to enter new Model.
            $('#createNewModel').click(function () {
                $('#createModelFormContainer').show();
            })

            // Submit new Model value and refresh dropdown
            $('#submitNewModel').click(function () {
                alert("New Function!"); // WORKING

                var form = $(this).closest('form');
                var url = form.attr('action');
                var data = { Text: form.find('input').first().val() };

                alert("Prior to Post"); // WORKING

                $.post(url, form.serialize(), function (data) {

                    alert("Begin POST!"); // NOT BEING REACHED!

                    $('#selectModel').append($('<option></option>').val(data.ID).text(data.Text));
                    form[0].reset();
                    $('#createModelFormContainer').hide();
                })
            });
        });
</script>

            <div id="createModelFormContainer" style="display:none">
                <form action="/createNewModel">
                    <input type="text" name="model_description" />
                    <input type="button" id="submitNewModel" value="Submit" />
                </form>
            </div>

        $('#submitNewModel').click(function () {

            var form = $(this).closest('form');

            var test = form.find('input').first().val();
            alert(test);

            var data = { model_description: form.find('input').first().val() };
            alert(data.model_description);

            //var data = { model_description: $("input[name = 'model_description']").text.toString() };

            var jsonData = JSON.stringify(data);
            alert(jsonData.valueOf());

            $.ajax({
                type: "POST",
                dataType: "JSON",
                url: '@Url.Action("createNewModel", "INV_Assets")',
                data: jsonData,
                success: function (resp) {
                    alert("SUCCESS!");
                },
                error: function () {
                    alert("ERROR!");
                }
            });

将我的故障代码修改为try/catch，然后在ex上设置一个

Watch

：

    [HttpPost]
    public JsonResult createNewModel(INV_Models model)
    {

            model.created_date = DateTime.Now;
            model.created_by = System.Environment.UserName;
            model.modified_date = DateTime.Now;
            model.modified_by = System.Environment.UserName;

            // Set ID
            int lastModelId = db.INV_Models.Max(mdl => mdl.Id);
            model.Id = lastModelId+1;

            if (ModelState.IsValid == false && model.Id > 0)
            {
                ModelState.Clear();
            }

            if (ModelState.IsValid)
            {
                try
                {
                    db.INV_Models.Add(model);
                    db.SaveChangesAsync();}
                catch (Exception ex)
                {
                    Elmah.ErrorSignal.FromCurrentContext().Raise(ex);
                }
            }

            return Json(new { ID = model.Id, Text = model.model_description });  
    }

ex

详细信息：

显然，我为新模型输入的

说明

没有包含在正在保存的新

模型

中

---

EDIT3：

<div class="form-group">
        <span class="control-label col-md-2">Manufacturer:</span>
        <div class="col-md-4">
            @Html.DropDownListFor(model => model.Manufacturer_Id, (SelectList)ViewBag.Model_List, htmlAttributes: new { @class = "form-control dropdown" })
            @Html.ValidationMessageFor(model => model.Manufacturer_Id, "", new { @class = "text-danger" })
        </div>
        <div class="col-md-1">
            <div class="btn-group">
                <button type="button" class="btn btn-success" aria-expanded="false">CREATE NEW</button>
            </div>
        </div>
    </div>

<script type="text/javascript">

        $(document).ready(function () {
            // Show() form to enter new Model.
            $('#createNewModel').click(function () {
                $('#createModelFormContainer').show();
            })

            // Submit new Model value and refresh dropdown
            $('#submitNewModel').click(function () {
                alert("New Function!"); // WORKING

                var form = $(this).closest('form');
                var url = form.attr('action');
                var data = { Text: form.find('input').first().val() };

                alert("Prior to Post"); // WORKING

                $.post(url, form.serialize(), function (data) {

                    alert("Begin POST!"); // NOT BEING REACHED!

                    $('#selectModel').append($('<option></option>').val(data.ID).text(data.Text));
                    form[0].reset();
                    $('#createModelFormContainer').hide();
                })
            });
        });
</script>

            <div id="createModelFormContainer" style="display:none">
                <form action="/createNewModel">
                    <input type="text" name="model_description" />
                    <input type="button" id="submitNewModel" value="Submit" />
                </form>
            </div>

        $('#submitNewModel').click(function () {

            var form = $(this).closest('form');

            var test = form.find('input').first().val();
            alert(test);

            var data = { model_description: form.find('input').first().val() };
            alert(data.model_description);

            //var data = { model_description: $("input[name = 'model_description']").text.toString() };

            var jsonData = JSON.stringify(data);
            alert(jsonData.valueOf());

            $.ajax({
                type: "POST",
                dataType: "JSON",
                url: '@Url.Action("createNewModel", "INV_Assets")',
                data: jsonData,
                success: function (resp) {
                    alert("SUCCESS!");
                },
                error: function () {
                    alert("ERROR!");
                }
            });

下面是我当前的脚本/控制器操作代码。当我在控制器内部中断并将

？model.model_description

键入

立即窗口

，它将返回

null

关于我的以下警报，我的

中的值似乎没有正确存储在变量中供JSON使用，因此没有传递给控制器

• 警报（测试）

  ：

  s2efxrd3nxdwoiies5ebi4e\u Fz3wrqCwP44hhQ7kj\u fol3qknv26obgqoqohc-8bv8hkc6xdea7ucbnhopkl3awiko99p-j\u 887qQgOXRPg1

• 警报（数据.模型描述）

  ：

  s2efxrd3nxdwies5ebi4e\u Fz3wrqCwP44hhQ7kj\u文件夹3qknv26obgqoqhc-8bv8hkc6xdea7ucbnhofpkl3awiko99p-j\u 887qQgOXRPg1

• alert（jasonData.valueOf（））

  ：

  {“型号说明”：“S2EFXrd3nXdWOIES5eBi4e\u Fz3wrqCwP44hhQ7kj\u文件夹3QKNV26OBGQOQHC-8BV8HKC6xdDEa7uCBnhOFPKL3AwIko99p-j\u 887QGOXRPG1”

输入表单：

<div class="form-group">
        <span class="control-label col-md-2">Manufacturer:</span>
        <div class="col-md-4">
            @Html.DropDownListFor(model => model.Manufacturer_Id, (SelectList)ViewBag.Model_List, htmlAttributes: new { @class = "form-control dropdown" })
            @Html.ValidationMessageFor(model => model.Manufacturer_Id, "", new { @class = "text-danger" })
        </div>
        <div class="col-md-1">
            <div class="btn-group">
                <button type="button" class="btn btn-success" aria-expanded="false">CREATE NEW</button>
            </div>
        </div>
    </div>

<script type="text/javascript">

        $(document).ready(function () {
            // Show() form to enter new Model.
            $('#createNewModel').click(function () {
                $('#createModelFormContainer').show();
            })

            // Submit new Model value and refresh dropdown
            $('#submitNewModel').click(function () {
                alert("New Function!"); // WORKING

                var form = $(this).closest('form');
                var url = form.attr('action');
                var data = { Text: form.find('input').first().val() };

                alert("Prior to Post"); // WORKING

                $.post(url, form.serialize(), function (data) {

                    alert("Begin POST!"); // NOT BEING REACHED!

                    $('#selectModel').append($('<option></option>').val(data.ID).text(data.Text));
                    form[0].reset();
                    $('#createModelFormContainer').hide();
                })
            });
        });
</script>

            <div id="createModelFormContainer" style="display:none">
                <form action="/createNewModel">
                    <input type="text" name="model_description" />
                    <input type="button" id="submitNewModel" value="Submit" />
                </form>
            </div>

        $('#submitNewModel').click(function () {

            var form = $(this).closest('form');

            var test = form.find('input').first().val();
            alert(test);

            var data = { model_description: form.find('input').first().val() };
            alert(data.model_description);

            //var data = { model_description: $("input[name = 'model_description']").text.toString() };

            var jsonData = JSON.stringify(data);
            alert(jsonData.valueOf());

            $.ajax({
                type: "POST",
                dataType: "JSON",
                url: '@Url.Action("createNewModel", "INV_Assets")',
                data: jsonData,
                success: function (resp) {
                    alert("SUCCESS!");
                },
                error: function () {
                    alert("ERROR!");
                }
            });

---

以下几点可能有助于您对视图/jQuery进行故障排除：

确保您确实发布了JSON

调用'form.find（'input'）.first（）.val（）时正在检索值

您正在发布到一个准确的URL

您发布的JSON对象与控制器中的模型具有相同的属性命名约定

下面是一个例子（不符合顺序）：

关于您的

SaveChanges（）

问题，当类型不匹配时通常会引发此错误-或者如果需要

null

数据-您可能希望在

try catch

中包装db调用，然后读取/处理错误：

try 
{
   db.INV_Models.Add(model);
   db.SaveChangesAsync();
}
catch (Exception Ex)
{
   // toggle breakpoint --> read error --> do something else? 
   // throw http error --> catch in ajax error callback?
}

---

您是否检查了端口4545上运行的任何东西是否实际具有

/INV\u assets

url？由于这是一个http请求，您应该能够直接在浏览器中找到完全相同的url，并查看发生了什么。当我直接粘贴url时，我得到了

404-在控制器“InventoryTracker.Controllers.INV_assetsconner”上找不到公共操作方法“Index”。

这是真的，我没有

索引（）

我的

库存资产控制器中的方法

。在我的

post（）？挖掘之后，我的默认路由可能会强制它查找索引，因为它似乎找不到我的
createNewModel（）
操作….？感谢回复
wahwah
。使用您的示例，我能够取得进展，但我的控制器操作在将更改保存到DB时失败？@AnalyticLunatic-我更新了我的答案，以包括EF SaveChanges（）问题。我在上面发布了一个EDIT2。似乎在保存操作尝试执行时，没有传入/设置我的新
模型
描述？@AnalyticLunatic-可能是您的控制器操作正在启动，但您没有在
模型中传递任何数据。
您必须在JSON和模型对象之间使用完全相同的属性命名约定，否则它不会绑定。。。将
var data={Text:…
更改为
var data={model_description:…
，并确保
form.find（'input'）.first（）.val（）
返回一个值；以下
var data={model_description:form.find（'input'）.first（）.val（）}；
返回
警报（数据）；
返回
[对象]
？