Estoy tratando de enviar datos usando jQuery/AJAX en Django y estoy teniendo problemas. Cuando ejecuto el código de abajo y haga clic en el ‘test’ botón, la página completa re-carga de nuevo, que no es lo que queremos que suceda (que es la razón por la que estoy usando AJAX). También no soy capaz de confirmar la petición ajax es llegar a la de python vista. Algún consejo?

editar

He hecho los cambios para devolver false y event.preventDefault(). Una nueva página no se carga, pero sigo sin poder ver el texto actualizado en el div id = «mensaje» del campo. No estoy seguro de si los datos se envían. Estoy viendo en la consola:

POST /edit_favorites/ HTTP/1.1" 403 2294

views.py

from django.shortcuts import render_to_response
from django.http import HttpResponse

def edit_favorites(request):
    if request.is_ajax():
        message = "Yes, AJAX!"
    else:
        message = "Not Ajax"
    return HttpResponse(message)

urlconf:

url(r'^edit_favorites/', 'edit_favorites'),

html:

<form method='post' id ='test'>
     <input type="hidden" value="video34" />
    <input type='submit' value='Test button'/>

    <div id = 'message'>Initial text</div>

</form>

javascript:

    <script type="text/javascript">
   $(document).ready(function() {
       $("#test").submit(function(event){
       event.preventDefault();
            $.ajax({
                 type:"POST",
                 url:"/edit_favorites/",
                 data: {
                        'video': $('#test').val() // from form
                        },
                 success: function(){
                     $('#message').html("<h2>Contact Form Submitted!</h2>") 
                    }
            });
            return false;
       });

    });
</script>
Punto de interrupción en la vista; es el código de la vista de correr? Punto de interrupción en el ajax éxito controlador; está funcionando? Añadir ajax controlador de errores; poner a punto de interrupción no existe; está funcionando? También, 2 aleatoria notas: puede utilizar $('#test').serializeArray(), y se recomienda que la captura de sólo la url que significa: url(r'^edit_favorites/$', ... (sin el $ capturar cualquier url que comienza con esa).

OriginalEl autor sharataka | 2012-11-20

3 Comentarios

  1. 10

    Fuera de lugar return false;. Debe estar en la final de .submit() función. Por lo tanto, moverse una línea hacia arriba.

    $(document).ready(function() {
           $("#test").submit(function(event){
                $.ajax({
                     type:"POST",
                     url:"/edit_favorites/",
                     data: {
                            'video': $('#test').val() // from form
                            },
                     success: function(){
                         $('#message').html("<h2>Contact Form Submitted!</h2>") 
                     }
                });
                return false; //<---- move it here
           });
    
    });

    ACTUALIZACIÓN:

    Sobre el tema POST /edit_favorites/HTTP/1.1" 403 2294. Comprobar en este post, que se parece a su problema,

    Django jQuery solicitud post

    He hecho los cambios para devolver false y eventos.preventDefault(). Una nueva página no se carga, pero sigo sin poder ver el texto actualizado en el div id = «mensaje» del campo. No estoy seguro de si los datos se envían.
    si la ruta de acceso es correcta url:"/edit_favorites/", ?
    Mira esto, stackoverflow.com/questions/12744159/django-jquery-post-request
    Yo creo que es porque eso es lo que tengo en la urlconf.
    Parece, deberá incluir un CSRF (cross-site request forgery) token en la llamada ajax.

    OriginalEl autor Muthu Kumaran

  2. 5

    los siguientes métodos trabajado para mí. y espero ayudar a usted también.

    from django.views.decorators.csrf import csrf_exempt
    from django.http import HttpResponse
    
    @csrf_exempt
    def edit_favorites(request):
        if request.is_ajax():
            message = "Yes, AJAX!"
        else:
            message = "Not Ajax"
        return HttpResponse(message)

    OriginalEl autor Zhengquan Feng

  3. 4

    Lo que está pasando aquí es cuando usted envía un formulario HTML, envía los datos del formulario a la action atributo de la <form>. En javascript se suscribe al evento submit del formulario, sin embargo nunca deshabilitar el comportamiento por defecto de forma, que es seguir la action atributo. En jQuery, que puede modificar ese comportamiento llamando preventDefault método en el caso de argumento, y volviendo false (si se llama preventDefault, a continuación, volver false no es necesario, pero es mejor asegurarse…):

    $(...).submit(function(e) {
        e.preventDefault();
        ...
        return false;
    });

    EDITAR

    Que para el error, el error no es muy útil, pero tengo una corazonada de que no validar CSRF. Más y explicación detallada de que aquí. Solución rápida, sin embargo, es sólo para incluir este archivo en adición a sus jQuery y agregar ensure_csrf_cookie decorador de su punto de vista.

    He hecho los cambios para devolver false y eventos.preventDefault(). Una nueva página no se carga, pero sigo sin poder ver el texto actualizado en el div id = «mensaje» del campo. No estoy seguro de si los datos se envían.
    ¿La actualización del texto a <h2>Contact Form Submitted!</h2>? En firebug ¿te sale algún error?
    Yo no estoy usando firebug, pero yo lo veo «POST /edit_favorites/ HTTP/1.1» 403 2294 en la consola…¿esto ayudar a solucionar?
    En realidad no, pero tengo una corazonada acerca de CSRF. Compruebe la edición en la respuesta.

    OriginalEl autor miki725

Dejar respuesta

Please enter your comment!
Please enter your name here