Compliquer une primitive avec des champs masqués pour clarifier si False ou Null n'est pas recommandé.
La case à cocher n'est pas ce que vous devriez utiliser - elle n'a en réalité qu'un seul état: cochée . Sinon, ça pourrait être n'importe quoi.
Lorsque votre champ de base de données est un booléen Nullable ( bool?
), l'UX doit utiliser 3-Radio Buttons, où le premier bouton représente votre "Checked", le deuxième bouton représente "Not Checked" et le troisième bouton représente votre null, quelle que soit la sémantique de null signifie. Vous pouvez utiliser une <select><option>
liste déroulante pour enregistrer des biens immobiliers, mais l'utilisateur doit cliquer deux fois et les choix ne sont pas aussi clairs instantanément.
1 0 null
True False Not Set
Yes No Undecided
Male Female Unknown
On Off Not Detected
La RadioButtonList, définie comme une extension nommée RadioButtonForSelectList, crée les boutons radio pour vous, y compris la valeur sélectionnée / cochée, et définit le <div class="RBxxxx">
afin que vous puissiez utiliser css pour rendre vos boutons radio horizontaux (affichage: bloc en ligne), vertical ou sous forme de tableau (affichage: bloc en ligne; largeur: 100px;)
Dans le modèle (j'utilise string, string pour la définition du dictionnaire comme exemple pédagogique. Vous pouvez utiliser bool ?, string)
public IEnumerable<SelectListItem> Sexsli { get; set; }
SexDict = new Dictionary<string, string>()
{
{ "M", "Male"},
{ "F", "Female" },
{ "U", "Undecided" },
};
//Convert the Dictionary Type into a SelectListItem Type
Sexsli = SexDict.Select(k =>
new SelectListItem
{
Selected = (k.Key == "U"),
Text = k.Value,
Value = k.Key.ToString()
});
<fieldset id="Gender">
<legend id="GenderLegend" title="Gender - Sex">I am a</legend>
@Html.RadioButtonForSelectList(m => m.Sexsli, Model.Sexsli, "Sex")
@Html.ValidationMessageFor(m => m.Sexsli)
</fieldset>
public static class HtmlExtensions
{
public static MvcHtmlString RadioButtonForSelectList<TModel, TProperty>(
this HtmlHelper<TModel> htmlHelper,
Expression<Func<TModel, TProperty>> expression,
IEnumerable<SelectListItem> listOfValues,
String rbClassName = "Horizontal")
{
var metaData = ModelMetadata.FromLambdaExpression(expression, htmlHelper.ViewData);
var sb = new StringBuilder();
if (listOfValues != null)
{
// Create a radio button for each item in the list
foreach (SelectListItem item in listOfValues)
{
// Generate an id to be given to the radio button field
var id = string.Format("{0}_{1}", metaData.PropertyName, item.Value);
// Create and populate a radio button using the existing html helpers
var label = htmlHelper.Label(id, HttpUtility.HtmlEncode(item.Text));
var radio = String.Empty;
if (item.Selected == true)
{
radio = htmlHelper.RadioButtonFor(expression, item.Value, new { id = id, @checked = "checked" }).ToHtmlString();
}
else
{
radio = htmlHelper.RadioButtonFor(expression, item.Value, new { id = id }).ToHtmlString();
}// Create the html string to return to client browser
// e.g. <input data-val="true" data-val-required="You must select an option" id="RB_1" name="RB" type="radio" value="1" /><label for="RB_1">Choice 1</label>
sb.AppendFormat("<div class=\"RB{2}\">{0}{1}</div>", radio, label, rbClassName);
}
}
return MvcHtmlString.Create(sb.ToString());
}
}