c# - pages - MVC 3: ¿Cómo renderizar una vista sin su página de diseño cuando se carga a través de ajax?

razor mvc

Question

Estoy aprendiendo acerca de la mejora progresiva y tengo una pregunta sobre las vistas AJAXifying. En mi proyecto MVC 3 tengo una página de diseño, una página de inicio de vista y dos vistas simples.

La página viewstart está en la raíz de la carpeta Views y, por lo tanto, se aplica a todas las vistas. Especifica que todas las vistas deben usar _Layout.cshtml para su página de diseño. La página de diseño contiene dos enlaces de navegación, uno para cada vista. Los enlaces usan @Html.ActionLink() para presentarse en la página.

Ahora agregué jQuery y quiero secuestrar estos enlaces y usar Ajax para cargar su contenido en la página de forma dinámica.

<script type="text/javascript">
    $(function () {
        $(''#theLink'').click(function () {
            $.ajax({
                url: $(this).attr(''href''),
                type: "GET",
                success: function (response) {
                    $(''#mainContent'').html(response);
                }
            });
            return false;
        });
    });
</script>

Hay dos maneras en que puedo pensar para hacer esto, pero no me gusta ninguno de los dos:

1) Puedo tomar los contenidos de la vista completa y colocarlos en una vista parcial, luego hacer que la vista principal llame a la vista parcial cuando se representa. De esa forma, usando Request.IsAjaxRequest() en el controlador, puedo devolver View() o devolver PartialView() función de si la solicitud es o no una solicitud de Ajax. No puedo devolver la vista normal a la solicitud de Ajax porque luego usaría la página de diseño y obtendría una segunda copia de la página de diseño inyectada. Sin embargo, esto no me gusta porque me obliga a crear vistas vacías con solo @{Html.RenderPartial();} en ellas para las solicitudes GET estándar.

    public ActionResult Index()
    {
        if (Request.IsAjaxRequest())
            return PartialView("partialView");
        else
            return View();
    }

Luego en Index.cshtml haz esto:

@{Html.RenderPartial("partialView");}

2) Puedo eliminar la designación de diseño de _viewstart y especificarla manualmente cuando la solicitud NO es Ajax:

    public ActionResult Index()
    {
        if (Request.IsAjaxRequest())
            return View(); // Return view with no master.
        else
            return View("Index", "_Layout"); // Return view with master.
    }

¿Alguien tiene una mejor sugerencia? ¿Hay alguna manera de devolver una vista sin su página de diseño? Sería mucho más fácil decir explícitamente "no incluir tu diseño" si es una solicitud de AJAX, de lo que sería incluir explícitamente el diseño si no es un AJAX.

Answer 1

Crea dos diseños: 1. diseño vacío, 2. diseño principal y luego escriba en el archivo _viewStart este código:

@{
if (Request.IsAjaxRequest())
{
    Layout = "~/Areas/Dashboard/Views/Shared/_emptyLayout.cshtml";
}
else
{
    Layout = "~/Areas/Dashboard/Views/Shared/_Layout.cshtml";
}}

por supuesto, tal vez no es la mejor solución

Answer 2

En ~/Views/ViewStart.cshtml :

@{
    Layout = Request.IsAjaxRequest() ? null : "~/Views/Shared/_Layout.cshtml";
}

y en el controlador:

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

Answer 3

No es necesario crear una vista vacía para esto.

En el controlador:

if (Request.IsAjaxRequest())
  return PartialView();
else
  return View();

al devolver un PartialViewResult se anulará la definición del diseño al procesar el respons.

Answer 4

Para una aplicación Ruby on Rails, pude evitar que se cargue un diseño especificando el render layout: false en la acción del controlador que quería responder con ajax html.

Answer 5

Prefiero y uso tu opción n. ° 1. No me gusta el n. ° 2 porque para mí View() implica que está devolviendo una página completa. Debería ser una página HTML completa y válida una vez que el motor de visualización haya terminado. PartialView() fue creado para devolver fragmentos arbitrarios de HTML.

No creo que sea un gran problema tener una visión que solo llame parcial. Aún está SECO, y le permite usar la lógica del parcial en dos escenarios.

A muchas personas no les gusta fragmentar las rutas de llamada de sus acciones con Request.IsAjaxRequest() , y puedo apreciarlo. Pero IMO, si todo lo que estás haciendo es decidir si llamar a View() o PartialView() entonces la rama no es un gran problema y es fácil de mantener (y probar). Si se encuentra utilizando IsAjaxRequest() para determinar grandes porciones de cómo se desarrolla su acción, entonces hacer una acción AJAX por separado es probablemente mejor.

Answer 6

Simplemente ponga el siguiente código en la parte superior de la página

@{
    Layout = "";
}