问题描述
我一直在研究 MVC 购物车,试图将数据从视图页面存储到数据库。但是保存按钮没有像我希望的那样工作,它返回错误警报而不是成功警报。
这是视图模型
public class Itemviewmodel
{
public Guid ItemId { get; set; }
public int CategoryId { get; set; }
public string ItemCode { get; set; }
public string ItemName { get; set; }
public string Description { get; set; }
public decimal ItemPrice { get; set; }
public HttpPostedFile ImagePath { get; set; }
public IEnumerable CategorySelectListItem { get; set; }
}
这是控制器
private ECartDBEntities objECartDbEntities; public ItemController() { objECartDbEntities = new ECartDBEntities(); } // GET: Item public ActionResult Index() { Itemviewmodel objItemviewmodel = new Itemviewmodel(); objItemviewmodel.CategorySelectListItem = (from objCat in objECartDbEntities.Categories select new SelectListItem() { Text = objCat.CategoryName,Value = objCat.CategoryId.ToString(),Selected = true }); return View(objItemviewmodel); } [HttpPost] public JsonResult Index(Itemviewmodel objItemviewmodel) { string NewImage = Guid.NewGuid() + Path.GetExtension(objItemviewmodel.ImagePath.FileName); objItemviewmodel.ImagePath.SaveAs(filename: Server.MapPath("~/Images/" + NewImage)); Item objItem = new Item(); objItem.ImagePath = "~/Images/" + NewImage; objItem.CategoryId = objItemviewmodel.CategoryId; objItem.Description = objItemviewmodel.Description; objItem.ItemCode = objItemviewmodel.ItemCode; objItem.ItemId = Guid.NewGuid(); objItem.ItemName = objItemviewmodel.ItemName; objItem.ItemPrice = objItemviewmodel.ItemPrice; objECartDbEntities.Items.Add(objItem); objECartDbEntities.SaveChanges(); return Json(data: new { Success = true,Message = "Item is added successfully." },JsonRequestBehavior.AllowGet); }
private ECartDBEntities objECartDbEntities; public ItemController() { objECartDbEntities = new ECartDBEntities(); } // GET: Item public ActionResult Index() { Itemviewmodel objItemviewmodel = new Itemviewmodel(); objItemviewmodel.CategorySelectListItem = (from objCat in objECartDbEntities.Categories select new SelectListItem() { Text = objCat.CategoryName,JsonRequestBehavior.AllowGet); }
这是查看页面
$(document).ready(function () { $("#btnSave").click(function () { SaveItem(); }); }); function ResetItem() { $("#CategoryId").val(""); $("#ItemCode").val(""); $("#ItemName").val(""); $("#Description").val(""); $("#ItemPrice").val(""); $("#ImagePath").val(""); } function SaveItem() { var formData = new FormData; formData.append("CategoryId",$("#CategoryId").val()); formData.append("ItemCode",$("#ItemCode").val()); formData.append("ItemName",$("#ItemName").val()); formData.append("Description",$("#Description").val()); formData.append("ItemPrice",$("#ItemPrice").val()); formData.append("ImagePath",$("#ImagePath").get(0).files[0]); $.ajax({ async: true,dataType: 'JSON',type: 'POST',contentType: false,processData: false,url: '/Item/Index',data: formData,success: function (data) { if (data.Success) { alert(data.Message); ResetItem(); } },error: function () { alert("There is a problem with adding item."); } }); }
<div> <div class="col-md-4"> <div class="form-group"> Category : @Html.DropDownListFor(model => model.CategoryId,new SelectList(Model.CategorySelectListItem,dataValueField: "Value",dataTextField:"Text"),htmlAttributes: new { @class = "form-control"}) </div> </div> <div class="col-md-4"> <div class="form-group"> Item Code : @Html.TextBoxFor(model => model.ItemCode,htmlAttributes: new { @class = "form-control",autocomplete = "Off"}) </div> </div> <div class="col-md-4"> <div class="form-group"> Item Name : @Html.TextBoxFor(model => model.ItemName,autocomplete = "Off" }) </div> </div> <div class="col-md-4"> <div class="form-group"> Description : @Html.TextBoxFor(model => model.Description,autocomplete = "Off" }) </div> </div> <div class="col-md-4"> <div class="form-group"> Item Price : @Html.TextBoxFor(model => model.ItemPrice,autocomplete = "Off" }) </div> </div> <div class="col-md-4"> <div class="form-group"> Image : @Html.TextBoxFor(model => model.ImagePath,htmlAttributes: new { type = "file",@class = "form-control" }) </div> </div> <div> <input type="button" value="Save" name="save" class="btn btn-primary" id="btnSave"/> <input type="button" value="Reset" name="reset" class="btn btn-danger" /> </div> </div>
当我点击保存按钮时,它应该返回成功警报消息“项目添加成功”,但我一直收到的只是错误警报“添加项目有问题” .
解决方法
请检查以下步骤:
-
为您的表单提供 id (.cshtml)。
@using (Html.BeginForm("ActionName","ControllerName",FormMethod.Post,new { @id = "formId",@enctype = "multipart/form-data" }))
{
//enctype is given above as you have mentioned about Image files //Your UI elements here
}
- Ajax 请求
//下面试试:
var formData = new FormData($('#formId').get(0));
现在通过调试检查数据是否传递给控制器方法的对象(objItemViewModel)。