@Html.DropDownList largeur

Q: Comment définir la largeur de @Html.DropDownList (et pas dans le css)? 

@Html.DropDownList("ListId", String.Empty, new {style="width: 250px;"})  @* no go!*@
InformationsquelleAutor genxgeek | 2011-09-30
  1. 70

    Le deuxième argument de la DropDownList helper doit être un IEnumerable<SelectListItem>. Vous passez une chaîne vide pour être plus précis). Donc pour utiliser cette aide, vous aurez à respecter sa signature:

    @Html.DropDownList(
    "ListId", 
    Enumerable.Empty<SelectListItem>(), 
    new { style = "width: 250px;" }
)

    Évidemment de générer un vide liste déroulante est de peu d'utilité. Vous avez probablement un modèle de vue (vous devriez d'ailleurs) que vous souhaitez utiliser pour lier:

    @Html.DropDownList(
    "ListId", 
    Model.MyList, 
    new { style = "width: 250px;" }
)

    et bien sûr, parce que vous avez un modèle de vue, vous devriez préférer l'utilisation de la DropDownListFor helper:

    @Html.DropDownListFor(
    x => x.ListId, 
    Model.MyList, 
    new { style = "width: 250px;" }
)

    et enfin, pour éviter d'encombrer votre HTML avec des styles que vous devez utiliser une CSS externe:

    @Html.DropDownListFor(
    x => x.ListId, 
    Model.MyList, 
    new { @class = "mycombo" }
)

    où dans votre CSS externe, vous définissez la .mycombo règle:

    .mycombo {
    width: 250px;
}

    Maintenant, vous avez ce que je considère comme un bon code.

    • $$$....merci!!!!!!
    • Est-il possible de remplacer le Modèle.MyList avec ViewBag en quelque sorte ?
    • oui, c'est possible, mais pas quelque chose que je recommanderais. À l'aide d'un modèle de vue est une bien meilleure approche.
    • Si c'est enfermé à l'intérieur, disons un bootstrap de contrôle, vous devez définir la largeur comme "width: 250px !important;" pour être appliquée.
    InformationsquelleAutor Darin Dimitrov
  2. 4

    Vous devez utiliser le Modèle de Vue de l'approche. Cependant la manière paresseuse est juste pour donner le 2e paramètre une valeur null. 

    @Html.DropDownList("ListId", null, new {style="width: 250px;"})
    InformationsquelleAutor Tyriddik
  3. 2
     @Html.DropDownListFor(model => model.Test,
 new SelectList(new List<YourNamespace.Modelname>(), "Id", "Name"), 
 null, new { @id = "ddlTest", @style="width: 250px;" })
    InformationsquelleAutor Thulasiram
  4. 1

    Il y a un jquery technique qui vous permet de définir la largeur sans avoir à traiter avec le @Html.DropDownList constructeur.

    <script language="javascript" type="text/javascript">
    $(document).ready(function () {
        $("#ListId").width(300);
    });
</script>
    InformationsquelleAutor Tarzan