solicitud POST jQuery (no AJAX)

En una aplicación ASP.NET MVC utilizo jQuery por publicar datos sobre el botón clic:solicitud POST jQuery (no AJAX)

<button onclick="addProducts()">Add products</button> 
.... 
$.post('<%= Url.Action("AddToCart", "Cart") %>', 
      { 
       ... 
       returnUrl: window.location.href 
      });

En la acción "AddToCart" del controlador de "Carrito" Yo uso redirección a otra vista después de la publicación:

public RedirectToRouteResult AddToCart(..., string returnUrl) 
    { 
     ... 
     return RedirectToAction("Index", new { returnUrl });    
    }

Todo está bien, excepto esta redirección. Me mantengo en la misma página después de publicar. Sospecho que se debe al tipo de solicitud de "POST" de AJAX.

¿Cómo resolver el problema con la solicitud POST de jQuery que bloquea la redirección?

Fuente

2011-01-03 rem

¿Está intentando redirigir a la misma página que inicia la solicitud de Ajax? – Corneliu

creé una función $.form(url[, data[, method = 'POST']]) que crea una forma oculta, lo llena con los datos especificados y lo adjunta a la <body>. He aquí algunos ejemplos:

$.form('/index') 

<form action="/index" method="POST"></form>

$.form('/new', { title: 'Hello World', body: 'Foo Bar' }) 

<form action="/index" method="POST"> 
    <input type="hidden" name="title" value="Hello World" /> 
    <input type="hidden" name="body" value="Foo Bar" /> 
</form>

$.form('/info', { userIds: [1, 2, 3, 4] }, 'GET') 

<form action="/info" method="GET"> 
    <input type="hidden" name="userIds[]" value="1" /> 
    <input type="hidden" name="userIds[]" value="2" /> 
    <input type="hidden" name="userIds[]" value="3" /> 
    <input type="hidden" name="userIds[]" value="4" /> 
</form>

$.form('/profile', { sender: { first: 'John', last: 'Smith', postIds: null }, 
        receiver: { first: 'Foo', last: 'Bar', postIds: [1, 2] } }) 

<form action="/profile" method="POST"> 
    <input type="hidden" name="sender[first]" value="John"> 
    <input type="hidden" name="sender[last]" value="Smith"> 
    <input type="hidden" name="receiver[first]" value="John"> 
    <input type="hidden" name="receiver[last]" value="Smith"> 
    <input type="hidden" name="receiver[postIds][]" value="1"> 
    <input type="hidden" name="receiver[postIds][]" value="2"> 
</form>

Con el método de jQuery .submit() puede crear y enviar un formulario con una expresión simple:

$.form('http://stackoverflow.com/search', { q: '[ajax]' }, 'GET').submit();

Aquí está la definición de la función:

jQuery(function($) { $.extend({ 
    form: function(url, data, method) { 
     if (method == null) method = 'POST'; 
     if (data == null) data = {}; 

     var form = $('<form>').attr({ 
      method: method, 
      action: url 
     }).css({ 
      display: 'none' 
     }); 

     var addData = function(name, data) { 
      if ($.isArray(data)) { 
       for (var i = 0; i < data.length; i++) { 
        var value = data[i]; 
        addData(name + '[]', value); 
       } 
      } else if (typeof data === 'object') { 
       for (var key in data) { 
        if (data.hasOwnProperty(key)) { 
         addData(name + '[' + key + ']', data[key]); 
        } 
       } 
      } else if (data != null) { 
       form.append($('<input>').attr({ 
        type: 'hidden', 
        name: String(name), 
        value: String(data) 
       })); 
      } 
     }; 

     for (var key in data) { 
      if (data.hasOwnProperty(key)) { 
       addData(key, data[key]); 
      } 
     } 

     return form.appendTo('body'); 
    } 
}); });

Fuente

2011-11-27 07:04:11

Jeremy, gracias por compartir, +1 – rem

¡Maravilloso! No sé si es una buena práctica, pero me encanta esta solución. +1 – Samuel

¿Por qué no llamar a .remove() después de .submit() para evitar tener múltiples formularios ocultos cuando llamas a la función un par de veces? – Samuel

$.post es una llamada AJAX.

Su mejor opción es hacer que el botón sea un desencadenante de un formulario y solo enviarlo mediante el método de publicación.

Una alternativa sería hacer eco de su nueva url del servidor, pero eso derrota el punto de AJAX.

Fuente

2011-01-03 10:41:17

Uso jQuery.submit() que presente formulario: http://api.jquery.com/submit/

Fuente

2011-01-03 11:12:14

'jQuery.submit()' no es un método válido – Orlando

Parece que usted está tratando de añadir productos a la cesta y luego redirigir a la página actual. Supongo que así es como está actualizando el efecto visual de su carrito de compras. Sugeriría agregar el manejador de éxito en $ .post y luego redireccionar a la página actual. Si se produce un error en el servidor, puede devolver el error serializado y manejarlo desde el lado del cliente.

function addProducts() { 
    $.post('<%= Url.Action("AddToCart", "Cart") %>',{ 
     returnUrl: window.location.href 
    }, function(data){ 
     window.location.href = window.location.href 
    }); 
}

Esto actualizará su página actual después de que se publiquen sus productos.

Aquí es un violín de referencia: http://jsfiddle.net/brentmn/B4P6W/3/

Fuente

2012-01-24 22:37:14

Si estás haciendo una redirección completa después de una entrada, entonces ¿por qué hacerlo con el Ajax? Debería poder realizar un POST tradicional aquí y hacer que lo redirija exitosamente.

Si realmente desea una petición AJAX que pasar y todavía redirigir, de una manera muy fácil y no intrusiva para hacer eso sería devolver un JavascriptResult de su acción en lugar de un RedirectResult:

return JavaScript("window.location = " + returnUrl);

Fuente

2012-01-26 15:36:47

Respuesta

Cuestiones relacionadas