- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
此问题与 this 不重复。因为所有细节都在这个问题中得到了充分的描述,非常适合初学者
我有一个继承自模型的 View 。我的字段位于表单中,我想使用 JQuery/Ajax 将表单(或模型)发布到 Controller 并将其插入数据库中。我读过this文章,可以使用 ajax 上传图像,但我无法将带有数据的整个表单或模型发布到 Controller 。
我的观点:
@model ajax1.Models.Info
<form method="post" enctype="multipart/form-data">
<div class="form-group">
<label asp-for="FirstName" class="col-lg-2 col-sm-2 control-label "></label>
<div class="col-lg-6">
<input asp-for="FirstName" class="form-control" />
<span asp-validation-for="FirstName"></span>
</div>
</div>
<div class="form-group">
<label asp-for="LastName" class="col-lg-2 col-sm-2 control-label"></label>
<div class="col-lg-6">
<input asp-for="LastName" class="form-control" />
<span asp-validation-for="LastName"></span>
</div>
</div>
<input type="file" id="files" name="files" multiple />
<input type="button" id="upload" value="Upload Selected Files" />
</form>
View 底部的 JQuery 代码:
@section Scripts{
<script>
$("#upload").click(function (evt) {
var fileupload = $("#files").get(0);
var files = fileupload.files;
var data = new formdata();
for (var i = 0; i < files.length; i++) {
data.append(files[i].name, files[i]);
}
$.ajax({
type: "post",
url: "/home/uploadfilesajax",
contenttype: false,
processdata: false,
data: data,
success: function (message) {
alert(message);
},
error: function () {
alert("there was error uploading files!");
}
});
});
</script>
}
Controller :
[HttpPost]
public async Task<IActionResult> UploadFilesAjax(Info model)
{
var files = HttpContext.Request.Form.Files;
foreach (var Image in files)
{
if (Image != null && Image.Length > 0)
{
var file = Image;
var uploads = Path.Combine(_appEnvironment.WebRootPath, "img\\");
if (file.Length > 0)
{
var fileName = Guid.NewGuid().ToString().Replace("-", "") + Path.GetExtension(file.FileName);
using (var fileStream = new FileStream(Path.Combine(uploads, fileName), FileMode.Create))
{
await file.CopyToAsync(fileStream);
model.imgName = fileName;
}
}
}
}
using (var db = _iServiceProvider.GetRequiredService<ApplicationDbContext>())
{
db.Info.Add(model);
db.SaveChanges();
}
string message = "success";
return Json(message);
}
型号:
public class Info
{
[DisplayName("First Name")]
[Required(ErrorMessage = "Enter First Name")]
public string FirstName { get; set; }
[DisplayName("Last Name")]
[Required(ErrorMessage = "Enter Last Name")]
public string LastName { get; set; }
[DisplayName("select image")]
public string imgName { get; set; }
}
当我在操作上设置断点并单击提交按钮时,应用程序不会执行操作。我如何将所有表格或模型发布到 Controller ?我希望如果“ModelStates.IsValid == false”显示验证错误。
最佳答案
您的客户端代码中几乎没有问题。
您使用的 contenttype
、contenttype
和 formdata
大小写不正确。请记住 JavaScript 区分大小写。
您当前的代码仅将图像添加到 FormData 对象。您可以循环遍历输入元素并添加它。
这应该有效。
$(function () {
$("#upload").click(function (evt) {
evt.preventDefault();
var fileupload = $("#files").get(0);
var files = fileupload.files;
var data = new FormData();
for (var i = 0; i < files.length; i++) {
data.append(files[i].name, files[i]);
}
// You can update the jquery selector to use a css class if you want
$("input[type='text'").each(function (x, y) {
data.append($(y).attr("name"), $(y).val());
});
$.ajax({
type: "post",
url: "/home/uploadfilesajax",
contentType: false,
processData: false,
data: data,
success: function (message) {
alert(message);
},
error: function () {
alert("there was error uploading files!");
}
});
});
});
您仍然可以使用模型验证框架来检查 View 模型的属性级别验证。由于您正在进行 ajax 调用,因此需要将 JSON 响应中的验证错误发送回客户端,以便客户端将其显示给用户。
[HttpPost]
public async Task<IActionResult> UploadFilesAjax(Info model, IEnumerable<IFormFile> files)
{
if (ModelState.IsValid)
{
var uploads = Path.Combine(hostingEnvironment.WebRootPath, "images");
foreach (var file in files)
{
if (file != null && file.Length > 0)
{
var fileName = Guid.NewGuid().ToString().Replace("-", "") +
Path.GetExtension(file.FileName);
using (var s = new FileStream(Path.Combine(uploads, fileName),
FileMode.Create))
{
await file.CopyToAsync(s);
model.imgName = fileName;
}
}
}
return Json(new { status = "success", message = "success" });
}
else
{
var list = new List<string>();
foreach (var modelStateVal in ViewData.ModelState.Values)
{
list.AddRange(modelStateVal.Errors.Select(error => error.ErrorMessage));
}
return Json(new { status = "error", errors = list });
}
}
现在在客户端代码中,读取响应的状态属性,如果有错误,则循环访问错误属性并将其显示给用户。在下面的示例中,我只是向用户发出错误警报,但您可以更改它以将其显示在页面的某些部分。
$(function () {
$("#upload").click(function (evt) {
evt.preventDefault();
var fileupload = $("#files").get(0);
var files = fileupload.files;
var data = new FormData();
for (var i = 0; i < files.length; i++) {
data.append('files', files[i]);
}
// You can update the jquery selector to use a css class if you want
$("input[type='text'").each(function (x, y) {
data.append($(y).attr("name"), $(y).val());
});
$.ajax({
type: "post",
url: "/home/uploadfilesajax",
contentType: false,
processData: false,
data: data
}).done(function(res) {
if (res.status === "success") {
alert(res.message);
} else {
$.each(res.errors,function(a, b) {
alert(b);
});
}
}).fail(function(xhr, b, error) {
alert(error);
});
});
});
关于jquery - Asp.net Core,如何在 JQuery/Ajax 中将文件和模型发布到 Controller ?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47233009/
可不可以命名为MVVM模型?因为View通过查看模型数据。 View 是否应该只与 ViewModelData 交互?我确实在某处读到正确的 MVVM 模型应该在 ViewModel 而不是 Mode
我正在阅读有关设计模式的文章,虽然作者们都认为观察者模式很酷,但在设计方面,每个人都在谈论 MVC。 我有点困惑,MVC 图不是循环的,代码流具有闭合拓扑不是很自然吗?为什么没有人谈论这种模式: mo
我正在开发一个 Sticky Notes 项目并在 WPF 中做 UI,显然将 MVVM 作为我的架构设计选择。我正在重新考虑我的模型、 View 和 View 模型应该是什么。 我有一个名为 Not
不要混淆:How can I convert List to Hashtable in C#? 我有一个模型列表,我想将它们组织成一个哈希表,以枚举作为键,模型列表(具有枚举的值)作为值。 publi
我只是花了一些时间阅读这些术语(我不经常使用它们,因为我们没有任何 MVC 应用程序,我通常只说“模型”),但我觉得根据上下文,这些意味着不同的东西: 实体 这很简单,它是数据库中的一行: 2) In
我想知道你们中是否有人知道一些很好的教程来解释大型应用程序的 MVVM。我发现关于 MVVM 的每个教程都只是基础知识解释(如何实现模型、 View 模型和 View ),但我对在应用程序页面之间传递
我想realm.delete() 我的 Realm 中除了一个模型之外的所有模型。有什么办法可以不列出所有这些吗? 也许是一种遍历 Realm 中当前存在的所有类型的方法? 最佳答案 您可以从您的 R
我正在尝试使用 alias 指令模拟一个 Eloquent 模型,如下所示: $transporter = \Mockery::mock('alias:' . Transporter::class)
我正在使用 stargazer 创建我的 plm 汇总表。 library(plm) library(pglm) data("Unions", package = "pglm") anb1 <- pl
我读了几篇与 ASP.NET 分层架构相关的文章和问题,但是读得太多后我有点困惑。 UI 层是在 ASP.NET MVC 中开发的,对于数据访问,我在项目中使用 EF。 我想通过一个例子来描述我的问题
我收到此消息错误: Inceptionv3.mlmodel: unable to read document 我下载了最新版本的 xcode。 9.4 版测试版 (9Q1004a) 最佳答案 您没有
(同样,一个 MVC 验证问题。我知道,我知道......) 我想使用 AutoMapper ( http://automapper.codeplex.com/ ) 来验证我的创建 View 中不在我
需要澄清一件事,现在我正在处理一个流程,其中我有两个 View 模型,一个依赖于另一个 View 模型,为了处理这件事,我尝试在我的基本 Activity 中注入(inject)两个 View 模型,
如果 WPF MVVM 应该没有代码,为什么在使用 ICommand 时,是否需要在 Window.xaml.cs 代码中实例化 DataContext 属性?我已经并排观看并关注了 YouTube
当我第一次听说 ASP.NET MVC 时,我认为这意味着应用程序由三个部分组成:模型、 View 和 Controller 。 然后我读到 NerdDinner并学习了存储库和 View 模型的方法
Platform : ubuntu 16.04 Python version: 3.5.2 mmdnn version : 0.2.5 Source framework with version :
我正在学习本教程:https://www.raywenderlich.com/160728/object-oriented-programming-swift ...并尝试对代码进行一些个人调整,看看
我正试图围绕 AngularJS。我很喜欢它,但一个核心概念似乎在逃避我——模型在哪里? 例如,如果我有一个显示多个交易列表的应用程序。一个列表向服务器查询匹配某些条件的分页事务集,另一个列表使用不同
我在为某个应用程序找出最佳方法时遇到了麻烦。我不太习惯取代旧 TLA(三层架构)的新架构,所以这就是我的来源。 在为我的应用程序(POCO 类,对吧??)设计模型和 DAL 时,我有以下疑问: 我的模
我有两个模型:Person 和 Department。每个人可以在一个部门工作。部门可以由多人管理。我不确定如何在 Django 模型中构建这种关系。 这是我不成功的尝试之一 [models.py]:
我是一名优秀的程序员,十分优秀!