C#MVC中带有foreach循环的DropDownList [英] DropDownList with foreach loop in C# MVC
问题描述
原始
我有一个网站,可以管理汽车,品牌和汽车型号.现在,我有控制器,模型和视图,应用程序正在运行,一切都由Visual Studio自动生成,并且我正在使用实体框架(首先是数据库).
I have a website where I can manage cars, brands, and car models. Right now I have controllers, models and views, the application is working, everything was auto generated by Visual Studio, and i am using entity framework (database first).
当我尝试创建汽车时,品牌和汽车型号的下拉菜单并没有我想要的级联.
When I try to create a car, the dropdowns with brands and Car models are not cascading like I want.
我有一个解决方案:在每个选择(下拉)上的每个选项标签上添加一个类(或其他属性/属性).然后,用JS,剩下的事我会做.我只是想知道如何做一个foreach循环来构建我的下拉菜单,即使这不是最佳解决方案,我也没有在讨论.记住,我需要在Cars视图中对carmodel模型进行一个foreach循环.
I have a solution: add a class (or other property/attribute) to each option tag on each select (dropdown). Then, with JS, i'll do the rest. I just want to know how can I do a foreach loop to build my dropdown, even if it's not the best solution, i'm not discussing that. Remember, I need to do a foreach loop to the carmodel Model, inside the Cars View.
编辑
汽车景观
@model MyApp.Models.car
@{
ViewBag.Title = "Create";
}
<h2>Create</h2>
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>car</h4>
<hr />
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="form-group">
@Html.LabelFor(model => model.bodytypeId, "bodytypeId", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("bodytypeId", null, htmlAttributes: new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.bodytypeId, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.manufacturerId, "manufacturerId", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("manufacturerId", null, htmlAttributes: new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.manufacturerId, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.modelId, "modelId", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("modelId", null, htmlAttributes: new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.modelId, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.versionId, "versionId", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("versionId", null, htmlAttributes: new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.versionId, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.fuelId, "fuelId", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("fuelId", null, htmlAttributes: new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.fuelId, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.transmissionId, "transmissionId", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("transmissionId", null, htmlAttributes: new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.transmissionId, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.colorId, "colorId", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("colorId", null, htmlAttributes: new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.colorId, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.horsePower, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.horsePower, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.horsePower, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.kw, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.kw, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.kw, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.cc, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.cc, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.cc, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Co2Emissions, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Co2Emissions, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Co2Emissions, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.mileage, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.mileage, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.mileage, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.year, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.year, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.year, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.doors, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.doors, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.doors, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.seats, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.seats, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.seats, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.plate, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.plate, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.plate, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.price, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.price, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.price, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.shortDescription, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.shortDescription, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.shortDescription, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.longDescription, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.longDescription, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.longDescription, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.sold, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
<div class="checkbox">
@Html.EditorFor(model => model.sold)
@Html.ValidationMessageFor(model => model.sold, "", new { @class = "text-danger" })
</div>
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.active, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
<div class="checkbox">
@Html.EditorFor(model => model.active)
@Html.ValidationMessageFor(model => model.active, "", new { @class = "text-danger" })
</div>
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.dateAdded, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.dateAdded, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.dateAdded, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.dateSold, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.dateSold, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.dateSold, "", 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>
}
<div>
@Html.ActionLink("Back to List", "Index")
</div>
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
}
汽车型号
//------------------------------------------------------------------------------
// <auto-generated>
// This code was generated from a template.
//
// Manual changes to this file may cause unexpected behavior in your application.
// Manual changes to this file will be overwritten if the code is regenerated.
// </auto-generated>
//------------------------------------------------------------------------------
namespace MyApp.Models
{
using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Web.Mvc;
public partial class car
{
[System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Usage", "CA2214:DoNotCallOverridableMethodsInConstructors")]
public car()
{
this.carimages = new HashSet<carimage>();
}
public int id { get; set; }
[Display(Name = "#")]
public Nullable<int> bodytypeId { get; set; }
[Display(Name = "Body Type")]
public Nullable<int> manufacturerId { get; set; }
[Display(Name = "Model")]
public Nullable<int> modelId { get; set; }
[Display(Name = "Version")]
public Nullable<int> versionId { get; set; }
[Display(Name = "Fuel")]
public Nullable<int> fuelId { get; set; }
[Display(Name = "Transmission")]
public Nullable<int> transmissionId { get; set; }
[Display(Name = "Color")]
public Nullable<int> colorId { get; set; }
[Display(Name = "HP")]
public Nullable<int> horsePower { get; set; }
[Display(Name = "KW")]
public Nullable<int> kw { get; set; }
[Display(Name = "CC")]
public Nullable<int> cc { get; set; }
[Display(Name = "CO2")]
public Nullable<double> Co2Emissions { get; set; }
[Display(Name = "Mileage")]
public Nullable<int> mileage { get; set; }
[Display(Name = "Year")]
public Nullable<int> year { get; set; }
[Display(Name = "Doors")]
public Nullable<int> doors { get; set; }
[Display(Name = "Seats")]
public Nullable<int> seats { get; set; }
[Display(Name = "Plate")]
public string plate { get; set; }
[Display(Name = "Price")]
public Nullable<int> price { get; set; }
[Display(Name = "Short Description")]
public string shortDescription { get; set; }
[Display(Name = "Long Description")]
public string longDescription { get; set; }
[Display(Name = "Sold")]
public bool sold { get; set; }
[Display(Name = "Active")]
public bool active { get; set; }
[Display(Name = "Date Added")]
[DataType(DataType.DateTime)]
[DisplayFormat(DataFormatString = "{0:dd-MM-yyyy hh:mm}", ApplyFormatInEditMode = true)]
public Nullable<System.DateTime> dateAdded { get; set; }
[Display(Name = "Date Sold")]
[DataType(DataType.DateTime)]
[DisplayFormat(DataFormatString = "{0:dd-MM-yyyy hh:mm}", ApplyFormatInEditMode = true)]
public Nullable<System.DateTime> dateSold { get; set; }
public virtual bodytype bodytype { get; set; }
public virtual color color { get; set; }
public virtual fuel fuel { get; set; }
public virtual manufacturer manufacturer { get; set; }
public virtual model model { get; set; }
public virtual transmission transmission { get; set; }
public virtual version version { get; set; }
[System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Usage", "CA2227:CollectionPropertiesShouldBeReadOnly")]
public virtual ICollection<carimage> carimages { get; set; }
}
}
汽车控制器
using System;
using System.Collections.Generic;
using System.Data;
using System.Data.Entity;
using System.Linq;
using System.Net;
using System.Web;
using System.Web.Mvc;
using MyApp.Models;
namespace MyApp.Controllers
{
public class carsController : Controller
{
private MyAppEntities db = new MyAppEntities();
// GET: cars
public ActionResult Index(string id)
{
string searchString = id;
var cars = db.cars.Include(c => c.bodytype).Include(c => c.color).Include(c => c.fuel).Include(c => c.manufacturer).Include(c => c.model).Include(c => c.transmission).Include(c => c.version);
if (!String.IsNullOrEmpty(searchString))
{
cars = cars.Where(s => s.bodytype.name.Contains(searchString) ||
s.cc.ToString().Contains(searchString) ||
s.Co2Emissions.ToString().Contains(searchString) ||
s.color.name.Contains(searchString) ||
s.dateAdded.Value.ToString("dd-mm-yyyy").Contains(searchString) ||
s.dateSold.Value.ToString("dd-mm-yyyy").Contains(searchString) ||
s.doors.ToString().Contains(searchString) ||
s.fuel.name.Contains(searchString) ||
s.horsePower.ToString().Contains(searchString) ||
s.id.ToString().Contains(searchString) ||
s.kw.ToString().Contains(searchString) ||
s.longDescription.Contains(searchString) ||
s.manufacturer.name.Contains(searchString) ||
s.mileage.ToString().Contains(searchString) ||
s.model.name.Contains(searchString) ||
s.plate.Contains(searchString) ||
s.price.ToString().Contains(searchString) ||
s.seats.ToString().Contains(searchString) ||
s.shortDescription.Contains(searchString) ||
s.transmission.name.Contains(searchString) ||
s.version.name.Contains(searchString) ||
s.year.ToString().Contains(searchString)
);
}
return View(cars.ToList());
}
// GET: cars/Details/5
public ActionResult Details(int? id)
{
if (id == null)
{
return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
}
car car = db.cars.Find(id);
if (car == null)
{
return HttpNotFound();
}
return View(car);
}
// GET: cars/Create
public ActionResult Create()
{
ViewBag.bodytypeId = new SelectList(db.bodytypes, "id", "name");
ViewBag.colorId = new SelectList(db.colors, "id", "name");
ViewBag.fuelId = new SelectList(db.fuels, "id", "name");
ViewBag.manufacturerId = new SelectList(db.manufacturers, "id", "name");
ViewBag.modelId = new SelectList(db.models, "id", "name");
ViewBag.transmissionId = new SelectList(db.transmissions, "id", "name");
ViewBag.versionId = new SelectList(db.versions, "id", "name");
return View();
}
// POST: cars/Create
// 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 ActionResult Create([Bind(Include = "id,bodytypeId,manufacturerId,modelId,versionId,fuelId,transmissionId,colorId,horsePower,kw,cc,Co2Emissions,mileage,year,doors,seats,plate,price,shortDescription,longDescription,sold,active,dateAdded,dateSold")] car car)
{
if (ModelState.IsValid)
{
db.cars.Add(car);
db.SaveChanges();
return RedirectToAction("Index");
}
ViewBag.bodytypeId = new SelectList(db.bodytypes, "id", "name", car.bodytypeId);
ViewBag.colorId = new SelectList(db.colors, "id", "name", car.colorId);
ViewBag.fuelId = new SelectList(db.fuels, "id", "name", car.fuelId);
ViewBag.manufacturerId = new SelectList(db.manufacturers, "id", "name", car.manufacturerId);
ViewBag.modelId = new SelectList(db.models, "id", "name", car.modelId);
ViewBag.transmissionId = new SelectList(db.transmissions, "id", "name", car.transmissionId);
ViewBag.versionId = new SelectList(db.versions, "id", "name", car.versionId);
return View(car);
}
// GET: cars/Edit/5
public ActionResult Edit(int? id)
{
if (id == null)
{
return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
}
car car = db.cars.Find(id);
if (car == null)
{
return HttpNotFound();
}
ViewBag.bodytypeId = new SelectList(db.bodytypes, "id", "name", car.bodytypeId);
ViewBag.colorId = new SelectList(db.colors, "id", "name", car.colorId);
ViewBag.fuelId = new SelectList(db.fuels, "id", "name", car.fuelId);
ViewBag.manufacturerId = new SelectList(db.manufacturers, "id", "name", car.manufacturerId);
ViewBag.modelId = new SelectList(db.models, "id", "name", car.modelId);
ViewBag.transmissionId = new SelectList(db.transmissions, "id", "name", car.transmissionId);
ViewBag.versionId = new SelectList(db.versions, "id", "name", car.versionId);
return View(car);
}
// POST: cars/Edit/5
// 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 ActionResult Edit([Bind(Include = "id,bodytypeId,manufacturerId,modelId,versionId,fuelId,transmissionId,colorId,horsePower,kw,cc,Co2Emissions,mileage,year,doors,seats,plate,price,shortDescription,longDescription,sold,active,dateAdded,dateSold")] car car)
{
if (ModelState.IsValid)
{
db.Entry(car).State = EntityState.Modified;
db.SaveChanges();
return RedirectToAction("Index");
}
ViewBag.bodytypeId = new SelectList(db.bodytypes, "id", "name", car.bodytypeId);
ViewBag.colorId = new SelectList(db.colors, "id", "name", car.colorId);
ViewBag.fuelId = new SelectList(db.fuels, "id", "name", car.fuelId);
ViewBag.manufacturerId = new SelectList(db.manufacturers, "id", "name", car.manufacturerId);
ViewBag.modelId = new SelectList(db.models, "id", "name", car.modelId);
ViewBag.transmissionId = new SelectList(db.transmissions, "id", "name", car.transmissionId);
ViewBag.versionId = new SelectList(db.versions, "id", "name", car.versionId);
return View(car);
}
// GET: cars/Delete/5
public ActionResult Delete(int? id)
{
if (id == null)
{
return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
}
car car = db.cars.Find(id);
if (car == null)
{
return HttpNotFound();
}
return View(car);
}
// POST: cars/Delete/5
[HttpPost, ActionName("Delete")]
[ValidateAntiForgeryToken]
public ActionResult DeleteConfirmed(int id)
{
car car = db.cars.Find(id);
db.cars.Remove(car);
db.SaveChanges();
return RedirectToAction("Index");
}
protected override void Dispose(bool disposing)
{
if (disposing)
{
db.Dispose();
}
base.Dispose(disposing);
}
}
}
推荐答案
找到的解决方案具有以下2个表的学校数据库.
School database with the following 2 tables.
StateMaster
DistrictMaster
第1步
打开Visual Studio,然后选择文件" >>新建" >>项目",然后选择"ASP.Net MVC 4 Web应用程序".
Open Visual Studio then select File >> New >> Project then select ASP.Net MVC 4 Web Application.
第2步
选择"Internet应用程序",然后单击确定".
Select Internet Application then click OK.
第3步
选择Model文件夹,然后创建一个新的Model类.
Select the Model folder then create a new Model class.
StudentModel.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace MvcDemoApplication.Models
{
public class StudentModel
{
public IList<SelectListItem> StateNames { get; set; }
public IList<SelectListItem> DistrictNames { get; set; }
}
}
第4步
创建一个.edmx文件并与数据库连接.
Create a .edmx file and connect with the database.
第5步
创建一个新的控制器.在本文中,我创建了DropDownListController.cs.
Create a new Controller. In this article I create DropDownListController.cs.
DropDownListController.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using MvcDemoApplication.Models;
namespace MvcDemoApplication.Controllers
{
public class DropDownListController : Controller
{
//
// GET: /DropDownList/
SchoolEntities schoolEntity = new SchoolEntities();
public ActionResult Index()
{
List<SelectListItem> stateNames = new List<SelectListItem>();
StudentModel stuModel=new StudentModel();
List<StateMaster> states = schoolEntity.StateMasters.ToList();
states.ForEach(x =>
{
stateNames.Add(new SelectListItem { Text = x.StateName , Value = x.StateId.ToString() });
});
stuModel.StateNames = stateNames;
return View(stuModel);
}
}
}
Index.cshtml
@model MvcDemoApplication.Models.StudentModel
@{
ViewBag.Title = "Index";
}
<script src="~/Scripts/jquery-1.7.1.min.js"></script>
<h2>Cascading Dropdownlist</h2>
<table>
<tr>
<td>
<label>State</label>
</td>
<td>
@Html.DropDownListFor(x => x.StateNames, Model.StateNames, "--Select--", new { @id="ddlState"});
</td>
</tr>
</table>
了解代码
在Studentmodel中,我们具有以下2个属性:
In Studentmodel we have the following 2 properties:
public IList<SelectListItem> StateNames { get; set; }
public IList<SelectListItem> DistrictNames { get; set; }
在这里,我们使用SelectListItem类,该类具有以下3个属性:
Here we are using the SelectListItem class, this class has the following 3 properties:
Selected: This is a bool type to show in a dropdown (as selected) true or false by default.
Text: This is a string type, for the dropdown text.
Value: This is string type for the value of the dropdown
如果您在下拉列表中注意到,我们还需要相同的属性.因此,我们在Ilist中使用SelectListItem.
If you notice in the dropdownlist, we also need the same properties. For this reason we are using SelectListItem in a Ilist.
DropdownlistController.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using MvcDemoApplication.Models;
namespace MvcDemoApplication.Controllers
{
public class DropDownListController : Controller
{
//
// GET: /DropDownList/
SchoolEntities schoolEntity = new SchoolEntities();
public ActionResult Index()
{
List<SelectListItem> stateNames = new List<SelectListItem>();
StudentModel stuModel=new StudentModel();
List<StateMaster> states = schoolEntity.StateMasters.ToList();
states.ForEach(x =>
{
stateNames.Add(new SelectListItem { Text = x.StateName , Value = x.StateId.ToString() });
});
stuModel.StateNames = stateNames;
return View(stuModel);
}
}
在前面的代码中,我们创建了SchoolEntities对象,该对象中所有相关的表都存在.
In the preceding code we create the SchoolEntities object, in this object all the related tables exist.
SchoolEntities schoolEntity = new SchoolEntities();
List<StateMaster> states = schoolEntity.StateMasters.ToList();
在前面的代码行中,StateMasters表的所有相关数据都进入StateMaster列表对象.
In the preceding line of code, all the related data of the StateMasters tables comes into the StateMaster list object.
states.ForEach(x =>
{
stateNames.Add(new SelectListItem { Text = x.StateName , Value = x.StateId.ToString() });
});
现在是时候将实体数据添加到Text和value属性中了,所有集合将存储在stateNames对象中.
Now it is time to add entity data into the Text and value properties, the all collection will be stored into the stateNames object.
Index.cshtml
@model MvcDemoApplication.Models.StudentModel
@{
ViewBag.Title = "Index";
}
<script src="~/Scripts/jquery-1.7.1.min.js"></script>
<h2>Cascading Dropdownlist</h2>
<table>
<tr>
<td>
<label>State</label>
</td>
<td>
@Html.DropDownListFor(x => x.StateNames, Model.StateNames, "--Select--", new { @id="ddlState"});
</td>
</tr>
</table>
前面的代码在View中显示模型数据.现在了解它是如何工作的.
The preceding code shows the model data in View. Now to understand how it works.
@Html.DropDownListFor(x => x.StateNames, Model.StateNames, "--Select--", new { @id="ddlState"});
看看上面的代码,我们在这里使用@Html帮助器类来创建DropDownList.在DropDownListFor helper类中,我们使用了4个参数.
Look at the preceding code, we used here, @Html helper classes for creating a DropDownList. In the DropDownListFor helper class we used 4 parameters.
x=>x.StateNames: For getting the values of the collection from the entity.
Model.StateNames: Collections of states.
"—Select--": Default value, when the dropdown list will be populated.
new {@id="ddlState"}: In this part we can define an id, class and name for the control.
如何在两个下拉列表之间进行级联.
DropdownlistController.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using MvcDemoApplication.Models;
namespace MvcDemoApplication.Controllers
{
public class DropDownListController : Controller
{
//
// GET: /DropDownList/
SchoolEntities1 schoolEntity = new SchoolEntities1();
public ActionResult Index()
{
List<SelectListItem> stateNames = new List<SelectListItem>();
StudentModel stuModel=new StudentModel();
List<StateMaster> states = schoolEntity.StateMasters.ToList();
states.ForEach(x =>
{
stateNames.Add(new SelectListItem { Text = x.StateName , Value = x.StateId.ToString() });
});
stuModel.StateNames = stateNames;
return View(stuModel);
}
[HttpPost]
public ActionResult GetDistrict(string stateId)
{
int statId;
List<SelectListItem> districtNames = new List<SelectListItem>();
if (!string.IsNullOrEmpty(stateId))
{
statId = Convert.ToInt32(stateId);
List<DistrictMaster> districts = schoolEntity.DistrictMasters.Where(x => x.StateId == statId).ToList();
districts.ForEach(x =>
{
districtNames.Add(new SelectListItem { Text = x.DistrictName, Value = x.DistrictId.ToString() });
});
}
return Json(districtNames, JsonRequestBehavior.AllowGet);
}
}
}
Index.cshtml
@model MvcDemoApplication.Models.StudentModel
@{
ViewBag.Title = "Index";
}
<script src="~/Scripts/jquery-1.7.1.min.js"></script>
<h2>Cascading Dropdownlist</h2>
<table>
<tr>
<td>
<label>State</label>
</td>
<td>
@Html.DropDownListFor(x => x.StateNames, Model.StateNames, "--Select--", new { @id="ddlState"});
</td>
</tr>
<tr>
<td>
<label>District</label>
</td>
<td id="District">
@Html.DropDownListFor(x => x.DistrictNames, new List<SelectListItem>(), "--Select--", new { @id="ddlDistrict"});
</td>
</tr>
</table>
<script type="text/javascript">
$(document).ready(function () {
$('#ddlState').change(function () {
$.ajax({
type: "post",
url: "/DropDownList/GetDistrict",
data: { stateId: $('#ddlState').val() },
datatype: "json",
traditional: true,
success: function (data) {
var district = "<select id='ddlDistrict'>";
district = district + '<option value="">--Select--</option>';
for (var i = 0; i < data.length; i++)
{
district = district + '<option value=' + data[i].Value + '>' + data[i].Text + '</option>';
}
district = district + '</select>';
$('#District').html(district);
}
});
});
});
</script>
就是这样.按F5键并运行您的代码.
That's it. Press F5 and run your code.
这篇关于C#MVC中带有foreach循环的DropDownList的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!