Comment obtenir des variables POST dans jQuery

Question

Possible en double:
how to get GET and POST variables with JQuery?

J'ai le code HTML suivant:

<form action='.' method='post'>{% csrf_token %} 
    <div class="parameters"> 
     Show 
      <select name="earnings_filter"> 
       <option value="all">Total earnings</option> 
       <option value="hd">HD earnings</option> 
       <option value="sd">SD earnings</option> 
      </select> 
     <input type="submit" name="submit" class="submit float-right" value="submit" id="submit_financials"/> 
    </div> 
</form> 

que je dois faire un appel ajax avec ce , que je déclenche:

$("#submit_financials").live('click', function(){ 
    ... 
}); 

Existe-t-il un moyen d'obtenir les variables qui sont soumises dans POST, par exemple quelle option a été sélectionnée (et il y a environ 10 autres variables que je dois obtenir). Ou dois-je utiliser les sélecteurs jQuery pour obtenir la valeur de chacun?

Answer 1

$("#submit_financials").live('click', function(){ 
    $.ajax({ 
     url: '', // script url to send 
     method: 'POST', // method of sending 
     data: $('form').has(this).serialize(), // .serialize() make query string with form inputs name and value 
     dataType:'json', // expected data format returned from server, you may have something else 
     success: function(response) { 
      // response contains data returned from server 
     } 
    }); 
}); 

Il serait préférable de remplacer live() avec .on() si vous utilisez jQuery> 1.7 et il serait mieux si possible. Ainsi, vous pouvez l'écrire

$("#container").on('click', '#submit_financials', function(){ 
    $.ajax({ 
     url: '', // script url to send 
     method: 'POST', // method of sending 
     data: $('form').has(this).serialize(), // .serialize() make query string with form inputs name and value 
     dataType:'json', // expected data format returned from server, you may have something else 
     success: function(response) { 
      // response contains data returned from server 
     } 
    }); 
}); 

Ici #container points au support de #submit_financials qui appartiennent à DOM au chargement de la page.

Answer 2

Que diriez-vous créer plusieurs valeurs d'entrée de type caché

<input type="hidden" id="sample_id" value="SOMETHING" /> 

leur donner ids et accès aux données à l'intérieur en utilisant:

$('#sample_id').val() 

Answer 3

Si toutes les valeurs sont des éléments d'entrée sur la forme .. .

$("#formId").serialize() 

Answer 4

Vous pouvez serialize le formulaire et l'envoyer à la page du serveur

$.post("yourServerPage.php", $("form").serialize(),function(data){ 
    //Do whatever with the result from ajax server page. 
}); 

Answer 5

Malheureusement, les variables POST sont communiquées dans la requête du client au serveur, mais elles ne sont pas automatiquement incluses dans la réponse du serveur au client. C'est l'une des choses qui les distingue des variables GET.

Si vos données ne sont pas excessivement longues, vous pouvez passer à la méthode GET à la place. Vous pouvez ensuite récupérer les variables en utilisant une fonction comme celle listée dans cette question: How can I get query string values in JavaScript?

Alternativement, si vous avez accès au code côté serveur, vous pouvez inclure ces variables dans le code HTML retourné; cependant c'est une autre question entièrement :)