Как передать параметры в GET-запросах с помощью jQuery

192

Как мне передать значения строки запроса в запросе jQuery Ajax? В настоящее время я делаю это следующим образом, но я уверен, что есть более чистый способ, который не требует, чтобы я кодировал вручную.

$.ajax({
    url: "ajax.aspx?ajaxid=4&UserID=" + UserID + "&EmailAddress=" + encodeURIComponent(EmailAddress),
    success: function(response) {
        //Do Something
    },
    error: function(xhr) {
        //Do Something to handle error
    }
});

Я видел примеры, где параметры строки запроса передаются как массив, но эти примеры, которые я видел, не используют модель $.ajax(), вместо этого они идут прямо к $.get(). Например:

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

Я предпочитаю использовать формат $.ajax(), так как это то, к чему я использовал (без особого основания - только личное предпочтение).

Редактировать 09/04/2013:

После того, как мой вопрос был закрыт (как "Слишком локализованный" ), я нашел связанный (идентичный) вопрос - с 3 upvotes no-less (Мой плохой, потому что не нашел его в первую очередь):

Используя jquery для создания POST, как правильно поставить параметр "данные" ?

Это отлично ответило на мой вопрос, я обнаружил, что делать это таким образом намного проще для чтения, и мне не нужно вручную использовать encodeURIComponent() в URL-адресе или значениях DATA (это то, что я нашел неясным в bipen-ответе). Это связано с тем, что значение data автоматически закодировано через $.param()). На всякий случай это может быть полезно для кого-либо еще, это пример, который я использовал:

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

    },
    error: function(xhr) {

    }
});
  • 0
    $ .get - это просто ярлык для $ .ajax
  • 0
    кроме того, ваш Edit 09/04/2013 является почтовым запросом :-), но он, очевидно, работает так же, как GET.
Теги:
get

8 ответов

217
Лучший ответ

Используйте параметр данных ajax. Вы можете отправить объект данных на сервер по параметру data в ajax и type который определяет, как вы его отправляете (POST или GET). Тип по умолчанию - метод GET

Попробуй это

$.ajax({
  url: "ajax.aspx",
  type: "get", //send it through get method
  data: { 
    ajaxid: 4, 
    UserID: UserID, 
    EmailAddress: EmailAddress
  },
  success: function(response) {
    //Do Something
  },
  error: function(xhr) {
    //Do Something to handle error
  }
});

И вы можете получить данные по (если вы используете PHP)

 $_GET['ajaxid'] //gives 4
 $_GET['UserID'] //gives you the sent userid

В aspx я считаю, что это (возможно, неправильно)

 Request.QueryString["ajaxid"].ToString(); 
  • 2
    вам не нужно encodeURIComponent . JQuery сделает это для вас.
  • 2
    aspx, но $_GET php lol :-)
Показать ещё 2 комментария
15

Поместите свои параметры в data часть вызова ajax. См. документы. Например:

$.ajax({
    url: "/TestPage.aspx",
    data: {"first": "Manu","Last":"Sharma"},
    success: function(response) {
        //Do Something
    },
    error: function(xhr) {
        //Do Something to handle error
    }
});
  • 1
    Просто и лаконично. Большое спасибо!
2

Вот синтаксис с использованием jQuery $.get

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

Таким образом, в вашем случае это будет соответствовать,

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

function success(response) {
// do something here 
}

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

Примечание. $.get не дает вам возможности установить обработчик ошибок. Но есть несколько способов сделать это либо с помощью $.ajaxSetup(), $.ajaxError(), либо цепочки .fail на вашем $.get как $.get ниже

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

Причина установки типа данных как "jsonp" связана с теми же проблемами с политикой браузера, но если вы делаете запрос в том же домене, где размещен ваш javascript, вы должны быть в порядке с типом данных, установленным в json.

Если вы не хотите использовать jquery $.get то см. Документы для $.ajax что дает возможность для большей гибкости

2

Попробуйте добавить это:

$.ajax({
    url: "ajax.aspx",
    type:'get',
    data: {ajaxid:4, UserID: UserID , EmailAddress: encodeURIComponent(EmailAddress)},
    dataType: 'json',
    success: function(response) {
      //Do Something
    },
    error: function(xhr) {
    //Do Something to handle error
    }
});

В зависимости от того, какой тип данных ожидается, вы можете назначить html, json, script, xml

  • 0
    Ваше решение полезно, но вам интересно, как определить переменную ( ID ) перед передачей в качестве параметра? У меня есть Q на SO, stackoverflow.com/questions/41192531/… . Я продвинулся в этом вопросе гораздо дальше, где теперь я вызываю диалог jquery и вызываю ajax для извлечения данных из mysql. Мне не хватает ссылки для получения уникального идентификатора, связанного с каждым кликом по точке данных . Ценю, если вы можете мне помочь. Спасибо
1

Свойство data позволяет отправлять строку. В коде на стороне сервера принимайте его как строковое имя аргумента "myVar", а затем вы можете его проанализировать.

$.ajax({
    url: "ajax.aspx",
    data: [myVar = {id: 4, email: 'emailaddress', myArray: [1, 2, 3]}];
    success: function(response) {
    //Do Something
    },
    error: function(xhr) {
    //Do Something to handle error
    }
});
  • 1
    Зачем ты stringify ? ajax реализация jQuery позаботится об этом за вас.
  • 1
    Ты совершенно прав. Немного мозговит пердеть. Благодарю.
0

Имел ту же проблему, когда я указал data но браузер отправлял запросы на URL, заканчивающийся на [Object object].

У вас должно быть установлено значение processData true.

processData: true, // You should comment this out if is false or set to true
0

Вы можете использовать $.ajax(), и если вы не хотите вводить параметры непосредственно в URL-адрес, используйте data:. Это добавлено к URL

Источник: http://api.jquery.com/jQuery.ajax/

-1

Параметр data ajax-метода позволяет отправлять данные на сервер. На стороне сервера вы можете запросить данные. См. Код

var id=5;
$.ajax({
    type: "get",
    url: "url of server side script",
    data:{id:id},
    success: function(res){
        console.log(res);
    },
error:function(error)
{
console.log(error);
}
});

На стороне сервера получите его с помощью переменной $ _GET.

$_GET['id'];

Ещё вопросы

Сообщество Overcoder
Наверх
Меню