Envoyer envoyer les Données du Formulaire au Format Json Via Ajax Avec JQuery

comme le dit le titre je suis de l'envoi des données via ajax. mais je continue à y avoir des erreurs, quelqu'un peut-il prendre un coup d'oeil au code et expliquer pourquoi mon appel ajax met en situation d'échec?

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: L'appel ajax retourne l'erreur, il est donc juste de ne pas réussir. Je ne sais pas pourquoi.

Ce serait, vous le savez, utile de mentionner ce que ces erreurs sont.
Oh, hey! Désolé, il retourne l'erreur, dans l'appel ajax, donc je viens de la chaîne "erreur". La fonction ne pas réussir.
est l'URL frappé retourner 2xx?
Êtes-vous sûr d'obtenir une réponse 200? Ce qui est dans le corps de la réponse? Est-il réellement parseable JSON?
Pouvez-vous partager que JSON bloc? Ou au moins de le lancer à travers jsonlint.com pour voir si elle est valide?

OriginalL'auteur Spittal | 2013-11-26

  1. 11

    Vous envoyez des données dans un tableau, pas une chaîne JSON.

    Vous voulez faire quelque chose de ce genre.

    $("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!");
        }
    });
    Cette logique de "Collecte de Données" fonctionne pour les champs de texte, mais ne fonctionne pas pour les cases à cocher. Il transfère la "valeur" de la case de l'élément, peu importe si la case est cochée ou non.

    OriginalL'auteur Philip

  2. 0

    Vieille question, mais je viens de tomber sur cette situation:

    jquery ajax retourne succès lorsqu'elle est directement exécuté, mais renvoie l'erreur lorsqu'il est attaché à bouton, même si la réponse du serveur est de 200 OK

    Et découvert que le problème (dans mon cas) est que l'appel ajax à partir d'un button à l'intérieur d'un form pour envoyer JSON semble provoquer JQuery pour interpréter la réponse du serveur -- et toujours considérer comme une erreur. Ma solution a été de changer le form à un div ou de modifier le button tag à un a tag (à l'aide de Bootstrap pour rendre un bouton)

    Cela a fonctionné

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

    ou

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

    OriginalL'auteur noderman