Open another page in JQuery modal

Question

Open another page in JQuery modal

Navigation

#1 by (1 votes)
#2 by (0 votes)

0

I have a problem that I can not resolve in any way. Well, I have a project in Asp.NET MVC as follows: Home Model

public class Objeto
    {
        public Objeto()
        {
        }
        public Objeto(string nome, double valor, double percentual)
        {
            Nome = nome;
            Valor = valor;
            Percentual = percentual;
        }
        public string Nome{ get; set; }
        public double Valor { get; set; }
        public double Percentual { get; set; }
    }

Controller

public class HomeController : Controller
{
      public ActionResult Index()
      {
          return View();
      }

      [HttpPost]
      public ActionResult Dados(Objeto teste)
      {
          return View(dados);
      }
}

View Index:

@using (Ajax.BeginForm("Dados", "Home", new AjaxOptions { OnSuccess = "Sucesso()", OnComplete = "unlockPage()", OnBegin = "lockPage()", OnFailure = "ajaxHandleError" }, new { @id = "meuForm" }))
{
    @Html.LabelFor(model => model.Nome)
    <br />
    @Html.TextBoxFor(model => model.Nome)
    <br />
    <br />
    @Html.LabelFor(model => model.Valor)
    <br />
    @Html.TextBoxFor(model => model.Valor)
    <br />
    <br />
    @Html.LabelFor(model => model.Percentual)
    <br />
    @Html.TextBoxFor(model => model.Percentual)
    <br />
    <br />
    <input type="submit" value="Enviar" />
}

View Data

<label>Os dados inseridos foram:</label>
@Model.Nome
<br />
@Model.Valor
<br />
@Model.Percentual
<br />

Well, what I need is to display View Dados within View Index in popup or modal , using Jquery or Telerik , but data must come from controller , previously sent via POST by page Index .

jquery ajax mvc asp.net-mvc telerik

asked by anonymous 13.04.2015 / 17:03

2 answers

0

Why do not you wear a viewbag?

 ViewBag.variavelQueVoceQuerMandarParaAView = "teste";

On the screen you use it like this:

@ViewBag.variavelQueVoceQuerMandarParaAView

13.04.2015 / 17:15

Problems with PHP 5.2 [closed] Unity Error CS0103: The name 'newRotation' does not exist in the current context [closed]

score 1 · Accepted Answer

As I am not aware of your UI, and you have left open the technology to be used to open Dialogo, then I will focus on the Ajax request itself.

Model

using System;

namespace HelloWorldMvcApp
{
    public class Objeto
    {
        public Objeto()
        {
        }

        public Objeto(string nome, double valor, double percentual)
        {
            Nome = nome;
            Valor = valor;
            Percentual = percentual;
        }

        public string Nome{ get; set; }
        public double Valor { get; set; }
        public double Percentual { get; set; }
    }
}

Controller

using System;
using System.Web.Mvc;

namespace HelloWorldMvcApp
{
    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            return View();
        }

        [HttpPost]
        public JsonResult Dados(Objeto teste)
        {           
            return Json(teste);
        }
    }
}

View

@model HelloWorldMvcApp.Objeto
@{
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" src="https://code.jquery.com/jquery-1.11.3.js"></script><scripttype="text/javascript" src="https://rawgit.com/aspnet/jquery-ajax-unobtrusive/master/jquery.unobtrusive-ajax.js"></script></head><body>@using(Ajax.BeginForm("Dados", "Home", new AjaxOptions { 
            OnSuccess = "onSucess"
        }, new { @id = "meuForm" }))
        {
        @Html.LabelFor(model => model.Nome)
        <br />
        @Html.TextBoxFor(model => model.Nome)
        <br />
        <br />
        @Html.LabelFor(model => model.Valor)
        <br />
        @Html.TextBoxFor(model => model.Valor)
        <br />
        <br />
        @Html.LabelFor(model => model.Percentual)
        <br />
        @Html.TextBoxFor(model => model.Percentual)
        <br />
        <br />
        <input type="submit" value="Enviar" />
        }
        <script>
            var onSucess = function (response) {
                alert(
                    "Rcebi com sucesso os seguintes dados: \n" +
                    "Nome: " + (response.Nome || "Não Informado") + "\n" +
                    "Valor: " + response.Valor + "\n" +
                    "Percentual: " + response.Percentual
                );
            }
        </script>
    </body>
</html>

You can see the example above working in the following DotNetFiddle

Note that it includes the jquery.unobtrusive-ajax.js script in the view, without it Ajax.BeginForm does not work as expected. I also added the onSucess success method in JavaScript.

I used JsonResult to return a Json in response, I did this because of DotNetFiddle's limitation on not being able to have two Views, but you can return ActionResult with no problems.

In the example below I'm only doing alert() , but you can easily use the Framework you want,

Here's an example with JQueryUI and using as a return ActionResult .

Controller

[HttpPost]
public ActionResult Dados(Objeto teste)
{           
    return View(teste);
}

JavaScript

var onSucess = function (response) {
    var dialogo = $(response);
    dialogo.dialog();
}