SelectListItem with custom attributes

Question

SelectListItem with custom attributes

Navigation

#1 by (3 votes)
#2 by (2 votes)

2

I created a DropDownList using the method below:

private void PopulateDropDown() {
  //Chamo o método que obtém a lista de clientes da API
  List<Models.Cliente> clientes = new Business.Cliente().Get();

  //Rotorno a lista de clientes para a view
  ViewData["Clientes"] = new SelectList(clientes, "Id", "Nome", "IdGrupoCliente");

}

Client Class:

public class Cliente{
  public int Id { get; set; }
  public string Nome { get; set; }
  public int IdGrupoCliente { get; set; }
}

View:

<div class="input-group">
   <span class="input-group-addon addon-no-border">
      Selecione o cliente:
    </span>
   @Html.DropDownList("IdCliente", (SelectList)ViewData["Clientes"], new { @class = "form-control" })
</div>

I need to create a custom attribute in options of my select , however I'm not sure how to do this. My idea was to add data-IdGrupoCliente as in the example below:

<select class="form-control" id="IdCliente" name="IdCliente">
   <option value="1" data-IdGrupoCliente="10">Cliente Abc</option>
</select>

c# asp.net-mvc

asked by anonymous 05.02.2018 / 21:49

2 answers

2

The solution I found was to pass the client list through viewData[] and create <select> directly into View .

ViewData["Clientes"] = new Business.Cliente().Get(idDistribuidor);

I ran the client list with a for filling the <option> with the custom attribute for each iteration:

<div class="panel-body">
 @using (Html.BeginForm("Index", "Importacao", FormMethod.Post, new { enctype = "multipart/form-data" })) {
   @Html.AntiForgeryToken()
   <div class="row">
      <div class="col-sm-5">
         <div class="form-group ">
            <div class="input-group">
               <span class="input-group-addon addon-no-border">
                  Selecione o cliente:
               </span>
               <select name="IdCliente" id="IdCliente" class="form-control">
                  <option value="-1">Selecione</option>
                  @{
           System.Collections.Generic.List<InpartSaude.Negociacao.Models.Cliente> clientes = (System.Collections.Generic.List<InpartSaude.Negociacao.Models.Cliente>)ViewData["Clientes"];
                      for (int i = 0; i < clientes.Count; i++) {
                         <option value="@clientes[i].Id" data-IdGrupoCliente="@cliente[i].IdGrupoCliente">
                            @clientes[i].Nome
                         </option>
                      }
                   }
                </select>
             </div>
          </div>
       </div>
    </div>
 }
</div>

16.02.2018 / 13:05

Create zip file of a folder Excel DISTF Equivalent in R

score 3 · Accepted Answer

You need to keep in mind that not everything can or should be written using HTML Helpers, they serve to make things easier, but in cases where you need more freedom it is better not to use them.

Instead of using a SelectList , use a List<Cliente> simple and create the options of the tag select manually through a loop. >

See an example

Client.cs

public class Cliente
{
    public int Id { get; set; }
    public string Nome { get; set; }
    public int IdGrupoCliente { get; set; } 
}

HomeController.cs

public class HomeController : Controller
{
    private List<Cliente> _clientes = new List<Cliente>
    {
        new Cliente { Id = 1, Nome = "Julius", IdGrupoCliente = 2 },
        new Cliente { Id = 2, Nome = "Chris", IdGrupoCliente = 1 },
        new Cliente { Id = 3, Nome = "Drew", IdGrupoCliente = 2 },
        new Cliente { Id = 4, Nome = "Tonya", IdGrupoCliente = 1 },
        new Cliente { Id = 5, Nome = "Rochelle", IdGrupoCliente = 2 }
    };

    [HttpGet]
    public ActionResult Index()
    {           
        ViewData["Clientes"] = _clientes;
        return View();
    }
}

Index.cshtml

<div class="container">
   <select class="form-control" name="@Html.NameFor(model => model.IdCliente)" id="@Html.IdFor(model => model.IdCliente)">
      @foreach(var cliente in ViewData["Clientes"] as List<Sample.Cliente>)
      {
          <option data-id-grupo-cliente="@cliente.IdGrupoCliente" value="@cliente.Id">@cliente.Nome
          </option>
      }
   <select>     
</div>

See working in .NET Fiddle