3

Boa tarde pessoal, bom sou novo aqui, então peço desculpas por qualquer coisa!

A minha duvida é:

Eu tenho uma tabela de equipamentos, uma de software e uma associativa equipamento-software. A relação ficou (Equipamento) 1 → N (EquipamentoSoftware) N ← 1 (Software), onde um equipamento pode ter vários software, mas aquele equipamentoSoftware está só naquele equipamento, etc;

Eu consegui fazer a parte do crud do equipamento muito boa, porem para cadastrar um Software no equipamento, só consegui fazer em um crud separado.

Gostaria de saber como faço para cadastrar o Equipamento e um equipamentoSoftware (Um software no equipamento) na mesma View.

Vou postar meu código

Model Equipamento:

public partial class tblEquipamento
{
  public tblEquipamento()
  {
    this.tblEquipamentoSoftware = new HashSet<tblEquipamentoSoftware>();
  }

  [Key]
  public int equIdEquipamento { get; set; }
  [Required(ErrorMessage = "Informe o NIP do equipamento!")]
  [Display(Name = "NIP")]
  public string equNip { get; set; }
  public string equNumSerie { get; set; }

  public virtual ICollection<tblEquipamentoSoftware> tblEquipamentoSoftware { get; set; }
}

Model software:

public partial class tblSoftware
{
  public tblSoftware()
  {
    this.tblEquipamentoSoftware = new HashSet<tblEquipamentoSoftware>();
  }
  [Key]
  public int sofIdSoftware { get; set; }
  [Display(Name = "Software")]
  [Required(ErrorMessage = "Informe o nome do Software!")]
  public string sofNome { get; set; }

  public virtual ICollection<tblEquipamentoSoftware> tblEquipamentoSoftware { get; set; }
}

Model EquipamentoSoftware (associativa):

public partial class tblEquipamentoSoftware
    {
        [Key, Column(Order = 0)]
        [Display(Name = "Equipamento")]
        public int eqsIdEquipamento { get; set; }
        [Key, Column(Order = 1)]
        [Display(Name= "Software")]
        public int eqsIdSoftware { get; set; }

        public virtual tblEquipamento tblEquipamento { get; set; }
        public virtual tblSoftware tblSoftware { get; set; }
    }

Cadastrar tudo de uma vez, sem precisar separa um equipamento do equipamentoSoftware. Por favor galera me ajudem e se tiver algo errado, me avisem que eu edito. Estou fazendo no c# junto com o entity framework e pelo ADO.NET Obrigado!

Quero juntar esses dois cruds em um unico formulário ou view

Crud do Equipamento: inserir a descrição da imagem aqui

Crud do equipamentoSoftware: inserir a descrição da imagem aqui

6
  • 1
    Poderia mostrar que crud fez e uma representação visual do resultado pretendido? 8/05/2019 às 16:03
  • Posso sim, colocarei a imagem
    – user7845
    8/05/2019 às 16:14
  • 1
    Vc esta querendo que na hora de cadastrar um equipamento, vc já quer cadastrar o "equipamentoSoftware" junto? Cadastrar tudo de uma vez, é isso?
    – Rafael
    8/05/2019 às 16:23
  • 1
    @user7845, voce precisa fazer uma ViewModel onde ela ira receber as propriedades de ambos os cadastro que quer fazer, assim voce consegue chamar essa model na sua view e colocar os campos para serem preenchidos conforme sua necessidade 8/05/2019 às 17:36
  • 1
    da uma olhada nesse link pt.stackoverflow.com/questions/91021/… 8/05/2019 às 18:05

1 Resposta 1

1

Bom isso se parece muito com um cadastro de item em um pedido, irei fazer de um modo bem resumido, porém não é o único jeito de se fazer ok?

Primeiro em seu controller de Equipamento vamos fazer ele retornar um Json da seguinte maneira:

Obs.: o modo get fica da mesma maneira, quando você criar pelo MVC 5 Controller with views, using Entity Framework.

O seu método create POST será assim:

[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Create(tblEquipamento tblEquipamento)
{ 
   if (ModelState.IsValid)
   {
      db.tblEquipamento.Add(tblEquipamento);
      db.SaveChanges();
   }
     return Json(new { Resultado = tblEquipamento.equIdEquipamento }, JsonRequestBehavior.AllowGet);
}

Agora no na sua view create do Equipamento você poderá apagar o @using (Html.BeginForm()) e adicionará os seguintes códigos:

Um botão para salvar o equipamento:

<div class="form-group">
    <div class="col-md-offset-2 col-md-10">
       <a href="#" onclick="SalvarEquipamento();" class="btn btn-info">Salvar</a>
     </div>
</div>

este botão acionará uma função no seu JavaScript que salvará seu equipamento para criar um Id

Logo abaixo desse código você irá colocar uma div que será "invisível" de início, mas será nela que aparecerá o formulário para cadastrar o software desejado!

<div id="divSoftwares" style="display: none;"></div>

Feito todo esse procedimento,você irá criar um arquivo .js, nele iremos colocar todo nosso JavaScript. Chamei o meu de Equipamento.js, você pode dar o nome que quiser, ok?

O método que irá salvar o equipamento será desse modo, usaremos Ajax:

function SalvarEquipamento() {

    var nip = $("#equNip").val();

    var serie = $("#equNumSerie").val();

    var token = $('input[name="__RequestVerificationToken"]').val();
    var tokenadr = $('form[action="/Equipamento/Create"] input[name="__RequestVerificationToken"]').val();

    var headers = {};
    var headersadr = {};
    headers['__RequestVerificationToken'] = token;
    headersadr['__ResquestVerificationToken'] = tokenadr;

    var url = "/Equipamento/Create";

    $.ajax({
        url: url
        , type: "POST"
        , datatype: "json"
        , headers: headersadr
        , data: {
            equIdEquipamento: 0, equNip: nip, equNumSerie: serie, __RequestVerificationToken: token
        }
        , success: function (data) {
            if (data.Resultado > 0) {
                ListarSoftwares(data.Resultado);
            }
        }
    });
}

Obs.: Este token faz referência ao [ValidateAntiForgeryToken].

Ainda em nosso Equipamento.js você fará um método para fazer a listagem dos softwares que estão sendo cadastrados junto aquele equipamento.

function ListarSoftwares(idEquipamento) {
    var url = "/EquipamentoSoftware/ListarSoftwares";
    $.ajax({
        url: url
        , type: "GET"
        , data: { id: idEquipamento}
        , datatype: "html"
        , success: function (data) {
            var divSoftwares = $("#divSoftwares");
            divSoftwares.empty();
            divSoftwares.show();
            divSoftwares.html(data);
        }
    });
}

Feito isso você irá criar um Controller para o seu EquipamentoSoftware, pode criar um controller Empty mesmo. Nele você colocará um ActionResult que será responsável por fazer a chamada do formulário do EquipamentoSoftware, ficará assim:

public ActionResult ListarSoftwares(int id)
{
   var lista = db.tblEquipamentoSoftware.Where(t => t.tblEquipamento.equIdEquipamento == id);
   ViewBag.eqsIdSoftware = new SelectList(db.tblSoftware, "sofIdSoftware", "sofNome");
   ViewBag.Equipamento = id;
   return PartialView(lista);
 }

Então você criará uma view ListarSoftware, ela será do tipo List, ok?

@model IEnumerable<SistemaCadastroAtivo.Models.tblEquipamentoSoftware>

<div>
    <h4>Softwares</h4>
    <hr/>
    <div class="form-group">
        <label class="control-label col-md-2">Software</label>
        <div class="col-md-10">
            @Html.DropDownList("eqsIdSoftware", null, htmlAttributes: new { @class = "form-control", id = "Software"})
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-md-2">Tipo</label>
        <div class="col-md-10">
            <input type="text" id="Tipo" name="Tipo" placeholder="Informe L p/ Licença ou I p/ instalado" />
        </div>
    </div>
    <div class="form-group">
        <div class="col-md-offset-2 col-md-10">
            <a href="#" onclick="SalvarSoftwaresEquipamento();" class="btn btn-info">Adicionar Software</a>
        </div>
    </div>
</div>

<input type="hidden" id="idEquipamento" value="@ViewBag.Equipamento" />


<table class="table">
    <tr>
        <th>
            @Html.DisplayNameFor(model => model.eqsTipo)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.tblEquipamento.equNip)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.tblSoftware.sofNome)
        </th>
        <th></th>
    </tr>

@foreach (var item in Model) {
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.eqsTipo)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.tblEquipamento.equNip)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.tblSoftware.sofNome)
        </td>
        <td>
            @Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ })
        </td>
    </tr>
}

</table>

Nela você está trazendo o formulário do EquipamentoSoftware e também uma tabela para a listagem dos softwares que estão sendo cadastrados a este equipamento.

Você deve ter percebido um botão para salvar os softwares, logo você fará o método no Equipamento.js da seguinte maneira:

function SalvarSoftwaresEquipamento() {
    debugger;
    var idSoftware = $("#Software").val();
    var tipo = $("#Tipo").val();
    var idEquipamento = $("#idEquipamento").val();

    var url = "/EquipamentoSoftware/SalvarSoftwares";

    $.ajax({
        url: url
        , data: { idSoftware: idSoftware, tipo: tipo, idEquipamento: idEquipamento }
        , type: "GET"
        , datatype: "json"
        , success: function (data) {
            if (data.Resultado > 0) {
                debugger;
                ListarSoftwares(idEquipamento);
            }
        }
    })
}

E por fim lá em seu EquipamentoSoftwareController você fará isso:

public ActionResult SalvarSoftwares(int idEquipamento, int idSoftware, string tipo)
{
   var equipamentoSoftware = new tblEquipamentoSoftware()
   {
     tblEquipamento = db.tblEquipamento.Find(idEquipamento), 
     tblSoftware = db.tblSoftware.Find(idSoftware),
     eqsTipo = tipo
   };

    db.tblEquipamentoSoftware.Add(equipamentoSoftware);
    db.SaveChanges();   
    return Json(new { Resultado = equipamentoSoftware.eqsIdEquipamento }, JsonRequestBehavior.AllowGet);
}

Obs.: É necessário que você ja tenha feito o crud dos softwares, para poder trazer para a view do equipamento.

Sua tela ficará desse modo:

inserir a descrição da imagem aqui

Ao clicar em salvar aparecerá o formulário do EquipamentoSoftware:

inserir a descrição da imagem aqui

Fonte: https://www.youtube.com/watch?v=_z7BYLM3Lus

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .