คำตอบที่ได้รับเลือกจากเจ้าของกระทู้
ความคิดเห็นที่ 1
ถ้าคล้ายกับการเลือก option ชื่อจังหวัด และตัวเลือกใน option ชื่ออำเภอจะเปลี่ยนไปตามชื่อจังหวัดที่เลือก
แนวทางง่าย ๆ คือ สร้าง table ขึ้นมา 2 table
table ที่ 1 ชื่อ building เก็บชื่ออาคาร และ building_id
table ที่ 2 ชื่อ room เก็บชื่อห้อง และ building_id ของห้อง
เวลาที่เลือก option ชื่ออาคาร ก็ใช้ jquery และ ajax ส่ง buiding_id ไปยัง server เพื่อเลือกข้อมูลของ table room ที่มี buiding_id ตรงตาม buiding_id ของอาคารที่เลือก แนวทางก็ตามนี้เลย [Spoil] คลิกเพื่อดูข้อความที่ซ่อนไว้
เมื่อเลือก option ชื่ออาคารแล้ว และรับข้อมูลจาก server มาแล้ว และต้องการอัพเดทรายชื่อห้องใน option ชื่อห้อง โดยไม่ต้องโหลดหน้าเว็บใหม่ ก็ใช้ jquery เช่น สมมุติ option ชื่อห้องมี id คือ room_list ก็เขียน code javascript ประมาณนี้
ถ้าชื่อห้องที่ส่งกลับมาจาก server เป็น array ของชื่อห้อง ก็อาจใช้ json encode decode [Spoil] คลิกเพื่อดูข้อความที่ซ่อนไว้ หรือถ้าส่งมาเป็น ชื่อ
ห้องที่คั่นด้วย comma หรืออักษรพิเศษ เช่น A101,A102,A103,A104,A105 เราก็ split ออกมาเป็น array แล้ว วนลูปเข้าไป append ใน room_list option
ส่วนการเลือก option แล้วให้ข้อมูลไปแสดงใน textbox ก็ต้องกำหนดค่าให้ attribute "value" ของ option เช่น
https://learn.jquery.com/using-jquery-core/faq/how-do-i-get-the-text-value-of-a-selected-option/
แนวทางง่าย ๆ คือ สร้าง table ขึ้นมา 2 table
table ที่ 1 ชื่อ building เก็บชื่ออาคาร และ building_id
table ที่ 2 ชื่อ room เก็บชื่อห้อง และ building_id ของห้อง
เวลาที่เลือก option ชื่ออาคาร ก็ใช้ jquery และ ajax ส่ง buiding_id ไปยัง server เพื่อเลือกข้อมูลของ table room ที่มี buiding_id ตรงตาม buiding_id ของอาคารที่เลือก แนวทางก็ตามนี้เลย [Spoil] คลิกเพื่อดูข้อความที่ซ่อนไว้
เมื่อเลือก option ชื่ออาคารแล้ว และรับข้อมูลจาก server มาแล้ว และต้องการอัพเดทรายชื่อห้องใน option ชื่อห้อง โดยไม่ต้องโหลดหน้าเว็บใหม่ ก็ใช้ jquery เช่น สมมุติ option ชื่อห้องมี id คือ room_list ก็เขียน code javascript ประมาณนี้
var room_list = $('#room_list');
room_list.empty().append('<option value="">---Select Room---</option>');
และทยอยวน loop ไปเพิ่มรายการชื่อห้องใน option เช่น
room_list.empty().append('<option value="A101">Room A101</option>');
room_list.empty().append('<option value="A102">Room A102</option>');
room_list.empty().append('<option value="">---Select Room---</option>');
และทยอยวน loop ไปเพิ่มรายการชื่อห้องใน option เช่น
room_list.empty().append('<option value="A101">Room A101</option>');
room_list.empty().append('<option value="A102">Room A102</option>');
ถ้าชื่อห้องที่ส่งกลับมาจาก server เป็น array ของชื่อห้อง ก็อาจใช้ json encode decode [Spoil] คลิกเพื่อดูข้อความที่ซ่อนไว้ หรือถ้าส่งมาเป็น ชื่อ
ห้องที่คั่นด้วย comma หรืออักษรพิเศษ เช่น A101,A102,A103,A104,A105 เราก็ split ออกมาเป็น array แล้ว วนลูปเข้าไป append ใน room_list option
ส่วนการเลือก option แล้วให้ข้อมูลไปแสดงใน textbox ก็ต้องกำหนดค่าให้ attribute "value" ของ option เช่น
<option value="ข้อความที่ต้องการ">คำย่อ</option>
ดูตัวอย่างจากที่นี่ครับhttps://learn.jquery.com/using-jquery-core/faq/how-do-i-get-the-text-value-of-a-selected-option/
แสดงความคิดเห็น
[ขอความรู้] การเขียนSelect optionแบบเชื่อมโยงกัน
อย่างแรก ผมมีข้อมูลอยู่2ชุดที่จะทำเป็นSelect Optionครับ
โดยข้อมูลชุดที่ 1 เป็นชื่ออาคาร ชุดที่2เป็น ชื่อห้องในอาคารนั้นๆ
ที่ต้องการก็คือว่าพอทำการเลือกSelectข้อมูลชุดที่1แล้ว จะให้Selectชุดที่2ทำการกรองให้เหลือแค่ข้อมูลห้องของอาคารนั้นๆครับ
รวมถึงการออกแบบฐานข้อมูลด้วยครับ
อีกเรื่องนึงคือ กำหนดให้Selectช่องแรกเป็นอักษรย่อ พอทำการเลือกแล้ว จะให้ชื่อเต็มไปแสดงในช่องTextbox ด้านล่างครับ
อยากจะขอทราบแนวทางหรือวิธีในการทำครับ