129 votes

Obtenir la valeur d'une case à cocher en ASP.NET MVC 4

Je travaille sur une application ASP.NET MVC 4. Cette application comporte un formulaire de base. Le modèle de mon formulaire ressemble à ce qui suit :

public class MyModel
{
    public string Name { get; set; }
    public bool Remember { get; set; }
}

Dans mon formulaire, j'ai le HTML suivant.

<input id="Name" name="Name" type="text" value="@Model.Name" />
<input id="Remember" name="Remember" type="checkbox" value="@Model.Remember" />
<label for="Remember">&nbsp;Remember Me?</label>

Lorsque je poste le formulaire, la valeur Remember dans le modèle est toujours fausse. Cependant, la propriété Name du modèle a une valeur. J'ai testé cela en mettant un point d'arrêt dans ce qui suit :

[HttpPost]
public ActionResult MyAction(MyModel model)
{
  Console.WriteLine(model.Remember.ToString());
}

Je n'arrive pas à comprendre. Pourquoi la valeur de la case à cocher n'est-elle pas définie ?

228voto

webdeveloper Points 8205
@Html.EditorFor(x => x.Remember)

Générera :

<input id="Remember" type="checkbox" value="true" name="Remember" />
<input type="hidden" value="false" name="Remember" />

Comment cela fonctionne-t-il ?

  • Si checkbox n'est pas cochée, le formulaire ne soumet que l'élément hidden valeur (faux)
  • Si cette option est cochée, le formulaire soumet deux champs (false et true) et MVC définit les paramètres suivants true pour le modèle bool propriété

<input id="Remember" name="Remember" type="checkbox" value="@Model.Remember" />

Cette option enverra toujours la valeur par défaut, si elle est cochée.

73voto

Dan Saltmer Points 1016

Puisque vous utilisez Model.Name pour définir la valeur. Je suppose que vous passez un modèle de vue vide à la vue.

Ainsi, la valeur de Remember est false, et définit la valeur de l'élément checkbox à false. Cela signifie que lorsque vous sélectionnez la case à cocher, vous enregistrez la valeur "false" dans le formulaire. Si vous ne la sélectionnez pas, elle n'est pas affichée et le modèle prend la valeur false par défaut. C'est pourquoi vous voyez une valeur fausse dans les deux cas.

La valeur n'est transmise que lorsque vous cochez la case de sélection. Pour faire une case à cocher en Mvc, utilisez

@Html.CheckBoxFor(x => x.Remember)

ou si vous ne voulez pas lier le modèle à la vue.

@Html.CheckBox("Remember")

Le Mvc fait de la magie avec un champ caché pour faire persister les valeurs lorsqu'elles ne sont pas sélectionnées.

Edit, si vous avez vraiment une aversion à faire cela et que vous voulez générer l'élément vous-même, vous pouvez le faire.

<input id="Remember" name="Remember" type="checkbox" value="true" @(Model.Remember ? "checked=\"checked\"" : "") />

17voto

Bekir Topuz Points 171

Utilisez uniquement ce

$("input[type=checkbox]").change(function () {
    if ($(this).prop("checked")) {
        $(this).val(true);
    } else {
        $(this).val(false);
    }
});

5voto

Robert Points 1649

Au lieu de

 <input id="Remember" name="Remember" type="checkbox" value="@Model.Remember" />

utiliser :

 @Html.EditorFor(x => x.Remember)

Vous obtiendrez une case à cocher spécifique à l'option "Se souvenir".

4voto

Yini Yin Points 75

Ok, la case à cocher est un peu bizarre. Lorsque vous utilisez l'aide Html, elle génère deux entrées de case à cocher dans le balisage, et les deux sont transmises comme une paire nom-valeur de IEnumerable si elle est cochée.

S'il n'est pas vérifié dans le balisage, il est transmis uniquement dans l'entrée cachée qui a la valeur de false.

Donc, par exemple, sur le balisage, vous avez :

      @Html.CheckBox("Chbxs") 

Et dans l'action du contrôleur (assurez-vous que le nom correspond au nom du paramètre de la case à cocher dans le contrôleur) :

      public ActionResult Index(string param1, string param2,
      string param3, IEnumerable<bool> Chbxs)

Ensuite, dans le contrôleur, vous pouvez faire des choses comme :

      if (Chbxs != null && Chbxs.Count() == 2)
        {
            checkBoxOnMarkup = true;
        }
        else
        {
            checkBoxOnMarkup = false;
        }

Je sais que ce n'est pas une solution élégante. J'espère que quelqu'un ici pourra me donner quelques conseils.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X