การส่งค่าด้วย Ajax จาก input แบบ Array
ตัวอย่าง การรับส่งค่าจากฟอร์ม ที่มี input ในแบบ Array ด้วย Ajax
<?php
for ( $i = 0 ; $i < 5 ; $i++ )
{
echo '<input type="text" name="text[]" value = "ทดสอบ '.$i.'" />';
};
?>
<input type="submit" />
</form>
โค้ดส่วนฟอร์ม ที่สร้าง input ในแบบ Array โดย Input ที่ได้จะอยู่ในรุป text[] โดยเมื่อทำการ Submit ฟอร์ม จะทำการเรียก ฟังก์ชั่น doAjaxSubmit เพื่อทำการส่งค่าด้วย Ajax
// จัดการรวมผลลัพท์แอเรย์ เข้าเป็น string
function Inint_AJAX()
{
var xmlHttp = null;
try {
xmlHttp = new XMLHttpRequest();
} catch (e) {
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
};
};
return xmlHttp;
};
function doAjaxSubmit( pForm )
{
var inputs = pForm.getElementsByTagName( 'input' );
var qs = Array();
for ( i = 0 ; i < inputs.length ; i++ )
{
if ( inputs[i].type == 'text' )
{
qs[i] = inputs[i].name + '=' + inputs[i].value;
};
};
var query = qs.join( '&' ); // ข้อความ query ที่ได้
var req = Inint_AJAX();
req.onreadystatechange = function () {
if ( req.readyState == 4 && req.status == 200 ) {
alert( req.responseText );
};
};
req.open( "GET", "test.php?" + query , true ); // ส่งค่าด้วย Ajax แบบ GET เท่านั้น
req.send( null );
return false;
};
</script>
ส่วน Javascript และ Ajax สำหรับรับ และ ส่งค่า โดยในส่วนแรก จะรับค่าจากฟอร์มออกมาอ่านเป็นรูป string ก่อน โดยผลลัพท์ที่ตัวแปร query สามารถดูได้ด้วยการ alert( query ) ออกมาดูครับ หลังจากนั้นก็ส่งออกด้วย Ajax และรับกลับมา ที่ req.responseText
foreach( $_GET[text] as $value )
{
echo $value."
";
};
?>
ส่วนสุดท้าย จะเป็นส่วน ที่รับค่าที่ส่งไป ผมได้จัดการแสดงเฉพาะผลลัพท์เท่านั้นครับ หากต้องการทั้งชื่อ และตัวแปร ให้ลองใช้คำสั้ง print_r( $_GET ) เพื่อดูค่าทั้งหมดที่ส่งมาครับ