Javascript return result to Controller

Question

Good afternoon.

I have a page with a multselect in jquery (Link). In this multselect there are 2 list, one with all the calories and the other with the selected values.

When editing this registration, select the values you want to assign to the "client" and save.

My problem is right here, when saving I can’t receive the selected data in this multiselect to pass to my Controller.

VIEW:

<div class="row clearfix">
<div class="col-md-12">
    <div class="card">
        <div class="header">
            <h2>
                Especialidades
                <small>Especialidades do cliente.</small>
            </h2>
        </div>
        <div class="body">
            <select id="my-select" multiple='multiple' name="especialidades">


                @foreach (var item in Model.Especialidade_NSelecionada)
                {
                    <option value='@item.idespecialidade'>@item.Nome</option>
                }

                @foreach (var item in Model.Especialidade_Selecionada)
                {
                    <option value='@item.idespecialidade' selected  name="especialidades">@item.Nome</option>

                }

            </select>
        </div>
    </div>
</div>

Jquery:

    <script type="text/javascript">
        // run pre selected options
    $('#my-select').multiSelect()
    </script>

Controller:

[HttpPost]
    public ActionResult Editar(Model_Cliente cli)
    {
        if (ModelState.IsValid)
        {
            var id = cli.idcliente.ToString();
            var crm = cli.CRM;
            var nome = cli.Nome;
            var email = cli.Email;
            var aniversario_m = cli.Aniversario_m;
            var endereco = cli.Endereco;
            var num = cli.Num;
            var cidade = cli.Cidade;
            var bairro = cli.Bairro;
            var uf = cli.UF;
            var fone_celular = cli.Fone_Celular;
            var fone1 = cli.Fone1;
            var fone2 = cli.Fone2;
            var contato = cli.Contato;
            var aniversario_c = cli.Aniversario_c;
            var hora_in = cli.Horario_In;
            var hora_out = cli.Horario_Out;
            var obs = cli.Observacoes;
            //aqui esta vindo vazio:
            var especialidades = cli.Especialidade_Selecionada;

            return RedirectToAction("Index");
        }
        return View(cli);
    }

I’m terrible with java and have no idea how to receive the data selected by multiselect, I appreciate any help.

Example image of multselect: enter image Description here

Answer 1

You have to store the data in an array, then either send by POST or Xmlhttprequest, with the following code you can know which ones are selected:

     $('#my-select').multiSelect({
      afterSelect: function(values){
        alert("Valor seleccionado: "+values);
       //Addicionar ao array
      },
      afterDeselect: function(values){
        alert("Valor desselecionado: "+values);
      //Remover do array
      }
    });