none
MVC 5, Dropdownlist e checkboxes criadas dinâmicamente. RRS feed

  • Pergunta

  • Boa Tarde.

    Gostaria de saber se é possível fazer um formulário onde o usuário possa duplicar campos ao fazer um clique no botão, caso seja possível, como faço para fazer o "binding" destes novos campos no controller ?

    Ex.: Tenho uma tela de cadastro de projetos com algumas inputs, uma Dropdownlist (ddl), 3 checkboxes e dois btns (adicionar e remover).
    Ao fazer o clique no botão adicionar, gostaria de adicionar outra DDL e 3 checkboxes (Analogamente, ao clicar no botão remover, eu removeria  estes campos)
     


    segunda-feira, 29 de fevereiro de 2016 19:40

Todas as Respostas

  • Eu fiz algo parecido porém tive que fazer na mão o binding desses elementos, e no servidor eu recebia os dados utilizando FormCollection:

    public ActionResult SaveFailNotificationReport(FormCollection frm)
            {
                try
                {
                    string id = frm["Id"]; // atributo name do input no form
    ...

    No javascript minha funcao de adicionar elementos era algo parecido com isso:

    function addVolumeButtonClick(e){
        var sequencial = guid(); //esse sequencial eu uso para separar por grupos os elemetos adicionados (nada mais eh que o datetime em milisegundos)...
        var ElDateTimeMeasurement = $("<input name='Volume_DateTimeMeasurement_"+sequencial+"' required='required' validationmessage='Data é obrigatório' style='margin-right:70px;'/>");
        var ElDeclared = $("<input name='Volume_Declared_"+sequencial+"' required='required' validationmessage='Volume Declarado é obrigatório'/>");
        var ElRegistred = $("<input name='Volume_Registred_"+sequencial+"' required='required' validationmessage='Volume Registrado é obrigatório'/>");
    
        var li = $("<li />");
        li.append("<label for='Volume_DateTimeMeasurement_"+sequencial+"' title='Data para considerar o valor medido' class='k-state-border-down'>Data:</label>");
        li.append(ElDateTimeMeasurement);
        li.append("<label for='Volume_Declared_"+sequencial+"' title='Volume Bruto corrigido declarado de petróleo (em m3) ou de gás (em mil m3)'>Volume Declarado (petróleo - m³; gás - 10³ m³):</label>");
        li.append(ElDeclared);
        li.append("<label for='Volume_Registred_"+sequencial+"' title='Volume Bruto corrigido registrado de petróleo (em m3) ou de gás (em mil m3)'>Volume Registrado (petróleo - m³; gás - 10³ m³):</label>");
        li.append(ElRegistred);
        li.append("<button class='k-primary k-button' type='button' data-role='button' role='button' aria-disabled='false' tabindex='0' style='background:red; margin-left: 70px' onclick='removeLi(this)'>Remover</button>");
    
        $(e.sender.element).closest(".fieldlist").append(li);
    
        //é importante inicializar os kendo dps de adicionar os elementos no DOM, pois senão eles nao ficarao formatados corretamente.
        ElDateTimeMeasurement.kendoDateTimePicker({"format":"dd/MM/yyyy HH:mm:ss","min":new Date(1900,0,1,0,0,0,0),"max":new Date(2099,11,31,0,0,0,0),"interval":30});
        ElDeclared.kendoNumericTextBox({"format":"#.000000","decimals":6, "spinners":false});
        ElRegistred.kendoNumericTextBox({"format":"#.000000","decimals":6, "spinners":false});
    }


    Att. Andre de Mattos Ferraz - www.iamferraz.com.br - http://mbsy.co/ldecrespigny/19022985

    • Sugerido como Resposta Renilson Andrade segunda-feira, 29 de fevereiro de 2016 20:54
    • Não Sugerido como Resposta Renilson Andrade segunda-feira, 29 de fevereiro de 2016 20:54
    segunda-feira, 29 de fevereiro de 2016 20:03