Dropdownlist with Begincollectionitem

Question

Goodnight!

Could follow in this same question here, but it would be too long. As it may be another subject I decided to open another question.

I got everything right as per the best answer, but would need to make a change. Each new added field could not be typed. It should be filled with data already registered in the database. Explaining better: In the collection point registration, the user should not create as many types of garbage as he wants, but select the available types of garbage previously registered in the database.

To do so I tried to replace Textboxfor with a Dropdownlist. But each time I try to add a new field the system has an error.

An Exception of type 'System.Argumentnullexception' occurred in System.Web.Mvc.dll but was not handled in user code. Additional information: Value cannot be null.

In the controller I have the code:

 ViewBag.Lixo = db.TipoDeLixo.ToList();

And at Partialview I changed the code:

@Html.TextBoxFor(model => model.TipoDeLixo.NomeTipoLixo, new { @class = "form-control", placeholder = "Nome" })

For:

@Html.ListBox("Id",(SelectList)ViewBag.Lixo)

I tried other forms with Listbox, tried with Listbox without using the Partialviews scheme, tried with Multiselectlist and several other forms.

Without using the Partialviews schema, the system even lists the types of garbage, but then I could not think of how to record the information in the table of Collection point and the associative table (Pontosdecoletatipodelixo).

1)How to make each added field a Dropdownlist?

2)After creating, how would be the best way to edit?

EDIT1: Creation of partial in view Create:

@Html.Partial("_TiposDeLixo", Model.PontosDeColetaTiposDeLixo)

Partial calling the lines _TiposDeLixo:

@model IEnumerable<IdentitySample.Models.PontoDeColetaTipoDeLixo>


<div class="actions">
<a class="btn btn-default btn-sm" id="adicionar-tipo-de-lixo">
    Adicionar Tipo de lixo
</a>
<script type="text/javascript">
    $("#adicionar-tipo-de-lixo").click(function () {
                $.get('/PontosDeColeta/NovaLinhaDeTipoDeLixo', function (template) {
                    $("#area-tipos-de-lixo").append(template);
                    console.log(template);
                });
            });
</script>
</div>

<div id="area-tipos-de-lixo">
@if (Model != null)
{
    foreach (var lixo in Model)
    {
        @Html.Partial("_LinhaTipoDeLixo", lixo);
    }
}
</div>

Partial of the line _LinhaTipoDeLixo:

@model IdentitySample.Models.PontoDeColetaTipoDeLixo


@using (Html.BeginCollectionItem("PontosDeColetaTiposDeLixo"))
{
<div class="form-group">
    @Html.HiddenFor(model => model.Id)
    @Html.HiddenFor(model => model.TipoDeLixoId)

    <label class="col-md-1 control-label">Nome</label>
    <div class="col-md-5">

       @Html.ListBox("Id", new SelectList((List<IdentitySample.Models.TipoDeLixo>)ViewBag.Lixo))

     </div>
    <div class="col-md-2">
        <a class="btn red" onclick="$(this).parent().parent().remove();">Excluir</a>
    </div>
</div>
}

EDIT2:

Controller action calling new line:

 public ActionResult NovaLinhaDeTipoDeLixo()
    {
        return PartialView("_LinhaTipoDeLixo", new PontoDeColetaTipoDeLixo { Id = Guid.NewGuid() });
    }

Answer 1

You didn’t define the ViewBag on the return of Partial. Naturally it will have zero reference error:

public ActionResult NovaLinhaDeTipoDeLixo()
{
    ViewBag.Lixo = db.TiposDeLixo.ToList();
    return PartialView("_LinhaTipoDeLixo", new PontoDeColetaTipoDeLixo { Id = Guid.NewGuid() });
}

Answer 2

Hello, change your code as follows:

@Html.ListBox("Id", new SelectList((List<SeuNamespace.Lixo>)ViewBag.Lixo))

I hope I’ve helped.