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.