通過AJAX發送表單數據到PHP文件

我已經嘗試了幾個小時了，我不知道還有什麼要嘗試。我在這裏看了幾十個問題，但他們太複雜了，或者我不明白他們。沒有幫助，我的經驗與JavaScript/jQuery日期日期前幾天。不管怎麼說，這是我的形式：通過AJAX發送表單數據到PHP文件

<form onsubmit="onSubmit(this)"> 
    <input type="text" name="input1"/><br/> 
    <input type="text" name="input2"/><br/> 
</form>

而且我的腳本：

function onSubmit(form){ 
    var jsondate = JSON.stringify($(form).serializeArray()); 
    console.log(jsondate); 
    alert(jsondate); 
    $.ajax({ 
     type: "POST", 
     url: "json.php", 
     data: jsondate, 
     contentType: "application/json; charset=utf-8", 
     dataType: "json", 
     success: function(data){ 
      alert(jsondate); 
     }, 
     failure: function(errMsg) { 
      alert(errMsg); 
     } 
    }); 
}

而且我json.php文件：

<?php 
if (isset($_POST['jsondate'])) { 
    echo "whatever"; 
}

的事情是，我得到的警告與JSON字符串，但是當它將我重定向到json.php（在表單上使用action="json.php"），或者我留在頁面上時，它不顯示任何內容，所以我猜這是$.ajax({...})

關於如何使其工作，它是如何工作以及爲什麼會非常有用的任何解釋！

來源

2017-04-12 Newwt

'數據：{jsondate：jsondate}'試試這個 –

你的表單元素沒有名字... –

沒你以前問過類似的問題嗎？ http://stackoverflow.com/q/43366068/1415724並收到答案。 –

您需要一種方法來獲取元素的值。在這個例子中，我將使用的HTML的ID並獲得在JavaScript

HTML使用它：

<form onsubmit="onSubmit(this)"> 
    <input type="text" id="ID1"><br/> 
    <input type="text" id="ID2"><br/> 
</form>

JavaScript：

var v1 = $("#ID1").val(); // Get de value using the Ids 
var v2 = $("#ID2").val(); 
$.ajax({ 
    method: "POST", 
    url: "json.php", // add the page here 
    data: { name: v1, location: v2 } // put the data here (Will get this data using POST) 
}) 
    .done(function(msg) { 
    alert("Data Saved: " + msg); // if it works this alert will appear 
});

來源

2017-04-12 13:21:21 Xidh

兩個問題：您沒有爲表單元素提供名稱，也沒有停止表單提交。

這裏有一個解決方案使用盡可能多的jQuery。

首先，爲了方便起見，給你的表單一個ID。

二，要求，給你的表單域的名稱。

<form id="form1"> 
    <input type="text" name="input1"><br/> 
    <input type="text" name="input2"><br/> 
</form>

第三，重視使用.submit(handler)到您的形式onsubmit事件處理程序。

$('#form1').submit(function (e) { 
    // prevent the form from submitting/reloading (by default) 
    e.preventDefault(); 
    // 
    $.ajax({ 
     type: "POST", 
     url: "json.php", 
     data: $(this).serializeArray(), 
     contentType: "application/json; charset=utf-8", 
     dataType: "json", 
     success: function(data){ 
      alert(jsondate); 
     }, 
     failure: function(errMsg) { 
      alert(errMsg); 
     } 
    }); 
});

第四，在你json.php，你就可以訪問域

echo $_POST['input1']; 
echo $_POST['input2'];

來源

2017-04-12 13:29:51 Mikey

不起作用。它清除輸入並不顯示任何內容。順便說一下，「停止提交表單」意味着什麼？ – Newwt

您是否包含[documentation]（https://learn.jquery.com/about-jquery/how-jquery-works/）中顯示的jQuery庫？默認情況下，當你提交一個[form]（https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form#Examples）時，它將數據發送到'action中的任何頁面'屬性。如果沒有'action'屬性，它會將數據發送到同一頁面。當您發送數據時，它也會進入該頁面。我們想要防止這種情況發生。 – Mikey

是的，我做到了。使用json字符串等進行警報時，jQuery可以工作。這是阿賈克斯的一部分，一切都在下降。 – Newwt

通過AJAX發送表單數據到PHP文件

回答

相關問題