2017-10-06 58 views
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,因爲它不會將結果分配給模型屬性。我不確定如何使這項工作。在此先感謝

+0

你不必在你的基於模型AmenityIds' –

+0

你想要一個名爲'模型的屬性'@ Html.ListBoxFor(M => m.SelectedAmenities ,(IEnumerable )ViewBag.AmenityIds,new {...})'。而你的'LabelFor()'和'ValidationMessageFor()'也需要綁定到同一個屬性。 –

+0

另外,在視圖中使用'new SelectList(..)'創建第二個相同的'IEnumerable '是沒有意義的額外開銷 –

回答

0

愚蠢的錯誤。我需要一個@Html.ListBoxFor(model => model.SelectedAmenities)代替

它的工作現在