- stackoverflow.../two-submit-buttons-in-one-form
- stackoverflow.../multiple-submit-buttons-in-an-html-form
- stackoverflow.../how-to-make-multiple-submit-action-on-a-single-submit-form
- http://www.html-form-guide.com/web-form/submit-form-multiple-scripts.html
ส่วนลิงก์นี้จัดว่าตรงตามความต้องการของผมในตอนนี้นะครับ คือเราสามารถเลือกไปเลยว่าจะ submit ไปที่ไหนโดยไม่ต้องยุ่งกับ server side เลย
- stackoverflow.../one-form-with-two-submit-buttons-and-different-actions-for-each-button
- stackoverflow.../jquery-how-to-get-which-button-was-clicked-upon-form-submission
โดยสรุปคือเค้าทำแบบนี้ครับ เขียนส่วนนี้ไว้ที่ header
<!-- เขียนฟังก์ชั่นใน javascript เพื่อให้ form ถูก submit ไปยัง url ที่ระบุด้วยตัวแปร //-->
<script>
function submitForm(action)
{
document.getElementById('columnarForm').action = action;
document.getElementById('columnarForm').submit();
}
</script>
<script>
function submitForm(action)
{
document.getElementById('columnarForm').action = action;
document.getElementById('columnarForm').submit();
}
</script>
ส่วนนี้ก็เอาไว้ที่ body ครับ
<!-- ส่วนของปุ่ม submit ก็ใช้ event onclick มาดักแทน แต่ตัวอย่างนี้สังเกตว่าปุ่มเป็นภาพนะครับ //-->
<input type="image" name="camper" onclick="submitForm('formindb_hoh_1.php')" value="camper" src="../images/apps/camperBtn.png" class="submit_button" />
<input type="image" name="medical" onclick="submitForm('formindb_hoh_2.php')" value="medical" src="../images/apps/medicalBtn.png" class="submit_button" />
<input type="image" name="camper" onclick="submitForm('formindb_hoh_1.php')" value="camper" src="../images/apps/camperBtn.png" class="submit_button" />
<input type="image" name="medical" onclick="submitForm('formindb_hoh_2.php')" value="medical" src="../images/apps/medicalBtn.png" class="submit_button" />
จบสั้นๆไว้ตรงนี้ตามเคยครับ หวังว่าคงได้ประโยชน์กันนะครับ พบกันใหม่ตอนหน้าครับ ขอบคุณที่เข้ามาชมครับ
กิตติศักดิ์ บุญราศรี
เพิ่มเติมครับ ....
หลังจากที่ลองเอาวิธีการดังกล่าวไปใช้แล้วปรากฏว่าไม่เวอร์คเท่าไหร่เพราะผมพยายามใช้ภาพประกอบให้น้อยลง และการสร้างภาพเป็นปุ่มมันเปลี่ยนแปลงแก้ไขลำบาก ไปๆมาๆเจอวิธีการในลิงก์ข้างบนนี่แหละครับ แนะนำให้ใช้ html5 เออก็ฟังดูเข้าท่าเพราะมันมาใหม่ มันแก้ปัญหาจบแน่ แล้วก็จริงด้วยครับ ดูจากข้างล่างนี้คุณจะรู้เอง มันง่ายมาก
<!DOCTYPE html>
<html>
<body>
<form>
<input type="submit" formaction="firsttarget" value="Submit to first" />
<input type="submit" formaction="secondtarget" value="Submit to second" />
</form>
</body>
</html>
<html>
<body>
<form>
<input type="submit" formaction="firsttarget" value="Submit to first" />
<input type="submit" formaction="secondtarget" value="Submit to second" />
</form>
</body>
</html>
ง่ายไปป๊าว!!.. คนทำเรื่องนี้คนแรกๆ คงคิดกันหัวแทบแตกทำไงให้โพสต์ไปอีกที่ได้โดยการสร้างปุ่มไว้ให้เลือก ใช้วิธีต่างๆนานา ตอนนี้ง่ายเกิ๊น..!
0 ความคิดเห็น