How to get the value of a Dropdownlist to choose the action to execute

1

I ask your help in helping me put the following situation together:

I have a structure in EF database first where I have a type that the user must select and after selecting this type in the dropdownlist it must trigger a corresponding action. For example:

If on the Dropdonwlist is blank, nothing happens, if the user select for example import file, it should present in the view an input file where I will fetch the file and after clicking on submit will execute the corresponding action in the controller. >

Now if the user selects for example export, he should present in the view a list of the files available for him to download, and if the user selects question for example, he should assemble a form to send an email.

Today scaffold that VS mounted, and already adapting I put the following structure in create:

public ActionResult Create()
{
  tbCliente usrCliente = _repositorio.ObterCliente(this.User.Identity.Name);
  SelectList(db.tbCliente, "IdCliente", "Nome");
  ViewBag.idTipoServico = new SelectList(db.TipoServicoes, "idTipoServico", "TipoServico1");
  return View();
}
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Create([Bind(Include = "idSolicitacao,idCliente,idTipoServico,idAviso,DataSolicitacao,AvisoEncaminhado,AvisoLido")] Solicitacao solicitacao)
{
  tbCliente usrCliente = _repositorio.ObterCliente(this.User.Identity.Name);
  if (ModelState.IsValid)
  {
    solicitacao.idCliente = usrCliente.IdCliente;
    solicitacao.idAviso = 2;
    solicitacao.AvisoEncaminhado = 1;
    solicitacao.AvisoLido = 0;
    solicitacao.DataSolicitacao = DateTime.Now;
    solicitacao.idStatus = 1;
    db.Solicitacaos.Add(solicitacao);
    db.SaveChanges();
    return RedirectToAction("Index");
  }
  SelectList(db.tbCliente, "IdCliente", "Nome", solicitacao.idCliente);
        ViewBag.idTipoServico = new SelectList(db.TipoServicoes, "idTipoServico", "TipoServico1", solicitacao.idTipoServico);
  return View(solicitacao);
}

In my view it looks like this, but it would have to make it work the way I mentioned above.

@model FlowTec.Models.Solicitacao
@{
   ViewBag.Title = "Create";
   Layout = "~/Areas/Clientes/Views/Shared/_Layout.cshtml";
 }
 <h2>Create</h2>
 @using (Html.BeginForm()) 
 {
 @Html.AntiForgeryToken()
 <div class="form-horizontal">
    <h4>Solicitacao</h4>
    <hr />
    @Html.ValidationSummary(true)
    <div class="form-group">
        @Html.LabelFor(model => model.idTipoServico, "idTipoServico", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("idTipoServico", String.Empty)
            @Html.ValidationMessageFor(model => model.idTipoServico)
        </div>
    </div>

    <div class="form-group">
        <div class="col-md-offset-2 col-md-10">
            <input type="submit" value="Create" class="btn btn-default" />
        </div>
    </div>
</div>
}
<div>
   @Html.ActionLink("Back to List", "Index")
</div>

Mapping of the request table made by EF.

namespace Empresa.Models
{
using System;
using System.Collections.Generic;

public partial class Solicitacao
{
    [System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Usage", "CA2214:DoNotCallOverridableMethodsInConstructors")]
    public Solicitacao()
    {
        this.tbArquivoes = new HashSet<tbArquivo>();
    }

    public int idSolicitacao { get; set; }
    public int idCliente { get; set; }
    public int idTipoServico { get; set; }
    public int idAviso { get; set; }
    public System.DateTime DataSolicitacao { get; set; }
    public byte AvisoEncaminhado { get; set; }
    public byte AvisoLido { get; set; }
    public int idStatus { get; set; }

    public virtual Aviso Aviso { get; set; }
    public virtual tbCliente tbCliente { get; set; }
    public virtual TipoServico TipoServico { get; set; }
    [System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Usage", "CA2227:CollectionPropertiesShouldBeReadOnly")]
    public virtual ICollection<tbArquivo> tbArquivoes { get; set; }
    public virtual StatusSolicitacao StatusSolicitacao { get; set; }
    }
}

Does anyone have any idea how I can put this as dynamically as possible. What do I need to do?

    
asked by anonymous 07.01.2016 / 17:59

1 answer

1

In summary, jQuery, Ajax and Partials .

Explaining more, idTipoServico should be monitored by jQuery. Something like this:

$(document).on("change", "#idTipoServico", function() {
    switch ($(this).val()) {
        case 1:
            // Executa alguma coisa
            break;
        case 2:
            // Executa outra coisa
            break;           
        default:
            // Ação default
            break; 
    }
});

Each action will popularize your screen in a different way. For each, it is good practice to implement an Action in Controller to return the Partial corresponding to the service type:

    public ActionResult BlocoImportarArquivo()
    {
        return PartialView("_ImportarArquivo", new ViewModelDaImportacaoDeArquivo { Id = Guid.NewGuid() });
    }

In Partial you put in whatever HTML you need. Avoid putting JS in order not to become a mess.

Returning to the code of switch , the following block inserts the HTML of a Partial generated in Controller within a <div> in View (this can be placed in Partial if you want):

$.get('/MeuController/BlocoImportarArquivo', function (template) {
    $("#div-do-bloco").append(template);
});
    
07.01.2016 / 19:07