Як надсилати кілька полів даних через Ajax? [зачинено]


136

Я застряг: я намагаюся подати форму за допомогою AJAX, але я не можу знайти спосіб надсилання декількох полів даних через дзвінок AJAX.

$(document).ready(function() {
  $("#btnSubmit").click(function()  {
    var status = $("#activitymessage").val();
    var name = "Ronny";
    $.ajax({
      type: "POST",
      url: "ajax/activity_save.php",
      **data: "status="+status+"name="+name"**,
      success: function(msg) {...

Я пробував усілякі речі:

data: {status: status, name: name},

Або навіть подібні речі лише для тестування:

data: "status=testing&name=ronny",

Але що б я не намагався, я нічого не отримую activity_save.phpв своєму SQL.

Отже, який правильний синтаксис для розміщення більше рядків даних у моєму виклику AJAX?


Обидві вторинні форми обробки вхідних даних є дійсними. Як ви отримуєте доступ до цього на стороні PHP? Ви можете розглянути HTTP sniffer (Fiddler на ПК, щось на зразок HTTPScoop на Mac), який покаже вам, що саме рухається по дроту.
Джон Грін

Я б радив використовувати firebug / chrome для налагодження даних вашої публікації. Переконайтеся, що ви отримуєте код HTTP 200 і що дані форми розміщуються на ваш погляд. Якщо з даними публікації все виглядає правильно, я б почав намагатися налагодити ваш код сторони сервера PHP.
Кайл Роджерс

Використання Firebug справді допомогло, зовсім забув про перевірку моєї сторінки за допомогою неї. : /
мертві розмови

Яке використання ** перед та в кінці параметри даних?
heinkasner

1
@heinkasner, я думаю, що ** є просто для того, щоб показати читачеві, який рядок хотів би підкреслити автор. ** Було б потрібно видалити, коли код готовий до збереження у файл!
Марк

Відповіді:


256

Правильний синтаксис:

data: {status: status, name: name},

Як зазначено тут: http://api.jquery.com/jQuery.ajax/

Тож якщо це не працює, я б попередив ці змінні, щоб переконатися, що вони мають значення.


4
Він конкретно вказує на запитання: "Я пробував усілякі речі: data: {status: status, name: name},"
Ry-

20
Я просто вказував на правильний синтаксис і казав, що проблема повинна бути чимось іншим, а не синтаксисом
Avitus

3
Здається, мій синтаксис був правильним, я вважаю, що я зробив дуже тупу помилку SQL.
мертві розмови

2
Re: синтаксис, зауважте, що ім'я ключа - "-", наприклад data: { site-name: "StackOverflow" }, не працюватиме.
moey

З документів "Параметр даних може містити або рядок запиту форми key1=value1&key2=value2, або об'єкт форми {key1: 'value1', key2: 'value2'}. Якщо використовується остання форма, дані перетворюються у рядок запиту за допомогою jQuery.param () перед її надсиланням. "
Джей Бланшард

32

Ви можете надсилати дані через JSON або через звичайний POST, ось приклад для JSON.

 var value1 = 1;
 var value2 = 2;
 var value3 = 3;   
 $.ajax({
      type: "POST",
      contentType: "application/json; charset=utf-8",
      url: "yoururlhere",
      data: { data1: value1, data2: value2, data3: value3 },
      success: function (result) {
           // do something here
      }
 });

Якщо ви хочете використовувати його через звичайний пост, спробуйте це

 $.ajax({
      type: "POST",
      url: $('form').attr("action"),   
      data: $('#form0').serialize(),
      success: function (result) {
         // do something here
      }
 });

.serialize()не визначено!
Amirhossein Mehrvarzi


6
var countries = new Array();
countries[0] = 'ga';
countries[1] = 'cd';

після цього ви можете зробити так:

var new_countries = countries.join(',')

після:

$.ajax({
    type: "POST",
    url: "Concessions.aspx/GetConcessions",
    data: new_countries,
    ...

Ця річ працює у форматі рядка JSON.


Це рішення спрацювало для мене, коли я намагався передати масив через ajax. Приєднанням його до рядка було рішення. Дякую!
Брайан Пауелл


3

Цей працює для мене.

Ось мій PHP:

<div id="pageContent">
  <?php
    while($row = mysqli_fetch_assoc($stmt)) {
  ?>
  <br/>
  <input id="vendorName_" name="vendorName_<?php echo $row["id"]; ?>" value='<?php echo $row["vendorName"]; ?>'>
  <input id="owner_" name="owner_<?php echo $row["id"]; ?>" value='<?php echo $row["owner"]; ?>'>
  <input id="city_" name="city_<?php echo $row["id"]; ?>" value='<?php echo $row["city"]; ?>'>
  <button id="btn_update_<?php echo $row["id"]; ?>">Update</button>
  <button id="btn_delete_<?php echo $row["id"]; ?>">Delete</button>
  <?php
    }
  ?>
  </br></br>
  <input id = "vendorName_new" value="">
  <input id = "owner_new" value="">
  <input id = "city_new" value="">
  <button id = "addNewVendor" type="submit">+ New Vendor</button>
</div>

Ось мій jQuery за допомогою AJAX:

$("#addNewVendor").click(function() {
  alert();
  $.ajax({
    type: "POST",
    url: "create.php",
    data: {vendorName: $("#vendorName_new").val(), owner: $("#owner_new").val(), city: $("#city_new").val()},
    success: function(){
      $(this).hide();
      $('div.success').fadeIn();
      showUsers()
    }
  });
});

2

Я початківець в ajax, але думаю використовувати цей "data: {status: status, name: name}" тип даних, тип даних повинен бути встановлений на JSON, тобто

$.ajax({
type: "POST",
dataType: "json",
url: "ajax/activity_save.php",
data: {status: status, name: name},

3
Ласкаво просимо до переповнення стека. dataType- це відповідь типу вмісту, яку ви очікуєте отримати від сервера - не те, що ви надсилаєте. Дані, які ви надсилаєте, завжди будуть конвертовані foo=bar&bar=foo.
h2ooooooo


1

Спробуйте це:

$(document).ready(function() {
  $("#btnSubmit").click(function() {
    var status = $("#activitymessage").val();
    var name = "Ronny";
    $.ajax({
      type: "POST",
      url: "ajax/activity_save.php",
      data: {'status': status, 'name': name},
        success: function(msg) {...

1

Я новачок у AJAX, і я спробував це, і він працює добре.

function q1mrks(country,m) {
  // alert("hellow");
  if (country.length==0) {
    //alert("hellow");
    document.getElementById("q1mrks").innerHTML="";
    return;
  }
  if (window.XMLHttpRequest) {
    // code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
  } else {
    // code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.onreadystatechange=function() {
    if (xmlhttp.readyState==4 && xmlhttp.status==200) {
      document.getElementById("q1mrks").innerHTML=xmlhttp.responseText;
    }
  }
  xmlhttp.open("GET","../location/cal_marks.php?q1mrks="+country+"&marks="+m,true);
  //mygetrequest.open("GET", "basicform.php?name="+namevalue+"&age="+agevalue, true)
  xmlhttp.send();
}

1

Спробуйте використовувати:

$.ajax({
    type: "GET",
    url: "something.php",
    data: { "b": data1, "c": data2 },   
    dataType: "html",
    beforeSend: function() {},
    error: function() {
        alert("Error");
    },
    success: function(data) {                                                    
        $("#result").empty();
        $("#result").append(data);
    }
});

1
Можливо, якесь пояснення?
cs95

0

Ось що працює для мене після 2-х денного вичісування голови; чому я не зміг отримати налаштування AJaX 'data' для надсилання двох ключів / значень (включаючи змінну, що містить неочищені дані зображення), було загадкою, але це, здається, те, що функція jQuery.param () ;

створити масив params зі своїми змінними, без лапок:

var params = { key_name1: var_1, key_name2: var_2  }; // etc.

var ser_data = jQuery.param( params );   // arbitrary variable name

Використовуйте змінні сер_дані як значення даних;

      $.ajax({
       type: 'POST',
       url: '../php_handler_url.php',
       data: ser_data,
    }).success(function(response) {
       alert(response);
    });

Документація тут: https://api.jquery.com/jQuery.param/

Сподіваюся, що це допомагає!

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.