Enviar Formulario de envío de Datos en Formato Json a Través de Ajax Con JQuery

como dice el titulo estoy enviando a algunos de los post de los datos a través de ajax. pero sigo recibiendo errores, ¿alguien puede echar un vistazo al código y explicar el por qué de mi llamada ajax mantiene fallando?

submitForm(jQuery('#priceCalc'), {name: 'thingdoto', value: "true"});

function submitForm(form, data) {
        var postData = form.serializeArray(),
            formURL = form.attr("action");

        postData.push(data);
        console.log(postData);
        jQuery.ajax({
                url : formURL,
                type: 'POST',
                dataType : "json",
                data: postData,
                success:function(data)
                {
                        jQuery('#priceTotal').html(data);
                },
                error: function()
                {
                        jQuery('#priceTotal').html('error');
                }
        });
}

EDIT: La llamada ajax devuelve el error, así que es sólo no tener éxito. No sé por qué.

  • Esto podría ser útil hablar de lo que estos errores.
  • Oh, hey! Lo siento, sólo devuelve el error, en la llamada ajax, así que me la cadena «error». La función no tiene éxito.
  • es la dirección URL de golpe de regresar 2xx?
  • Sí, no parece ser un problema con la URL. Gracias por la sugerencia!
  • Hey, yo estaba declarar dos variables en una sola línea, usted notará que la coma no semi colon en la línea de arriba
  • ¿Cuál es la URL? Es en el mismo servidor o de la cruz de dominio?
  • Hey! Sí, está en el mismo servidor!
  • Está usted seguro de que está recibiendo una respuesta 200? Lo que está en el cuerpo de la respuesta? Es realmente parseable JSON?
  • Chrome pestaña red da una respuesta 200 OK, y el consolelog en la línea 8 se ve como algo normal en un objeto JSON con 16 entradas. Por lo que el cuerpo debe ser bueno?
  • Se puede compartir que JSON bloque? O, al menos, hacerlo a través de jsonlint.com a ver si es válido?
  • Hola, Gracias por la sugerencia de @Steve mira como me pasaba a través de un conjunto de objetos y no válido JSON a todos. Así que mi mal! Gracias por toda la ayuda!

InformationsquelleAutor Spittal | 2013-11-26

2 Kommentare

  1. 11

    Tienes que enviar los datos como una matriz, no una cadena JSON.

    Quieres hacer algo como esto.

    $("form#ID").submit(function(e){
    
        e.preventDefault();
    
        var data = {}
        var Form = this;
    
        //Gathering the Data
        //and removing undefined keys(buttons)
        $.each(this.elements, function(i, v){
                var input = $(v);
            data[input.attr("name")] = input.val();
            delete data["undefined"];
        });
    
        //Form Validation goes here....
    
        //Save Form Data........
        $.ajax({
            cache: false,
            url : ?,
            type: "POST",
            dataType : "json",
            data : JSON.stringify(data),
            context : Form,
            success : function(callback){
                //Where $(this) => context == FORM
                console.log(JSON.parse(callback));
                $(this).html("Success!");
            },
            error : function(){
                $(this).html("Error!");
            }
        });
    • Esta lógica de «recogida de Datos» funciona para los campos de texto, pero no funciona para las casillas de verificación. Siempre se transfiere el «valor» de la casilla de verificación del elemento, independientemente de que la casilla de verificación está marcada o no.
  2. 0

    Vieja pregunta, pero me encontré en esta situación:

    jquery ajax devuelve éxito cuando se ejecuta directamente, pero devuelve el error cuando se conecta a botón, aunque la respuesta del servidor es de 200 OK

    Y descubrió que el problema (en mi caso) fue que una llamada ajax a partir de una button dentro de un form para enviar JSON parece ser la causa de JQuery a interpretar la respuesta del servidor — y siempre considero que es un error. Mi solución fue cambiar el form a un div o para cambiar el button etiqueta a un a etiqueta (usando Bootstrap para representar un botón)

    Esta trabajado

    <div>
        <button></button>
    </div>

    o

    <form>
        <a></a>
    </form>

Kommentieren Sie den Artikel

Bitte geben Sie Ihren Kommentar ein!
Bitte geben Sie hier Ihren Namen ein

Pruebas en línea