Wie sende ich mehrere Datenfelder über Ajax? [geschlossen]


136

Ich stecke fest: Ich versuche, ein Formular mit AJAX einzureichen, kann jedoch keine Möglichkeit finden, mehrere Datenfelder über meinen AJAX-Aufruf zu senden.

$(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) {...

Ich habe alle möglichen Dinge ausprobiert:

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

Oder sogar solche Sachen nur zu Testzwecken:

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

Aber was auch immer ich versuche, ich bekomme nichts in meinem activity_save.phpalso nichts in meinem SQL.

Wie lautet also die richtige Syntax, um mehr Datenzeilen in meinen AJAX-Aufruf einzufügen?


Beide sekundären Formen der Behandlung der Eingabedaten sind gültig. Wie greifen Sie auf der PHP-Seite darauf zu? Sie können einen HTTP-Sniffer in Betracht ziehen (Fiddler auf dem PC, so etwas wie HTTPScoop auf einem Mac), der Ihnen genau zeigt, was sich über das Kabel bewegt.
— John Green

Ich würde vorschlagen, Firebug / Chrome zu verwenden, um Ihre Post-Daten zu debuggen. Stellen Sie sicher, dass Sie einen HTTP-Code 200 erhalten und dass die Formulardaten so veröffentlicht werden, wie Sie es für richtig halten. Wenn mit den Post-Daten alles korrekt aussieht, würde ich versuchen, Ihren serverseitigen PHP-Code zu debuggen.
— Kyle Rogers

Die Verwendung von Firebug hat wirklich geholfen und ich habe völlig vergessen, meine Seite damit zu überprüfen. : /
— Deadconversations

Was ist die Verwendung von ** vor und am Ende des Datenparameters?
— Heinkasner

1
@heinkasner, ich denke, das ** ist nur da, um dem Leser zu zeigen, welche Zeile der Autor hervorheben möchte. Das ** müsste entfernt werden, wenn der Code zum Speichern in der Datei bereit ist!
— Mark

Antworten:


256

Die richtige Syntax lautet:

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

Wie hier angegeben: http://api.jquery.com/jQuery.ajax/

Wenn das nicht funktioniert, würde ich diese Variablen alarmieren, um sicherzustellen, dass sie Werte haben.


4
Er weist ausdrücklich auf die Frage hin: "Ich habe alle möglichen data: {status: status, name: name},
— Dinge

20
Ich habe nur auf die richtige Syntax hingewiesen und gesagt, dass das Problem etwas anderes sein muss als die Syntax
— Avitus

3
Meine Syntax scheint korrekt zu sein. Ich glaube, ich habe einen sehr dummen SQL-Fehler gemacht.
— Deadconversations

2
Betreff: Syntax, beachten Sie, dass ein Schlüsselname ein '-' ist, z data: { site-name: "StackOverflow" }. B. nicht funktioniert.
— Moey

Aus den Dokumenten "Die Datenoption kann entweder eine Abfragezeichenfolge des Formulars key1=value1&key2=value2oder ein Objekt des Formulars enthalten {key1: 'value1', key2: 'value2'}. Wenn das letztere Formular verwendet wird, werden die Daten vor dem Senden mit jQuery.param () in eine Abfragezeichenfolge konvertiert. ""
— Jay Blanchard

32

Sie können Daten über JSON oder über normalen POST senden. Hier ist ein Beispiel für 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
      }
 });

Wenn Sie es über die normale Post verwenden möchten, versuchen Sie dies

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

.serialize()ist nicht definiert!
— Amirhossein Mehrvarzi


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

danach kannst du machen wie:

var new_countries = countries.join(',')

nach dem:

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

Dieses Ding funktioniert als JSON-String-Format.


Diese Lösung hat bei mir funktioniert, als ich versucht habe, ein Array über Ajax zu übergeben. Es war die Lösung, es zu einem String zusammenzufügen. Vielen Dank!
— Brian Powell


3

Dieser arbeitet für mich.

Hier ist mein 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>

Hier ist meine jQuery mit 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

Ich bin ein Anfänger bei Ajax, aber ich denke, um diese Methode zu verwenden, muss der Datentyp "data: {status: status, name: name}" auf JSON gesetzt sein, d. H.

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

3
Willkommen beim Stapelüberlauf. dataTypeist die Inhaltstypantwort, die Sie vom Server erwarten - nicht das, was Sie senden. Die Daten, die Sie senden, werden immer in konvertiert foo=bar&bar=foo.
— H2ooooooo

1

Benutze das

data: '{"username":"' + username + '"}',

Ich versuche viel Syntax, um mit Laravel zu arbeiten. Es funktioniert für mich für Laravel 4.2 + Ajax.


1

Versuche dies:

$(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

Ich bin neu bei AJAX und habe es versucht und es funktioniert gut.

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

Versuchen zu benutzen :

$.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
Eine Erklärung vielleicht?
— CS95

0

Folgendes funktioniert bei mir nach 2 Tagen Kopfkratzen: Warum ich die AJaX-Einstellung 'Daten' nicht dazu bringen konnte, zwei Schlüssel / Werte (einschließlich einer Variablen mit Rohbilddaten) zu senden, war ein Rätsel, aber dafür scheint die Funktion jQuery.param () geschrieben worden zu sein.

Erstellen Sie ein params-Array mit Ihren Variablen ohne Anführungszeichen:

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

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

Verwenden Sie die Variable ser_data als Datenwert.

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

Die Dokumentation finden Sie hier: https://api.jquery.com/jQuery.param/

Hoffentlich hilft das!

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.