Salut, je suis nouveau à MVC et même asp ..
Je veux créer un formulaire dans MVC. À l'aide de quelques exemples, je suis capable de créer des zones de texte, mais je ne comprends pas comment créer une liste de sélection./
J'ai essayé de rechercher de nombreux exemples d'implémentation de la liste de sélection dans MVC, mais je ne suis pas capable de comprendre.
J'ai un formulaire qui est à moitié codé en HTML et l'autre moitié en MVC.
Voici mon code:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
namespace MedAvail.Applications.MedProvision.Web.Models
{
public class AddressViewModel
{
public string Street1 { get; set; }
public string Street2 { get; set; }
public string City { get; set; }
public string Province { get; set; }
public string Country { get; set; }
public string PostalCode { get; set; }
public string PhoneNumber { get; set; }
}
}
<form id="locationInfo">
<h1>Location Information</h1>
<table width="80%" id="locInfo">
<colgroup>
<col width="20%" />
<col />
</colgroup>
<tr>
<th>@Html.Label("Country")</th>
<td>
<select required="">
<option>Select Country</option>
<option>Canada</option>
<option>United States</option>
</select>
<span class="required">*</span>
</td>
</tr>
<tr>
<th>@Html.LabelFor(x=>x.State)</th>
<td>
<select required="">
<option>Select State</option>
<option>State 1</option>
<option>State 2</option>
<option>State 3</option>
...............
</select><span class="required">*</span></td>
</tr>
<tr>
<th>@Html.LabelFor(x=>x.PostalCode)</th>
<td>@Html.TextBoxFor(x=>x.PostalCode)<span class="required">*</span></td>
</tr>
<tr>
<th>@Html.LabelFor(x=>x.City)</th>
<td>@Html.TextBoxFor(x=>x.City)<span class="required">*</span></td>
</tr>
<tr>
<th>@Html.LabelFor(x=>x.StreetAddress1)</th>
<td>@Html.TextBoxFor(x=>x.StreetAddress1)<span class="required">*</span></td>
</tr>
<tr>
<th>@Html.LabelFor(x=>x.StreetAddress2)</th>
<td>@Html.TextBoxFor(x=>x.StreetAddress2)</td>
</tr>
<tr>
<th>@Html.LabelFor(x=>x.PhoneNumber)</th>
<td>@Html.TextBoxFor(x=>x.PhoneNumber)</td>
</tr>
</table>
<div role="button" class="marginTop50 marginBottom">
<input type="button" id="step3Back" value="Back" class="active" />
<input type="button" id="step3confirmNext" value="Next" class="active marginLeft50" />
</div>
</form>
Veuillez me guider sur la façon de créer la liste de sélection pour ce type de formulaire.
Merci à tous! Je suis en mesure de charger la liste de sélection selon MVC maintenant Mon code de travail est ci-dessous:
HTML + MVC Code in View: -
<tr>
<th>@Html.Label("Country")</th>
<td>@Html.DropDownListFor(x =>x.Province,SelectListItemHelper.GetCountryList())<span class="required">*</span></td>
</tr>
<tr>
<th>@Html.LabelFor(x=>x.Province)</th>
<td>@Html.DropDownListFor(x =>x.Province,SelectListItemHelper.GetProvincesList())<span class="required">*</span></td>
</tr>
Création d'un contrôleur dans le dossier "UTIL": Code: -
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace MedAvail.Applications.MedProvision.Web.Util
{
public class SelectListItemHelper
{
public static IEnumerable<SelectListItem> GetProvincesList()
{
IList<SelectListItem> items = new List<SelectListItem>
{
new SelectListItem{Text = "California", Value = "B"},
new SelectListItem{Text = "Alaska", Value = "B"},
new SelectListItem{Text = "Illinois", Value = "B"},
new SelectListItem{Text = "Texas", Value = "B"},
new SelectListItem{Text = "Washington", Value = "B"}
};
return items;
}
public static IEnumerable<SelectListItem> GetCountryList()
{
IList<SelectListItem> items = new List<SelectListItem>
{
new SelectListItem{Text = "United States", Value = "B"},
new SelectListItem{Text = "Canada", Value = "B"},
new SelectListItem{Text = "United Kingdom", Value = "B"},
new SelectListItem{Text = "Texas", Value = "B"},
new SelectListItem{Text = "Washington", Value = "B"}
};
return items;
}
}
}
Et son COOL de travail maintenant :-)
Merci!!
public static List<SelectListItem> States = new List<SelectListItem>()
{
new SelectListItem() {Text="Alabama", Value="AL"},
new SelectListItem() { Text="Alaska", Value="AK"},
new SelectListItem() { Text="Arizona", Value="AZ"},
new SelectListItem() { Text="Arkansas", Value="AR"},
new SelectListItem() { Text="California", Value="CA"},
new SelectListItem() { Text="Colorado", Value="CO"},
new SelectListItem() { Text="Connecticut", Value="CT"},
new SelectListItem() { Text="District of Columbia", Value="DC"},
new SelectListItem() { Text="Delaware", Value="DE"},
new SelectListItem() { Text="Florida", Value="FL"},
new SelectListItem() { Text="Georgia", Value="GA"},
new SelectListItem() { Text="Hawaii", Value="HI"},
new SelectListItem() { Text="Idaho", Value="ID"},
new SelectListItem() { Text="Illinois", Value="IL"},
new SelectListItem() { Text="Indiana", Value="IN"},
new SelectListItem() { Text="Iowa", Value="IA"},
new SelectListItem() { Text="Kansas", Value="KS"},
new SelectListItem() { Text="Kentucky", Value="KY"},
new SelectListItem() { Text="Louisiana", Value="LA"},
new SelectListItem() { Text="Maine", Value="ME"},
new SelectListItem() { Text="Maryland", Value="MD"},
new SelectListItem() { Text="Massachusetts", Value="MA"},
new SelectListItem() { Text="Michigan", Value="MI"},
new SelectListItem() { Text="Minnesota", Value="MN"},
new SelectListItem() { Text="Mississippi", Value="MS"},
new SelectListItem() { Text="Missouri", Value="MO"},
new SelectListItem() { Text="Montana", Value="MT"},
new SelectListItem() { Text="Nebraska", Value="NE"},
new SelectListItem() { Text="Nevada", Value="NV"},
new SelectListItem() { Text="New Hampshire", Value="NH"},
new SelectListItem() { Text="New Jersey", Value="NJ"},
new SelectListItem() { Text="New Mexico", Value="NM"},
new SelectListItem() { Text="New York", Value="NY"},
new SelectListItem() { Text="North Carolina", Value="NC"},
new SelectListItem() { Text="North Dakota", Value="ND"},
new SelectListItem() { Text="Ohio", Value="OH"},
new SelectListItem() { Text="Oklahoma", Value="OK"},
new SelectListItem() { Text="Oregon", Value="OR"},
new SelectListItem() { Text="Pennsylvania", Value="PA"},
new SelectListItem() { Text="Rhode Island", Value="RI"},
new SelectListItem() { Text="South Carolina", Value="SC"},
new SelectListItem() { Text="South Dakota", Value="SD"},
new SelectListItem() { Text="Tennessee", Value="TN"},
new SelectListItem() { Text="Texas", Value="TX"},
new SelectListItem() { Text="Utah", Value="UT"},
new SelectListItem() { Text="Vermont", Value="VT"},
new SelectListItem() { Text="Virginia", Value="VA"},
new SelectListItem() { Text="Washington", Value="WA"},
new SelectListItem() { Text="West Virginia", Value="WV"},
new SelectListItem() { Text="Wisconsin", Value="WI"},
new SelectListItem() { Text="Wyoming", Value="WY"}
};
Comment nous le faisons est mis cette méthode dans une classe et ensuite appeler la classe à partir de la vue
@Html.DropDownListFor(x => x.State, Class.States)
Merci pour ça
Voici ce que j'ai fait:
1.Créé un fichier Extensions.cs dans un dossier Utils.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace Web.ProjectName.Utils
{
public class Extensions
{
public static IEnumerable<SelectListItem> GetStatesList()
{
IList<SelectListItem> states = new List<SelectListItem>
{
new SelectListItem() {Text="Alabama", Value="AL"},
new SelectListItem() { Text="Alaska", Value="AK"},
new SelectListItem() { Text="Arizona", Value="AZ"},
new SelectListItem() { Text="Arkansas", Value="AR"},
new SelectListItem() { Text="California", Value="CA"},
new SelectListItem() { Text="Colorado", Value="CO"},
new SelectListItem() { Text="Connecticut", Value="CT"},
new SelectListItem() { Text="District of Columbia", Value="DC"},
new SelectListItem() { Text="Delaware", Value="DE"},
new SelectListItem() { Text="Florida", Value="FL"},
new SelectListItem() { Text="Georgia", Value="GA"},
new SelectListItem() { Text="Hawaii", Value="HI"},
new SelectListItem() { Text="Idaho", Value="ID"},
new SelectListItem() { Text="Illinois", Value="IL"},
new SelectListItem() { Text="Indiana", Value="IN"},
new SelectListItem() { Text="Iowa", Value="IA"},
new SelectListItem() { Text="Kansas", Value="KS"},
new SelectListItem() { Text="Kentucky", Value="KY"},
new SelectListItem() { Text="Louisiana", Value="LA"},
new SelectListItem() { Text="Maine", Value="ME"},
new SelectListItem() { Text="Maryland", Value="MD"},
new SelectListItem() { Text="Massachusetts", Value="MA"},
new SelectListItem() { Text="Michigan", Value="MI"},
new SelectListItem() { Text="Minnesota", Value="MN"},
new SelectListItem() { Text="Mississippi", Value="MS"},
new SelectListItem() { Text="Missouri", Value="MO"},
new SelectListItem() { Text="Montana", Value="MT"},
new SelectListItem() { Text="Nebraska", Value="NE"},
new SelectListItem() { Text="Nevada", Value="NV"},
new SelectListItem() { Text="New Hampshire", Value="NH"},
new SelectListItem() { Text="New Jersey", Value="NJ"},
new SelectListItem() { Text="New Mexico", Value="NM"},
new SelectListItem() { Text="New York", Value="NY"},
new SelectListItem() { Text="North Carolina", Value="NC"},
new SelectListItem() { Text="North Dakota", Value="ND"},
new SelectListItem() { Text="Ohio", Value="OH"},
new SelectListItem() { Text="Oklahoma", Value="OK"},
new SelectListItem() { Text="Oregon", Value="OR"},
new SelectListItem() { Text="Pennsylvania", Value="PA"},
new SelectListItem() { Text="Rhode Island", Value="RI"},
new SelectListItem() { Text="South Carolina", Value="SC"},
new SelectListItem() { Text="South Dakota", Value="SD"},
new SelectListItem() { Text="Tennessee", Value="TN"},
new SelectListItem() { Text="Texas", Value="TX"},
new SelectListItem() { Text="Utah", Value="UT"},
new SelectListItem() { Text="Vermont", Value="VT"},
new SelectListItem() { Text="Virginia", Value="VA"},
new SelectListItem() { Text="Washington", Value="WA"},
new SelectListItem() { Text="West Virginia", Value="WV"},
new SelectListItem() { Text="Wisconsin", Value="WI"},
new SelectListItem() { Text="Wyoming", Value="WY"}
};
return states;
}
}
}
2.Dans mon modèle, l'état sera abrégé (par exemple, "AL", "NY", etc.):
using System.ComponentModel;
using System.ComponentModel.DataAnnotations;
namespace Web.ProjectName.Models
{
public class ContactForm
{
...
[Required]
[Display(Name = "State")]
[RegularExpression("[A-Z]{2}")]
public string State { get; set; }
...
}
}
2. À mon avis, je l'ai mentionné:
@model Web.ProjectName.Models.ContactForm
...
@Html.LabelFor(x => x.State, new { @class = "form-label" })
@Html.DropDownListFor(x => x.State, Web.ProjectName.Utils.Extensions.GetStatesList(), new { @class = "form-control" })
...
Concevoir votre modèle:
Public class ModelName
{
...// Properties
public IEnumerable<SelectListItem> ListName { get; set; }
}
Préparer et lier la liste au modèle dans le contrôleur:
public ActionResult Index(ModelName model)
{
var items = // Your List of data
model.ListName = items.Select(x=> new SelectListItem() {
Text = x.prop,
Value = x.prop2
});
}
Dans votre vue:
@Html.DropDownListFor(m => Model.prop2,Model.ListName)
Tant de façons de le faire ... pour #NetCore, utilisez Lib ..
using System;
using System.Collections.Generic;
using System.Linq; // only required when .AsEnumerable() is used
using System.ComponentModel.DataAnnotations;
using Microsoft.AspNetCore.Mvc.Rendering;
Modèle...
namespace MyProject.Models
{
public class MyModel
{
[Required]
[Display(Name = "State")]
public string StatePick { get; set; }
public string state { get; set; }
[StringLength(35, ErrorMessage = "State cannot be longer than 35 characters.")]
public SelectList StateList { get; set; }
}
}
Manette...
namespace MyProject.Controllers
{
/// <summary>
/// create SelectListItem from strings
/// </summary>
/// <param name="isValue">defaultValue is SelectListItem.Value is true, SelectListItem.Text if false</param>
/// <returns></returns>
private SelectListItem newItem(string value, string text, string defaultValue = "", bool isValue = false)
{
SelectListItem ss = new SelectListItem();
ss.Text = text;
ss.Value = value;
// select default by Value or Text
if (isValue && ss.Value == defaultValue || !isValue && ss.Text == defaultValue)
{
ss.Selected = true;
}
return ss;
}
/// <summary>
/// this pulls the state name from _context and sets it as the default for the selectList
/// </summary>
/// <param name="myState">sets default value for list of states</param>
/// <returns></returns>
private SelectList getStateList(string myState = "")
{
List<SelectListItem> states = new List<SelectListItem>();
SelectListItem chosen = new SelectListItem();
// set default selected state to OHIO
string defaultValue = "OH";
if (!string.IsNullOrEmpty(myState))
{
defaultValue = myState;
}
try
{
states.Add(newItem("AL", "Alabama", defaultValue, true));
states.Add(newItem("AK", "Alaska", defaultValue, true));
states.Add(newItem("AZ", "Arizona", defaultValue, true));
states.Add(newItem("AR", "Arkansas", defaultValue, true));
states.Add(newItem("CA", "California", defaultValue, true));
states.Add(newItem("CO", "Colorado", defaultValue, true));
states.Add(newItem("CT", "Connecticut", defaultValue, true));
states.Add(newItem("DE", "Delaware", defaultValue, true));
states.Add(newItem("DC", "District of Columbia", defaultValue, true));
states.Add(newItem("FL", "Florida", defaultValue, true));
states.Add(newItem("GA", "Georgia", defaultValue, true));
states.Add(newItem("HI", "Hawaii", defaultValue, true));
states.Add(newItem("ID", "Idaho", defaultValue, true));
states.Add(newItem("IL", "Illinois", defaultValue, true));
states.Add(newItem("IN", "Indiana", defaultValue, true));
states.Add(newItem("IA", "Iowa", defaultValue, true));
states.Add(newItem("KS", "Kansas", defaultValue, true));
states.Add(newItem("KY", "Kentucky", defaultValue, true));
states.Add(newItem("LA", "Louisiana", defaultValue, true));
states.Add(newItem("ME", "Maine", defaultValue, true));
states.Add(newItem("MD", "Maryland", defaultValue, true));
states.Add(newItem("MA", "Massachusetts", defaultValue, true));
states.Add(newItem("MI", "Michigan", defaultValue, true));
states.Add(newItem("MN", "Minnesota", defaultValue, true));
states.Add(newItem("MS", "Mississippi", defaultValue, true));
states.Add(newItem("MO", "Missouri", defaultValue, true));
states.Add(newItem("MT", "Montana", defaultValue, true));
states.Add(newItem("NE", "Nebraska", defaultValue, true));
states.Add(newItem("NV", "Nevada", defaultValue, true));
states.Add(newItem("NH", "New Hampshire", defaultValue, true));
states.Add(newItem("NJ", "New Jersey", defaultValue, true));
states.Add(newItem("NM", "New Mexico", defaultValue, true));
states.Add(newItem("NY", "New York", defaultValue, true));
states.Add(newItem("NC", "North Carolina", defaultValue, true));
states.Add(newItem("ND", "North Dakota", defaultValue, true));
states.Add(newItem("OH", "Ohio", defaultValue, true));
states.Add(newItem("OK", "Oklahoma", defaultValue, true));
states.Add(newItem("OR", "Oregon", defaultValue, true));
states.Add(newItem("PA", "Pennsylvania", defaultValue, true));
states.Add(newItem("RI", "Rhode Island", defaultValue, true));
states.Add(newItem("SC", "South Carolina", defaultValue, true));
states.Add(newItem("SD", "South Dakota", defaultValue, true));
states.Add(newItem("TN", "Tennessee", defaultValue, true));
states.Add(newItem("TX", "Texas", defaultValue, true));
states.Add(newItem("UT", "Utah", defaultValue, true));
states.Add(newItem("VT", "Vermont", defaultValue, true));
states.Add(newItem("VA", "Virginia", defaultValue, true));
states.Add(newItem("WA", "Washington", defaultValue, true));
states.Add(newItem("WV", "West Virginia", defaultValue, true));
states.Add(newItem("WI", "Wisconsin", defaultValue, true));
states.Add(newItem("WY", "Wyoming", defaultValue, true));
foreach (SelectListItem state in states)
{
if (state.Selected)
{
chosen = state;
break;
}
}
}
catch (Exception err)
{
string ss = "ERR! " + err.Source + " " + err.GetType().ToString() + "\r\n" + err.Message.Replace("\r\n", " ");
ss = this.sendError("Online getStateList Request", ss, _errPassword);
// return error
}
// .AsEnumerable() is not required in the pass.. it is an extension of Linq
SelectList myList = new SelectList(states.AsEnumerable(), "Value", "Text", chosen);
object val = myList.SelectedValue;
return myList;
}
public ActionResult pickState(MyModel pData)
{
if (pData.StateList == null)
{
if (String.IsNullOrEmpty(pData.StatePick)) // state abbrev, value collected onchange
{
pData.StateList = getStateList();
}
else
{
pData.StateList = getStateList(pData.StatePick);
}
// assign values to state list items
try
{
SelectListItem si = (SelectListItem)pData.StateList.SelectedValue;
pData.state = si.Value;
pData.StatePick = si.Value;
}
catch { }
}
return View(pData);
}
}
pickState.cshtml ...
@model MyProject.Models.MyModel
@{
ViewBag.Title = "United States of America";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>@ViewBag.Title - Where are you...</h2>
@using (Html.BeginForm()) {
@Html.AntiForgeryToken()
@Html.ValidationSummary(true)
<fieldset>
<div class="editor-label">
@Html.DisplayNameFor(model => model.state)
</div>
<div class="display-field">
@Html.DropDownListFor(m => m.StatePick, Model.StateList, new { OnChange = "state.value = this.value;" })
@Html.EditorFor(model => model.state)
@Html.ValidationMessageFor(model => model.StateList)
</div>
</fieldset>
}
<div>
@Html.ActionLink("Back to List", "Index")
</div>
Moi aussi j'ai aimé la réponse de Jordan et je l'ai mise en œuvre moi-même. Je n'avais besoin que d'abréviations, donc au cas où quelqu'un d'autre aurait besoin de la même chose:
public static IEnumerable<SelectListItem> GetStatesList()
{
IList<SelectListItem> states = new List<SelectListItem>
{
new SelectListItem() {Text="AL", Value="AL"},
new SelectListItem() { Text="AK", Value="AK"},
new SelectListItem() { Text="AZ", Value="AZ"},
new SelectListItem() { Text="AR", Value="AR"},
new SelectListItem() { Text="CA", Value="CA"},
new SelectListItem() { Text="CO", Value="CO"},
new SelectListItem() { Text="CT", Value="CT"},
new SelectListItem() { Text="DC", Value="DC"},
new SelectListItem() { Text="DE", Value="DE"},
new SelectListItem() { Text="FL", Value="FL"},
new SelectListItem() { Text="GA", Value="GA"},
new SelectListItem() { Text="HI", Value="HI"},
new SelectListItem() { Text="ID", Value="ID"},
new SelectListItem() { Text="IL", Value="IL"},
new SelectListItem() { Text="IN", Value="IN"},
new SelectListItem() { Text="IA", Value="IA"},
new SelectListItem() { Text="KS", Value="KS"},
new SelectListItem() { Text="KY", Value="KY"},
new SelectListItem() { Text="LA", Value="LA"},
new SelectListItem() { Text="ME", Value="ME"},
new SelectListItem() { Text="MD", Value="MD"},
new SelectListItem() { Text="MA", Value="MA"},
new SelectListItem() { Text="MI", Value="MI"},
new SelectListItem() { Text="MN", Value="MN"},
new SelectListItem() { Text="MS", Value="MS"},
new SelectListItem() { Text="MO", Value="MO"},
new SelectListItem() { Text="MT", Value="MT"},
new SelectListItem() { Text="NE", Value="NE"},
new SelectListItem() { Text="NV", Value="NV"},
new SelectListItem() { Text="NH", Value="NH"},
new SelectListItem() { Text="NJ", Value="NJ"},
new SelectListItem() { Text="NM", Value="NM"},
new SelectListItem() { Text="NY", Value="NY"},
new SelectListItem() { Text="NC", Value="NC"},
new SelectListItem() { Text="ND", Value="ND"},
new SelectListItem() { Text="OH", Value="OH"},
new SelectListItem() { Text="OK", Value="OK"},
new SelectListItem() { Text="OR", Value="OR"},
new SelectListItem() { Text="PA", Value="PA"},
new SelectListItem() { Text="PR", Value="PR"},
new SelectListItem() { Text="RI", Value="RI"},
new SelectListItem() { Text="SC", Value="SC"},
new SelectListItem() { Text="SD", Value="SD"},
new SelectListItem() { Text="TN", Value="TN"},
new SelectListItem() { Text="TX", Value="TX"},
new SelectListItem() { Text="UT", Value="UT"},
new SelectListItem() { Text="VT", Value="VT"},
new SelectListItem() { Text="VA", Value="VA"},
new SelectListItem() { Text="WA", Value="WA"},
new SelectListItem() { Text="WV", Value="WV"},
new SelectListItem() { Text="WI", Value="WI"},
new SelectListItem() { Text="WY", Value="WY"}
};
return states;
}