555+++

งงกะคำถาม

ถ้าจะหา id 199 ไม่ต้องใช้ฟังก์ชั่น addToBasket(99); เหรอ

ลองเขียนคำถามมาใหม่นะ....หรือไม่ก็ลองค้นหาบทความบนเว็บดู เดาๆว่ามีที่ใกล้เคียงนะ

''งง''

เทาที่ผมเข้าใจก็คือ....
อยากให้ฟอร์มทำกิจกรรมอย่างหนึ่งเมื่อ input ตัวหนึ่งมีข้อมูลหรือเปล่า

คือถ้า id = 102 ก็ให้ addToBasket(2)
และถ้า id = 103 ก็ให้ addToBasket(3)

ประมาณว่าถ้าเลือกข้อมูลอย่างใดอย่างหนึ่งแล้วให้แสดงข้อมูลทีเกี่ยวข้องขึ้นมาเลย โดยที่ไม่ต้อง refresh ทั้งจอ(มั้ง)
กรณีนี้น่าจะส่งตัวแปรที่เลือกไป if...else ที่ server น่าจะดีกว่าครับ คือส่ง id ไปเข้าฟังก์ชั่น แล้วให้ฟังก์ชั่นกระทำการ แล้วส่งข้อมูลขึ้นมาแสดงบนฟอร์ม

อย่าลืมว่า javascript กระทำการใดๆฝั่ง client
และ php เป็นการกระทำฝั่ง server เพราะฉะนั้นควรเลือกใช้ให้เหมาะสมกับสถานการณ์

ปล.อธิบายตามความเข้าใจของคำถามส่วนตัวนะครับ.....

เทาที่ผมเข้าใจก็คือ....
อยากให้ฟอร์มทำกิจกรรมอย่างหนึ่งเมื่อ input ตัวหนึ่งมีข้อมูลหรือเปล่า

คือถ้า id = 102 ก็ให้ addToBasket(2)
และถ้า id = 103 ก็ให้ addToBasket(3)

---------------------------------------------------------

เหมือนที่พี่ blueeye บอกอ่าครับ ประมาณว่าผมใช้  onKeyUp พิมพ์อะไรมันก็จะดึง addToBasket(4); ทันที

 <?php   
  echo"<form>"
  . "            <div align=\"center\" class=\"style17\"> Product_id:"
  . "              <input type=\"text\" id=\"txt2\" onKeyUp=\"addToBasket(4);return false\" />"
  . "             </div>"
  . "        </form>"
 ."";
  ?>

ไม่รู้จะอธิบายยังไง คือผมอยากให้พิมพ์ product_id ให้ครบก่อนน่ะครับเช่นพิมพ์ 101 จึงจะให้มันแสดงผล


กรณีนี้น่าจะส่งตัวแปรที่เลือกไป if...else ที่ server น่าจะดีกว่าครับ คือส่ง id ไปเข้าฟังก์ชั่น แล้วให้ฟังก์ชั่นกระทำการ แล้วส่งข้อมูลขึ้นมาแสดงบนฟอร์ม

ช่วยอธิบายหน่อยครับ

ถ้าเข้าไปในบทความ "ตรวจสอบฟอร์มขณะพิมพ์ด้วย GAJAX " จะเจอตัวอย่างที่ง่ายมาก แต่ต้องใช้ GAJAX นะ

คือผมกำลังพยายามเข้าใจคำถามตรงที่ว่า "onKeyUp พิมพ์อะไรมันก็จะดึง addToBasket(4); ทันที" หมายถึงพิมพ์ปุ๊ป add ลง 4 เลย หรือ พิมพ์ปุ๊ป แสดงข้อมูลปั๊ป (อะไรประมาณนี้หรือเปล่า)

ในตัวอย่างที่ผมจะให้ลองไปดู event จะประมาณนี้นะ .....

onKeyUp='searchkeyup(this.value)' onBlur='hidesearch();' onFocus='searchkeyup(this.value)' onMouseup='searchkeyup(this.value)'

event กลุ่มข้างบนนี้ใช้ด้วยกัน ทำให้การแสดงผลออกมาเหมือน www.google.co.th มาก โดยใช้เทคนิคของ ajax เช้ามาช่วย ...
สังเกตุชื่อฟังก์ชั่นนะครับ แล้วเข้าไปดูตัวอย่าง.... โดยจะเลือกเอา event บางตัวให้เหมาะสมกับงานก็ได้

ส่วน if .... else ที่ถามมาต้องนำไปใช้ในฟังก์ชั่นครับ.... ตรง event แบบข้างบนก็แค่ส่งค่าหรือตัวแปรไปให้ฟังก์ชั่นเท่านั้น ในกรณีของเจ้าของคำถามก็คือ id (ถ้าเป็นขอมูลไม่เยอะก็ทำแบบตัวเลือก select ก็ได้) ฉะนั้นจะได้ประมาณข้างบนครับ ตรง this.value ก็คือค่าที่ได้จากการกรอกข้อมูลลง  input box นั่นละครับ สมมติว่าพิมพ์เลข 102 ลงไปก็ส่งค่า 102 เข้าไปในฟังก์ชั่นเลย ..... ส่วนที่ฟังก์ชั่นก็รับค่าที่ส่งไปนั้น เอาไป if...else ได้ตามสบาย

อันนี้เป็นตัวอย่างแบบการใช้ event ของ input box และเทคนิค ajax ครับ อาจจะเข้าใจยากสำหรับมือใหม่ แต่ผมลองทำตามแล้วก็ใช้ได้เลย ให้ลองสังเกตเรื่องการเรียกใช้ฟังก์ชั่นเพื่อเอามาประยุกต์กับคำถามของเจ้าของกระทู้ครับ

http://www.goragod.com/knowledge-%E0%B8%9A%E0%B8%97%E0%B8%97%E0%B8%B5%E0%B9%88%209%20%E0%B8%81%E0%B8%B2%E0%B8%A3%E0%B8%84%E0%B9%89%E0%B8%99%E0%B8%AB%E0%B8%B2%E0%B8%82%E0%B9%89%E0%B8%AD%E0%B8%84%E0%B8%A7%E0%B8%B2%E0%B8%A1%E0%B8%94%E0%B9%89%E0%B8%A7%E0%B8%A2%20AJAX.html?search=google

เดานะ...

คำถามก็คือ ต้องการ textbox กรอกข้อมูล ให้ครบ 3 หลัก ก่อนไปร้องขอข้อมูลจาก Server

ถ้าใช่ คำตอบมีมากมายบนเว็บ....

คำแนะนำที่อยากให้ทำก่อน ในกรณีที่ไม่รู้อะไรเลย คือ ทำ Ajax ให้มันส่งค่าไปตรวจสอบ และตอบกลับมาได้เสียก่อน เช่น พิมพ์ 1 ส่งไปตรวจ ไม่มีผลลัพท์ ก็ส่งค่าว่างกลับ พิมพ์ตัว ที่ 2 ก็ส่งไปตรวจสอบอีก จนกระทั่งพิมพ์ครบ 3 ตัว ถึงจะได้ค่าตอบกลับ

นี่เป็นอย่างแรกที่ควรทำ และ มีตัวอย่างหลายบทความบนเว็บ ควรลองหาดู....

หลังจากนั้น กลับมาที่คำถาม บอกว่า id ที่จะมีได้ก็คือต้องกรอกครบ 3 ตัว อันนี้ไม่ยากเลย แค่นับจำนวนตัวอักษรก่อนถ้าครบ 3 แล้วค่อยส่งไปตรวจด้วย Ajax หลักการก็ใ้ช้ Javascript ผมจะให้แค่แนวคิดนะ

var value = document.getElementById('input_id').value;
if( value.length > 2 ){
  // Ajax ส่งไปตรวจสอบ
}

<script type="text/javascript">
function addToBasket(var id) {
  if(id == 101)
    addToBasket(1);
  if(id == 102)
    addToBasket(2);
   if(id == 103)
    addToBasket(3);
   if(id == 104)
    addToBasket(4);
   if(id == 105)
    addToBasket(5);
  if(id == 106)
    addToBasket(6); 
 
}

</script>

<form>
  <div align="center"><span class="style7">Product_id :</span>
    <input type="text" onkeyup="addToBasket;" />
  </div>
</form>

รบกวนอาจารย์ดู code ให้หน่อยครับควรปรับตรงไหนบ้าง

มันทำงานป่าวละท่าน ถ้ามันสามารถทำงานได้ตามต้องการมันก็ใช้ได้ ถึงแม้มันจะดูแปลกๆไปนิด

จริงๆแล้วมันอาจมีวิธีที่ดีกว่า แต่ข้อมูลมันไม่เพียงพอ เลยไม่สามารถหาวิธีที่ดีกว่าได้ เอาเป็นว่า ถ้ามันสามารถทำงานได้ตามต้องการ มันก็ไม่มีอะไรผิดหรอกครับ

เขียนใหม่ๆเราอาจจะเขียนซะยาวเหยีียด แต่พอเรามีประสบการณ์มากขึึ้้น เมื่อเราหันกลับมามองอีกทีเราอาจจะรู้สึกเองแหละครับว่า "ไอ้ตอนนั้นเขียนอะไรไปวะ...." และมันก็คงจะเกิดขึ้นกับทุกคนแหละครับ ไม่ต้องกังวล

แปลกตรงฟังก์ชั่น addToBasket นั่นล่ะ ....
ตั้งแต่ if ล่ะครับ มันน่าจะเป็น

if (.....) {

} else if (......) {

}else if (......) {

} else {

}

แต่ที่แปลกยิ่งขึ้นไปอีกก็คือ statement ใน if มันทำไมเรียกฟังก์ชั่นตัวเอง แถมใส่ตัวแปรเข้าไปอีก มันทำงานยังไงหว่า..?
ถ้าจะให้ฟังก์ชั่นรับค่าแล้วทำตามเงื่อนไขแล้วล่ะก็น่าจะเป็นอย่างนี้นะ

function addToBasket(id) {
 if (id == '101') {
  other_function(1); <<<< ตรงนี้ถ้าจะเรียกฟีังก์ชั่นอื่นๆก็ได้ แต่ไม่น่าเรียกตัวเอง
 } else if (id == '102') {
  other_function(2);
 } else if (id == '103') {
  other_function(3);
 } else if (id == '104') {
  other_function(4);
 } else if (id == '105') {
  other_function(5);
 } else if (id == '106') {
  other_function(6);
 }
}

ตรง onkeyup="addToBasket;" ก็น่าจะใส่ตัวแปรลงไปด้วย เป็น

onkeyup="addToBasket($id);"

เป็นต้น....

ขอบคุณอาจารย์มากนะครับ ตอนนี้ฟังก์ชั่นใช้งานได้แล้วครับ