แล้วก็อีกเรื่องนึงนะครับ ผมต้องการเลือก radio พอเลือกแล้วให้นำค่าไป + กับ ตัวแปร i แล้วแสดงออกมาตามภาพเลยครับ แล้วก็อีกอย่างทำเป็น button กด + ก็จะบวกทีละ 1 กดลบ ก็จะลบทีละ 1 ครับ ขอบคุณสำหรับคำแนะนำนะครับเพิ่งเรียนรู้ครับ
<?php
if(!isset($_POST["i"])){ // ตรวจสอบว่ามีค่าเริ่มต้นหรือยัง ไม่มี ให้เป็น 0
$i=0;
}
else{
$i = $_POST["i"]; // อ่านค่า i จาก form
if(!empty($_POST["choice"])){ // ตรวจสอบว่ากด ที่ choice หรือไม่ถ้าใช่ทำตาม choice
$c = $_POST["choice"];
$i = $i+$c;
}
else{ // ถ้าไม่ได้กด choice แสดงว่ากดปุ่ม เพิ่ม/ลด
if(!empty($_POST["add"])){
$i++;
}else{
$i--;
}
}
}
/// ส่วนแสดงผลตามรูป
echo 'show i = ' . $i;
echo '<form action="test.php" method="post">';
echo '<input type="radio" onChange="this.form.submit();" name="choice" value="1">1 (i+1)<br>';
echo '<input type="radio" onChange="this.form.submit();" name="choice" value="2">2 (i+2)<br>';
echo '<input type="radio" onChange="this.form.submit();" name="choice" value="3">3 (i+3)<br>';
echo '<input type="hidden" name="i" value="'. $i . '">';
echo '<button onClick="this.form.submit();" name="add" value="1">+</button>1
<button onClick="this.form.submit();" name="minus" value="1">-</button> show i =' .$i;
echo '</form>';
?>
code ด้านบนเป็นการทำงานฝั่ง server-side โดยใช้ form มาช่วย ถ้าอยากให้เป็น client-side ให้ใช้ javascript ตรวจสอบ onClick หรือ onChange ตรงส่วนแสดงผลแล้วเรียกไปทำงานในฟังก์ชันแทนการ submit เช่น onClick="increment();" แล้ว ใช้ DOM ช่วยในการแสดงผล ส่วน คลิก link ให้แสดงผล ลองศึกษา ajax แล้วใช้ DOM แสดงผล (ส่ง request แล้วนำ content มาโชว์ใน div)
ลองมองหน้านั้น แยกออกแบบนี้นะครับ
ที่เป็น menu bar สมมติเป็นไฟล์ menu.php ไฟล์หนึ่ง ที่มีกล่อง div id="show" อยู่
ส่วนอีกไฟล์เป็น data.php ไฟล์ที่มี data ที่ต้องการแสดงผลใน div หน้าที่มี menu bar สมมติในนั้นมีสคริปต์แบบนี้
<?php
echo "<h1>TEST HEADING STYLE</h1><p>This is paragraph in the page that you want to show</p><button class="btn btn-primary">Learn more</button>";
?>
ให้เพิ่ม onclick ลงบน tag a ของลิ้งค์ใน menu.php <a onclick="send();"> แล้วเพิ่ม javascript
<script>
function send(){
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
if(this.readyState == 4 && this.status == 200){
document.getElementById("show").innerHTML = this.responseText;
}
};
xmlhttp.open("GET","http://localhost/test/data.php",true);
xmlhttp.send();
}
</script>
ตรง /test/data.php ระบุ path ให้ตรงกับที่เก็บไฟล์นะครับ
หลังจากนั้นลองรันแล้วคลิกที่ ลิ้ง นั้นดู data ที่อยู่ใน data.php จะไปโชว์อยู่ในกล่อง div id="show" ในไฟล์ menu.php
ขอบคุณสำหรับโค้ดนะครับผมคือมันไม่ขึ้นอะไรเลยครับ เว็บนี้มันแบ่งหัวท้ายครับ ส่วนหัวจะรวม menu ไปด้วย
หน้า index.php
<?php
include 'html_head.php'; (ส่วน menu จะอยู่หน้านี้ครับ)
?>
ส่วนเนื้อหา
<?php
include 'html_foot.php';
?>
ผมสามารถก๊อปหน้านี้แล้วไปเปลี่ยนตรงส่วนเนื้อหาทำอีกหน้า แล้วใส่ลิ้งค์ตามปกติเลยจะดีไหมครับ?
<script> function send(){
var xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function(){
if(this.readyState == 4 && this.status == 200){
document.getElementById("show").innerHTML = this.responseText;
}
};
xmlhttp.open("GET","http://localhost/test/data.php",true); xmlhttp.send(); }
</script>
ตามนี้เลยครับผม แต่ตอนนี้ menu ที่อยู่ใน <?php include 'html_head.php'; ?> หาวิธี active มันไม่ได้ครับ
ตอบ/อธิบาย