0
我已經爲多選下拉菜單實現了chosen.jquery。chosen.jquery mvc5 multiselect
它的工作原理是在創建獲取但不傳遞到帖子。
模型
public class Room
{
[Key]
public int Id { get; set; }
[DisplayName("Room Number")]
public int RoomNumber { get; set; }
[DisplayName("Room Type")]
public int RoomTypeId { get; set; }
public virtual RoomType RoomType { get; set; }
[DisplayName("Price Per Night")]
public decimal Price { get; set; }
public virtual ICollection<Amenity> Amenities { get; set; }
[NotMapped]
public IEnumerable<string> SelectedAmenities { get; set; }
[DisplayName("Bed Type")]
public int BedTypeId { get; set; }
public virtual BedType BedType { get; set; }
}
控制器
// GET: Rooms/Create
[MultiTenantControllerAllow("ManagementPortal")]
public ActionResult Create()
{
ViewBag.RoomTypeId = new SelectList(db.RoomTypes, "Id", "Name");
ViewBag.BedTypeId = new SelectList(db.BedTypes, "Id", "Name");
ViewBag.AmenityIds = new SelectList(db.Amenities, "Id", "Name");
return View();
}
// POST: Rooms/Create
[MultiTenantControllerAllow("ManagementPortal")]
// To protect from overposting attacks, please enable the specific properties you want to bind to, for
// more details see http://go.microsoft.com/fwlink/?LinkId=317598.
[HttpPost]
[ValidateAntiForgeryToken]
public async Task<ActionResult> Create([Bind(Include = "Id,RoomNumber,RoomTypeId,BedTypeId,Price,Amenities,SelectedAmenities")] Room room)
{
if (ModelState.IsValid)
{
db.Rooms.Add(room);
await db.SaveChangesAsync();
return RedirectToAction("Index");
}
ViewBag.RoomTypeId = new SelectList(db.RoomTypes, "Id", "Name", room.RoomTypeId);
ViewBag.BedTypeId = new SelectList(db.BedTypes, "Id", "Name", room.BedTypeId);
ViewBag.AmenityIds = new SelectList(db.Amenities, "Id", "Name", room.Amenities);
return View(room);
}
視圖部分
<div class="form-group">
@Html.LabelFor(model => model.Amenities, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.ListBox("AmenityIds", new MultiSelectList(ViewBag.AmenityIds, "Value", "text"), new { @class = "form-control amenities-select" })
@Html.ValidationMessageFor(model => model.Amenities, "", new { @class = "text-danger" })
</div>
</div><div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Create" class="btn btn-default" />
</div>
</div>
</div>
腳本部分
@section Scripts {
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryval")
$(".amenities-select").chosen();
<link href="@Url.Content("~/Content/chosen.css")" rel="stylesheet" type="text/css" />
}
現在我認爲有問題的代碼行是ListBox,因爲它不會將結果分配給模型屬性。我不確定如何使這項工作。在此先感謝
你不必在你的基於模型AmenityIds' –
你想要一個名爲'模型的屬性'@ Html.ListBoxFor(M => m.SelectedAmenities ,(IEnumerable)ViewBag.AmenityIds,new {...})'。而你的'LabelFor()'和'ValidationMessageFor()'也需要綁定到同一個屬性。 –
另外,在視圖中使用'new SelectList(..)'創建第二個相同的'IEnumerable'是沒有意義的額外開銷 –