MVC - 通过 ajax 调用返回数据将其呈现为页面

Question

MVC 新手。

情景是。使用第三方上传图片库。提交表单时，我想通过 ajax 进行调用以提交数据并返回插入的项目 ID。然后，我将该 ID 用于第 3 方上传库来构建将图像上传到的文件夹。

我有 ajax 调用工作并将数据插入数据库并获取插入的 ID。但是当调试从控制器返回时，它会将 id 呈现为整个页面。

我认为这里缺少 MVC 的基本内容。

cshtml文件：

<div class="col-md-8">
              <input type="submit" value="Add Item" id="submitItem" />
              <script>
                $(document).ready(function () {
                  $("#submitItem").submit(function () {
                    event.preventDefault();

                    insertData();
                  });
                });

                function insertData()
                {
                  var requestData = {
                    userID: $("#hdnUserID").val(),
                    title: $("#title").val(),
                    typeID: $("#typeID").val(),
                    description: $("#description").val()
                  };

                  $.ajax({
                    url: '<%= Url.Action("ItemUserDashBoard", "Home") %>',
                    type: 'post',
                    data: JSON.stringify(requestData),
                    dataType: 'json',
                    success: function (data) {
                      // your data could be a View or Json or what ever you returned in your action method 
                      // parse your data here
                      alert(data);
                      $("#fine-uploader-gallery").fineUploader("uploadStoredFiles");
                    },
                    processData: false
                  });
                }
              </script>
            </div>

HomeController.cs

[HttpPost]
    public JsonResult ItemUserDashBoard(ItemAppraise.Models.iaDashBoardModel objItemUserDashBoard)
    {
      if(ModelState.IsValid)
      {
        using (dbContext)
        {
          ia_items iaItem = new ia_items
          {
            userID = objItemUserDashBoard.iaItems.userID,
            typeID = objItemUserDashBoard.iaItems.typeID,
            title = objItemUserDashBoard.iaItems.title,
            description = objItemUserDashBoard.iaItems.description,
            lastUpdate = DateTime.Now
          };

          dbContext.ia_items.Add(iaItem);
          dbContext.SaveChanges();

          //objItemUserDashBoard.iaItems.itemID = iaItem.itemID;
          return Json(iaItem.itemID.ToString());
        }
      }
      else{
        return null;
      }
    }

Fiddler 显示它具有 Content-Type: application/json; charset=utf-8.

但页面在控制 url 'http://localhost:55689/Home/ItemUserDashBoard' 下呈现，仅显示项目 ID。

如何取回数据以便在 ajax 调用的成功部分使用而不被渲染？这是部分视图还是类似的东西？

感谢任何指导。

Answer 1

在标准 MVC 中。对控制器的任何调用都像 Web 请求一样被处理。因此，如果我对您的理解正确 - 您的 httpPost 的结果正在呈现而不是所需的视图？这是因为您正在返回 JSON，因此控制器假定这是您要呈现的内容。如果您希望改为呈现视图（并以某种方式使用该响应数据），您可以尝试将返回类型设置为 ActionResult 并返回 View("nameofview"); 您可以将响应数据传递给 number of ways 中的该视图。

附带说明我认为使用 Web Api 而不是 MVC 可以更好地解决您面临的问题。它适用于 MVC，并且可能是实现所需功能的更简单方法。将您的发布请求和数据库交互与决定返回哪个视图的逻辑分开。