【发布时间】：2021-11-16 01:09:26
【问题描述】：
我有文件上传表单的级联下拉列表，我正在尝试创建相同的表单进行编辑，但表单应包含我以这种方式创建的当前值： 编辑获取操作：
[HttpGet]
public async Task<IActionResult> EditFile(int id,Genre genre)
{
var model = await context.Files.Where(x => x.Id == id).Include(a => a.Genre).Include(x => x.FileT).FirstOrDefaultAsync();
List<FileType> ftypelist = new List<FileType>();
ftypelist = (from FileTypes in context.FileTypes select FileTypes).ToList();
ftypelist.Insert(0, new FileType { FileTypeId = 0, FileTypeName = "Select" });
ViewBag.ListOfFileTypes = ftypelist;
FileEditViewModel fileEditViewModel = new FileEditViewModel
{
Id = model.Id,
Name = model.Name,
Author = model.Author,
Description = model.Description,
FileT = model.FileT,
PublishedOn = model.PublishedOn,
FilePath=model.FilePath
};
fileEditViewModel.Genre = await context.Genres.FindAsync(genre.GenreId);
return View(fileEditViewModel);
}
编辑帖子操作：
[HttpPost]
public async Task<IActionResult> EditFile(FileEditViewModel model,Genre genre)
{
var file = await context.Files.Where(x => x.Id == model.Id).Include(x=>x.Genre).Include(x=>x.FileT).FirstOrDefaultAsync();
if (ModelState.IsValid)
{
file.Name = model.Name;
file.Description = model.Description;
file.Author = model.Author;
file.FileT = model.FileT;
file.Genre = model.Genre;
file.PublishedOn = model.PublishedOn;
file.FileT = context.FileTypes.Find(model.FileT.FileTypeId);
file.Genre = context.Genres.Find(genre.GenreId);
context.Files.Update(file);
context.SaveChanges();
TempData["Message"] = "File successfully uploaded to File System.";
return RedirectToAction("Index", "Home");
}
return View();
}
编辑视图：
@model FileEditViewModel
@{
ViewBag.Title = "Edit File";
}
<h4 style="text-align: center; font-family: 'Montserrat', sans-serif;">Edit File</h4>
<form enctype="multipart/form-data" asp-controller="files" asp-action="Edit" method="post">
<input hidden asp-for="Id" />
<input hidden asp-for="existingPath" />
<div class="from-group row">
<label asp-for="FileT.FileTypeName" class="col-sm-2 col-form-label">File Type</label>
<div class="col-sm-10">
<select asp-for="FileT.FileTypeId" id="FileTypeId" class="form-control mr-sm-2" style="margin-bottom:10px;" asp-items="@(new SelectList(@ViewBag.ListOfFileTypes,"FileTypeId","FileTypeName"))"></select>
</div>
</div>
<div class="form-group row">
<label class="col-sm-2 col-form-label" asp-for="Genre.GenreName">Genre</label>
<div class="col-sm-10">
<select class="form-control mr-sm-2" id="GenreId" name="GenreId" asp-for="Genre.GenreId" asp-items="@(new SelectList(string.Empty,"GenreId","GenreName"))"></select>
</div>
</div>
<div class="form-group row">
<label asp-for="Name" class="col-sm-2 col-form-label"></label>
<div class="col-sm-10">
<input asp-for="Name" class="form-control" placeholder="name" />
<span asp-validation-for="Name" class="text-danger"></span>
</div>
</div>
<div class="form-group row">
<label asp-for="Author" class="col-sm-2 col-form-label"></label>
<div class="col-sm-10">
<input asp-for="Author" class="form-control" placeholder="Author" />
<span asp-validation-for="Author" class="text-danger"></span>
</div>
</div>
<div class="form-group row">
<label asp-for="Description" class="col-sm-2 col-form-label"></label>
<div class="col-sm-10">
<input asp-for="Description" class="form-control" placeholder="Description" />
<span asp-validation-for="Description" class="text-danger"></span>
</div>
</div>
<div class="form-group row ">
<label asp-for="PublishedOn" class="col-sm-2 col-form-label"></label>
<div class="col-sm-10">
<input type="date" asp-for="PublishedOn" class="form-control" placeholder="Publishing Date" />
<span asp-validation-for="PublishedOn" class="text-danger"></span>
</div>
</div>
<button class="btn btn-success" asp-controller="files" asp-action="EditFile" type="submit">Update</button>
<a asp-controller="home" asp-action="index" class="btn btn-primary">Cancel</a>
</form>
渲染流派下拉列表的脚本取决于文件类型下拉列表中的选择：
@section Scripts{
<script type="text/javascript">
$(document).ready(function () {
var items = "<option value='0'>Select</option>";
$('#GenreId').html(items);
});
</script>
<script type="text/javascript">
$(document).ready(function () {
$('#FileTypeId').change(function () {
var url = '@Url.Content("~/")' + "Files/GetGenre";
var ddlsource = "#FileTypeId";
$.getJSON(url, { FileTypeId: $(ddlsource).val() }, function (data) {
var items = '';
$("#GenreId").empty();
$.each(data, function (i, genrelist2) {
items += "<option value='" + genrelist2.value + "'>" + genrelist2.text + "</option>";
});
$('#GenreId').html(items);
});
});
});
</script>
}
所以我希望 Genre 下拉列表的名字是当前类型的名称，而不是 select 并且一切都应该保持不变。它也可以以这种方式工作，但是当您打开编辑表单并看到空的下拉列表时看起来不太好。
【问题讨论】：
标签： javascript json ajax asp.net-mvc asp.net-core