Enviar un formulario sin actualizar/redirigir de la página actual (Python (Django) + jQuery + Ajax)

Question

¿Alguna forma de enviar un formulario sin actualizar la página actual utilizando Python con jQuery Ajax? Quiero que los resultados finales sean similares a cómo funcionan los comentarios de Facebook.

Actualmente estoy usando jQuery Form para hacer el Ajax. Sin embargo, no me da la experiencia del usuario que quiero porque:

1. Después de enviar el formulario usando jQuery, la dirección URL en la barra de direcciones refrescado a la forma que presenté.

2. Actualizó la página. No me gusta especialmente, digamos que estaba en la parte inferior de la página desplazada al máximo. Después de enviar el formulario, refrescó la página y el foco se redirigió a la parte superior de la página.

Espero haber dejado claro mi punto de vista sobre lo que quiero. Necesito algo como el sistema de comentarios de Facebook. Alguien comentó, y luego el comentario fue enviado sin ninguna actualización de la página.

EDITAR

Código jQuery:

$('#review_submit').submit(function() { 
     var options = {};   
     $(this).ajaxSubmit(options); 
     return false; 
}); 



    $('[name=submit_review_btn]').click(function(){      
     $('#review_submit').submit(); 
    }); 

Por lo tanto, el código Python para manejar la envíe será necesario redirigir una página de su código del lado del servidor, por lo redirigir la página a esta URL, 'main_URL.com'

Con los códigos de jQuery se muestra, los resultados son los siguientes:

1. La URL apareció en la barra de direcciones: main_URL.com/ form_action_url < --- Esta es la acción de formulario que he configurado para enviar el formulario.

2. Página redirigida a la página que configuré en el lado del servidor.

Estoy confundido con esta experiencia de Ajax.

Answer 1

Usted puede manejar esto en lugar de utilizar la forma de jQuery, ajaxPost uso de jQuery. Esto le permitirá .serialize() el formulario (para obtener los parámetros) y podrá volver a una función JS para hacer lo que desee después de que se envíe el 'formulario'. Confirmar jQuery.post()

jsFiddle

Esto no va a actualizar la página que el mensaje pasa a través de una llamada AJAX. Le permite ejecutar una función después de que la publicación se publique y haga lo que desee (si la publicación devuelve datos, estará disponible aquí ... si desea hacer otro GET o POST después de que este fue un éxito, se puede hacer aquí ... así sucesivamente y así sucesivamente)

Answer 2

Sería más fácil responder que si publicaste tu código JavaScript.

¿Está enviando el formulario con un botón Enviar? Si es así, jQuery Form debería manejar todo y NO actualizar la página.

Si va a enviar el formulario en JavaScript, el código debe ser similar en los ejemplos jQuery Forma:

// attach handler to form's submit event 
$('#myFormId').submit(function() { 
    // submit the form 
    $(this).ajaxSubmit(); 
    // return false to prevent normal browser submit and page navigation 
    return false; 
}); 

la return false; es muy importante aquí. De lo contrario, el usuario será redirigido.

Para que el sistema funcione, se tiene que hacer de 2 fases:

1. enviar el comentario
2. anexar el comentario con el resto de las observaciones (o ir a buscar nuevos comentarios desde un servidor y luego añadir)

¿Es así como es su configuración actual?

Answer 3

tengo un sitio muy dinámico que utiliza esta tecnología por todo el lugar. Usamos Dojo pero los principios son los mismos. Al igual que los carteles anteriores, su formulario debe tener onsubmit = "return false;" como un atributo (o en el objeto de formulario que envía) para que la página no se vuelva a cargar.

En el lado del servidor, no usamos un redireccionamiento, sino que respondemos con JSON (o XML, o lo que sea) y le indicamos al manejador de respuestas (jQuery, Dojo, etc.) qué hacer a continuación.

mayoría de las veces, el proceso es:

1. Publicar un formulario con una llamada xhrPOST
2. hacer el trabajo en el servidor
3. Volver JSON/XML/texto
4. manija que devuelven el valor y tiene javascript determinar qué hacer

Un ejemplo concreto es algo como esto:

1. El usuario envía los signos vitales del paciente
2. valida servidor y vuelve {éxito: "vitales recibidos."} O {error: "Número no válido"}
3. El manejador de devolución de llamada xhr Javascript determina qué hacer a continuación (cerrar una diálogo, actualice la forma de una entrada nueva o llamar la atención sobre un campo que falta)

Editar: Enlace a algunos marcos web de Python: link

enlace a un tutorial o básica n volver JSON en Django (con jQuery) link

Otra nota: Cuando se utiliza JSON, es técnicamente ya no AJAX, como el X representa XML.