2

Tenho um form bem simples com 3 textbox e um botão. Gostaria de pegar o valor dos dois primeiros textbox ao clicar no botão e passar para um método presente no meu model e depois disso retornar esse resultado para o terceiro textbox. Estou com dificuldade de passar os valores e retornar utilizando o controller. Sou iniciante em Asp.net mvc, se alguém puder ajudar. Obrigado.

Tenho essa método do Model que quero usar:

public class Conta
{
    [Required]
    public int Num1 { get; set; }
    [Required]
    public int Num2 { get; set; }
    public double Result { get; set; }

    public int Somar(int num1, int num2)
    {
        return num1 + num2;
    }

Isso no controller:

 public ActionResult Index()
    {
        return View();
    }

    private static Conta _conta = new Conta();
    [HttpPost]
    public ActionResult Somar(Conta conta)
    {
        _conta.Somar(conta.Num1, conta.Num2);
        return View();
    }

E isso na index:

<tr>
    <td>@Html.TextBoxFor(ContaModel => ContaModel.Num1)</td>
</tr>
<tr>
    <td>@Html.TextBoxFor(ContaModel => ContaModel.Num2)</td>
</tr>
<tr>
    <td><input type ="submit" value="Somar" name="Somar"/></td>
</tr>

</table>

Como sou iniciante nisso, não sei se esse é o jeito certo de se fazer.

4

2 Respostas 2

2

Há algumas coisas sem sentido no seu exemplo. Vamos a elas:

private static Conta _conta = new Conta();

Você não precisa inicializar um Model fora de uma Action de um Controller. Não há qualquer utilidade nisto, sendo que o papel de um Model é representar dados.

Inicialmente Models são objetos anêmicos (apenas com propriedades), mas podem conter algumas regras internas, validações e atributos.

Esta parte está ok:

public ActionResult Index()
{
    return View();
}

Já esta parte, se o objetivo é mostrar algo na tela, você deve enviar o objeto que será mostrado para a tela. Assim como está isto não acontece:

[HttpPost]
public ActionResult Somar(Conta conta)
{
    _conta.Somar(conta.Num1, conta.Num2);
    return View();
}

Além disso, você está instanciando um Model para realizar operações de dois parâmetros de outro Model que implementa a mesma classe. Não faz qualquer sentido.

O correto seria algo assim:

conta.Somar(conta.Num1, conta.Num2);

Melhor ainda seria não precisar passar parâmetro algum, afinal as propriedades são do próprio objeto:

public void Somar()
{
    this.Result = this.Num1 + this.Num2;
}

Ou seja, o método ficaria assim:

conta.Somar();

Claro que para Result ser apenas um campo calculado, algo a mais precisa ser anotado:

public class Conta
{
    [Required]
    public int Num1 { get; set; }
    [Required]
    public int Num2 { get; set; }
    [NotMapped]
    public double Result { get; set; }

    public void Somar()
    {
        this.Result = this.Num1 + this.Num2;
    }
}

[NotMapped] diz ao contexto que o campo não deve ser mapeado em banco de dados, ou seja, que a propriedade existe na classe mas não é uma coluna de uma tabela ou coleção de um banco de dados.

Voltando ao retorno, feito o cálculo, você precisa mandar o objeto pronto pra View. Isto pode ser feito assim:

[HttpPost]
public ActionResult Somar(Conta conta)
{
    conta.Somar();
    return View(conta);
}

Neste caso, estamos chamando uma View chamada Somar.cstml. Ela precisa ser mais ou menos assim:

@model MeuProjeto.Models.Conta

<div>
    Num1: @Model.Num1
</div>
<div>
    Num2: @Model.Num2
</div>
<div>
    Soma: @Model.Result
</div>

Se você quiser mandar o resultado para outra View, especifique como primeiro argumento o nome desta View:

[HttpPost]
public ActionResult Somar(Conta conta)
{
    conta.Somar();
    return View("OutraView", conta);
}

Neste caso, o resultado será impresso usando uma View cujo arquivo é OutraView.cshtml.

2
1

Aqui segue uma alternativa a resposta do Cigano (que por sinal é bem completa):

Aqui estarei utilizando uma requisição AJAX para realizar a soma e retornar o valor.

Model

using System;
using System.ComponentModel.DataAnnotations;

namespace MvcApp
{
    public class Conta
    {
        [Required]
        public int Num1 { get; set; }
        [Required]
        public int Num2 { get; set; }
        public int Result { get; set; }

        public int Somar()
        {
            this.Result = this.Num1 + this.Num2;
            return this.Result;
        }
    }
}

Controller

using System;
using System.Web.Mvc;
using System.Collections.Generic;

namespace MvcApp
{
    public class HomeController : Controller
    {
        [HttpGet]
        public ActionResult Index()
        {
            return View(new Conta());
        }


        [HttpPost]
        public JsonResult Soma(Conta conta)
        {   
            conta.Somar();
            return Json(conta);
        }
    }
}

View

@model MvcApp.Conta
@{
    Layout = null;
}

<!DOCTYPE html>
<!-- template from http://getbootstrap.com/getting-started -->

<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <script type="text/javascript">
            var virtualPath = "@Url.Content("~/")";
        </script>
    </head>

    <body>
        <div class="container">
            <div>
                @Html.LabelFor(Model => Model.Num1)
                @Html.TextBoxFor(Model => Model.Num1)
            </div>
            <div>
                @Html.LabelFor(Model => Model.Num2)
                @Html.TextBoxFor(Model => Model.Num2)
            </div>
            <div>
                @Html.LabelFor(Model => Model.Result)
                @Html.TextBoxFor(Model => Model.Result, new { @readonly = "readonly", @disabled = "disabled" })
            </div>
            <div>
                <input type ="button" value="Somar" name="Somar"/>
            </div>
        </div>
        <script type="text/javascript">
            var form = {};
            window.onload = function() {
                form.Num1 = document.querySelector("[name='Num1']");
                form.Num2 = document.querySelector("[name='Num2']");
                form.Result = document.querySelector("[name='Result']");
                form.Somar = document.querySelector("[name='Somar']");

                form.Somar.onclick = function (event) {
                    event.stopPropagation();
                    event.preventDefault();
                    somar();
                };
            }

            var urlParameters = function(json) {
                var params = "";
                for (var key in json) {
                    var value = json[key];
                    params += "&" + encodeURIComponent(key) + '=' + encodeURIComponent(value);
                }
                return params.substring(1);
            }

            var somar = function () {
                var conta = {
                    Num1: form.Num1.value,
                    Num2: form.Num2.value,
                    Result: form.Result.value
                };
                var params = urlParameters(conta);

                var xmlHttp = new XMLHttpRequest();
                xmlHttp.open("POST", virtualPath + "Home/Soma", true);
                xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

                xmlHttp.onreadystatechange = function() {
                    if(xmlHttp.readyState == 4 && xmlHttp.status == 200) {
                        var conta = JSON.parse(xmlHttp.responseText);
                        form.Result.value = conta.Result;
                    }
                }
                xmlHttp.send(params);
            }

        </script>
    </body>
</html>

DotNetFiddle

3
  • Boa resposta. +1. Commented 20/03/2015 às 20:20
  • @CiganoMorrisonMendez, não faço ideia pq a minha resposta foi escolhida e não a sua. Commented 24/03/2015 às 11:00
  • Eu também não, mas nem faço mais questão de entender. Commented 24/03/2015 às 13:45

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 .