enter image description here我想在控制器上发布几张彼此相关的照片和文本。我该怎么办?我的表单是“编辑表单”,我分别存储了所有图片和税款。但是现在在“编辑表单”中,我必须将它们一起发送到控制器。
EditTempleViewModel
public class EditTempleViewModel
{
public string Date { get; set; }
public string Title { get; set; }
public string KeyWord { get; set; }
public int Pattern { get; set; }
public int Category { get; set; }
}
SectionViewModel
public class SectionViewModel
{
public int Id { get; set; }
public int PostId { get; set; }
public string Title { get; set; }
public List<string> Text { get; set; }
public IFormFileCollection Image { get; set; }
public string Pic { get; set; }
}
表格
@using Blogger.Models.BlogViewModels
@model EditTempleViewModel
<form id="editForm" enctype="multipart/form-data">
<div class="form-group">
<input asp-for="Title" type="text" class="form-control formClass" id="Title" placeholder="">
</div>
<div class="form-group">
<select asp-for="Category" asp-items="@ViewBag.Category" class="form-control formClass" id="Category">
<option value="" disabled selected>Select group</option>
</select>
</div>
<div class="form-group">
<label asp-for="Pattern"></label>
<select asp-for="Pattern" asp-items="@ViewBag.Pattern" class="form-control formClass ">
<option value="" disabled selected>select</option>
</select>
</div>
<div class="form-group div-textarea" id="inputTextarea">
<label asp-for="KeyWord"></label>
<textarea asp-for="KeyWord" class="form-control formClass" id="KeyWord" rows="1"></textarea>
</div>
<div id="c">
@foreach (var item in Model.sections)
{
<div class="form-group div-textarea" id="inputTextarea">
<label asp-for="@item.Text"></label>
<textarea name="Text" class="form-control formClass txtaraeClass" rows="3">@item.Text</textarea>
</div>
<div class="form-group div-img" id="inputImg">
<div class="custom-file">
<label class="custom-file-label" for="Image">Upload</label>
<input name="Image" type="file" class="custom-file-input formClass fileU" id="Image" multiple>
</div>
</div>
}
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary btnEdit">submit</button>
</div>
</form>
脚本
$(".btnEdit").click(function (evt) {
evt.preventDefault();
var fileupload = $(".fileU").get();
var files = fileupload;
let myfiles = []
for (var i = 0; i < files.length; i++) {
myfiles.push(files[i]);
}
var data = new FormData();
data.append("Title", $('#Title').val());
data.append("Category", $('#Category').val());
data.append("Pattern", $('#Pattern').val());
data.append("KeyWord", $('#KeyWord').val());
data.append("files", myfiles)
let json =
{
"Title": $('#Title').val(),
"Category": $('#Category').val(),
"Pattern": $('#Pattern').val(),
"KeyWord": $('#KeyWord').val(),
files: data,
images: data
}
var frm = $('#editForm').serialize();
$.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!");
}
});
});
推车
[HttpPost]
public async Task<IActionResult> UploadFilesAjax(EditTemple model, IFormCollection files)
{
}
我在模型和文件中都有空数据