Як надсилати кілька полів даних через 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.