[英]Sending a form with variable number of fields with AJAX, $_POST array is empty
我正在嘗試使用post方法將表單數據發送到PHP腳本。 因為字段的數量和名稱是可變的,所以我遍歷$ _POST數組。 將表單“直接”發送到PHP文件時,它工作得很好,但出於不同的原因,我需要/希望讓PHP腳本在后台運行,而不需要重新加載表單的頁面。 所以我嘗試使用AJAX ...但是當腳本執行時,$ _POST數組為空。
這是我用來簡單回顯表單輸入的PHP文本腳本(process_form_fields.php):
echo "DEBUG: Script Output start.<br />";
foreach($_POST as $name => $value)
{
echo "DEBUG: $name = $value <br />";
}
echo "DEBUG: End of script output.<br />";
sdection中的JavaScript / AJAX代碼如下所示:
<script type="text/javascript" language="javascript">
xmlhttp = new XMLHttpRequest();
function process_form()
{
xmlhttp.onreadystatechange =
function()
{
if(xmlhttp.readystate == 4)
{
document.getElementById("status_message_box").innerHTML = xmlhttp.responseText;
}
else
{
document.getElementById("status_message_box").innerHTML = "<i>loading (status:" + xmlhttp.status + xmlhttp.responseText + ")</i>";
}
}
xmlhttp.open("POST", "http://mydomain.com/modules/process_form_fields.php", true);
xmlhttp.send();
}
</script>
這就是表單的樣子:
<form action="process_form_fields.php" method="post" class="niceform">
<input type="submit" value="submit">
<div class="set_options">
<dl>
<dt>
<label for="1">Option 1:</label>
</dt>
<dd>
<select size="1" name="Option 1" id="Option 1">
<option value="Alpha">Alpha (1pt)</option>
<option value="Beta">Beta (5pt)</option>
<option value="Gamma">Gamma (20pt)</option>
</select>
</dd>
</dl>
<dl>
<dt><label for="2">Option 2:</label></dt>
<dd>
<select size="1" name="Option 2" id="Option 2">
<option value="Red">Red (0pt)</option>
<option value="Blue">Blue (0pt)</option>
</select>
</dd>
</dl>
<dl>
<dt>
<label for="3">Option 3:</label>
</dt>
<dd>
<select size="1" name="Option X" id="Option X">
<option value="Foo">Foo (-5pt)</option>
<option value="Bar">Bar (42pt)</option>
</select>
</dd>
</dl>
</form>
將表單直接發送到PHP文件會創建以下輸出,就像它應該是:
DEBUG: Script Output start.
DEBUG: Option 1 = Alpha (1pt)
DEBUG: Option 2 = Blue (0pt)
DEBUG: Option X = Bar (42pt)
DEBUG: End of script output.
使用上面的AJAX只輸出:
DEBUG: Script Output start.
DEBUG: End of script output.
我想我可能會在這里遺漏一些簡單的東西,但是我太盲目了,不能把手指放在上面。 我希望有人能指出我正確的方向。 重要的是,HTML表單具有可變數量的字段,並且這些字段沒有以任何方式編號/序列化(可以是“選項1”,“選項2”,“最喜歡的黃色香蕉形狀水果”和“年齡”例如)。
謝謝
你不是用你的ajax請求發送數據,這應該工作:
var dataString = $('form').serialize();
xmlhttp.send(dataString);
您沒有根據您的要求發送任何數據! XMLHttpRequest不會自動捕獲表單數據。 您必須明確說明您想要傳遞的變量。 您必須使用javascript捕獲表單字段的值,將它們串入查詢,然后使用xmlhttp.send()
將其傳遞給PHP腳本。
嘗試類似的東西:
xmlhttp.open("POST","http://mydomain.com/modules/process_form_fields.php",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("option1=A&option2=B&option3=C");
要像HTML表單一樣POST數據,請使用setRequestHeader()添加HTTP標頭。 在send()方法中指定要發送的數據: 。
在你的情況下send();
是空的,這就是為什么你得到一個空的$ _POST數組
jquery可以避免這種復雜且難以調試的代碼。
使用這樣的東西:
$.ajax({
url: "test.html",
data: {data:yourdata}
}).done(function() {
//your success function
});
就是這樣。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.