Comment passer des paramètres dans les requêtes GET avec jQuery

Question

Comment devrais-je passer des valeurs de chaîne de requête dans une requête Ajax jQuery? Je les fais actuellement comme suit mais je suis sûr qu'il existe un moyen plus propre qui ne nécessite pas que je encode manuellement.

$.ajax({
    url: "ajax.aspx?ajaxid=4&UserID=" + UserID + "&EmailAddress=" + encodeURIComponent(EmailAddress),
    success: function(response) {
        //Faire quelque chose
    },
    error: function(xhr) {
        //Faire quelque chose pour gérer l'erreur
    }
});

J'ai vu des exemples où les paramètres de la chaîne de requête sont passés en tant qu'array mais ces exemples que j'ai vus n'utilisent pas le modèle $.ajax(), au lieu de cela ils vont directement à $.get(). Par exemple:

$.get("ajax.aspx", { UserID: UserID , EmailAddress: EmailAddress } );

Je préfère utiliser le format $.ajax() car c'est ce à quoi je suis habitué (aucune raison particulièrement valable - juste une préférence personnelle).

Modifier 09/04/2013:

Après la fermeture de ma question (comme étant "Trop Localisée"), j'ai trouvé une question connexe (identique) - avec 3 votes positifs également (Désolé de ne pas l'avoir trouvée en premier lieu):

Utiliser jQuery pour faire un POST, comment fournir correctement le paramètre 'data'?

Cela a parfaitement répondu à ma question, j'ai trouvé que faire de cette manière est beaucoup plus facile à lire et je n'ai pas besoin d'utiliser manuellement encodeURIComponent() dans l'URL ou les valeurs DATA (ce qui était ambigu dans la réponse de bipen). C'est parce que la valeur data est automatiquement encodée via $.param()). Juste au cas où cela pourrait être utile à quelqu'un d'autre, voici l'exemple avec lequel j'ai continué:

$.ajax({
    url: "ajax.aspx?ajaxid=4",
    data: { 
        "VarA": VarA, 
        "VarB": VarB, 
        "VarC": VarC
    },
    cache: false,
    type: "POST",
    success: function(response) {

    },
    error: function(xhr) {

    }
});

Answer 1

Utilisez l'option data de ajax. Vous pouvez envoyer un objet data vers le serveur via l'option data dans ajax et le type qui définit comment vous l'envoyez (soit POST ou GET). Le type par défaut est la méthode GET

Essayez ceci

$.ajax({
  url: "ajax.aspx",
  type: "get", //envoyé via la méthode get
  data: { 
    ajaxid: 4, 
    UserID: UserID, 
    EmailAddress: EmailAddress
  },
  success: function(response) {
    //Faire quelque chose
  },
  error: function(xhr) {
    //Faire quelque chose pour gérer l'erreur
  }
});

Et vous pouvez obtenir les données ainsi (si vous utilisez PHP)

 $_GET['ajaxid'] //donne 4
 $_GET['UserID'] //vous donne l'ID utilisateur envoyé

En aspx, je crois que c'est (peut-être incorrect)

 Request.QueryString["ajaxid"].ToString();

Answer 2

Placez vos paramètres dans la partie data de l'appel ajax. Voir la documentation. Comme ceci :

$.ajax({
    url: "/TestPage.aspx",
    data: {"first": "Manu","Last":"Sharma"},
    success: function(response) {
        //Faire quelque chose
    },
    error: function(xhr) {
        //Faire quelque chose pour gérer l'erreur
    }
});

Answer 3

Voici la syntaxe en utilisant jQuery $.get

$.get(url, data, successCallback, datatype)

Donc, dans votre cas, cela équivaudrait à,

var url = 'ajax.asp';
var data = { ajaxid: 4, UserID: UserID, EmailAddress: EmailAddress };
var datatype = 'jsonp';

function success(response) {
// faire quelque chose ici 
}

$.get('ajax.aspx', data, success, datatype)

Note $.get ne vous donne pas la possibilité de définir un gestionnaire d'erreur. Mais il existe plusieurs moyens de le faire en utilisant soit $.ajaxSetup(), $.ajaxError() ou en chaînant un .fail sur votre $.get comme ci-dessous

$.get(url, data, success, datatype)
 .fail(function(){
})

La raison de définir le datatype comme 'jsonp' est due aux problèmes de politique de même origine du navigateur, mais si vous faites la demande sur le même domaine où votre javascript est hébergé, vous devriez être bien avec le datatype set à json.

Si vous ne voulez pas utiliser le $.get de jquery alors consultez la documentation pour $.ajax qui permet plus de flexibilité

Answer 4

Essayez d'ajouter ceci :

$.ajax({
    url: "ajax.aspx",
    type:'get',
    data: {ajaxid:4, UserID: UserID , EmailAddress: encodeURIComponent(EmailAddress)},
    dataType: 'json',
    success: function(response) {
      //Faites quelque chose
    },
    error: function(xhr) {
    //Faites quelque chose pour gérer l'erreur
    }
});

En fonction du type de données attendu, vous pouvez attribuer html, json, script, xml

Answer 5

J'ai eu le même problème où j'avais spécifié data mais le navigateur envoyait des requêtes à une URL se terminant par [Object object].

Vous devriez avoir processData défini sur true.

processData: true, // Vous devriez commenter cela si c'est false ou le définir sur true