มี 15 ความเห็น ในบทความเรื่อง “ทำ Autocomplete ด้วย jQuery Autocomplete Plugin”

1. minddezign says:

   23/07/2009 at 15:05

   แล้วหากผมมีข้อมูลอยู่ในอยู่ใน table ใน mysql แล้วผม query data เข้ามาใส่แทนใน JavaScript ได้อย่างงัยอ่ะครับเช่นผมมีเดือนต่างๆเก็บไว้ที่ database อ่ะครับ

   พอดีผมเองไม่ค่อยได้ใช้ Javascript + php อ่ะครับ แต่จะลองทำก่อนไม่รู้ว่าจะได้เป่า หากได้เดียวจะเอามาให้ตรวจดูครับ JavaScript ยังงูๆปลาๆเลยอ่ะครับ

   แต่หากพี่ทำได้ รบกวนช่วยยกตัวอย่างด้วยครับ ขอบคุณครับผม
2. platoosom says:

   23/07/2009 at 15:17

   ใช้คำสั่ง echo ธรรมดาเลย

   var str_month = “< ?php loop and echo value from database here?>“;

   แทรกโครมเข้าไปเลยตรงนี้ วนลูปดึงเอาเดือนจากดาต้าเบส echo ลงมาเลย คำมันก็จะเรียง ตามแบบที่ต้องการ พอมาถึงฝั่ง javascript มันก็ทำของมันเอง

   ผมขออธิบาย php กับ javascript นิดนึงนะ

   php ทำงานบนเซิฟเวอร์ ตอนมันทำงานจาวาสคริปต์ยังไม่ถึงคิวจะทำ ถ้าเรา echo แท็ก html ออกมา มันก็เป็น html echo javascript ออกมา มันก็เป็นจาวาสคริปต์

   ส่วน javascript ทำงานฝั่งไคลเอนท์ ถ้ามันเห็นข้อความ ที่ขึ้นต้นด้วย <script> เมื่อไร มันจะเข้าใจทันทีว่า นั่นคำสั่งของตัวมัน

   เพราะฉะนั้นการเขียนปนกัน เราก็แค่จินตนาการถึง จาวาสคริปต์ รูปสำเร็จ แล้วเราก็ให้ php ช่วย echo ค่าตามนั้น ง่ายๆ
3. minddezign says:

   24/07/2009 at 14:02

   ขอบคุณครับ เดียวลองดู่ก่อนครับ
4. minddezign says:

   24/07/2009 at 16:07

   ลองทำแหล่ะครับได้แหล่ะ แต่มันยากที่ผมใช้ javascript ไปเรียกการใช้งานของ php ได้อย่างงัย แต่ก็ลองถูๆไถๆดู ก็ได้ครับแต่ไม่รู้ว่าจะถูกหลักการไหม
   ** แต่อยากรู้ว่าจะให้ javascript ไปเรียก php ที่เรา้เขียนไว้ได้อย่างงัยครับ

   อันนี้โค๊ดที่ผมทำก็ออกน่ะครับ ใช้ได้ปกติ
   ==================================================
   db_connect(DB_SERVER_HOST, DB_SERVER_USERNAME, DB_SERVER_PASSWORD, DB_SERVER_DATABASE);
   # Mode SQL Command : Select for count data in condition
   $sql = ” SELECT “;
   $sql .= ” id, “;
   $sql .= ” name “;
   $sql .= ” FROM “;
   $sql .= TABLE_MONTH;
   # Execute query command
   $res['select_data'] = $conn_mysql->query($sql);
   # Set variable type array
   $arr['data_detail'] = array();
   $arr_month = array();
   # Loop data in to variable : Fetch a result row as an associative array
   while ($arr['data_detail'] = $conn_mysql->fetch_row($res['select_data'])) {
   # Define variable for use easy
   $id = $arr['data_detail']['id'];
   $name = $arr['data_detail']['name'];
   # Push one or more elements onto the end of array : เพิ่มค่าเข้าไปใน Array มันก็จะวนต่อกันไปเรื่อยๆ
   array_push($arr_month, $name);
   } // end while
   # Close the database
   $conn_mysql->db_close();
   /*
   echo “

   ";
   	print_r($arr_month);
   	echo "

   “;
   */
   ?>
   <?php
   # นับจำนวนค่าทั้งหมดที่อยู่ใน array
   $count_array = count($arr_month);
   //echo "มีจำนวนทั้งหมด : " . $count_array;
   //echo "”;
   # กำหนดค่าเริ่มต้น
   $seq = 0;
   # วนลูปแสดงค่าที่อยู่ใน array ออกมา
   foreach ($arr_month as $key=>$val) {
   # เพิ่มค่าที่ละ 1
   $seq++;
   # แสดงค่าออกมา
   echo $val;
   # ตรวจสอบ : หากไม่ใช่ตัวสุดท้ายก็ให้แสดง “,” ต่อท้าย แต่หากเป็นตัวสุดท้ายไม่ต้องแสดง “,”
   if ($seq != $count_array) {
   echo “,”;
   } // end if
   } // end foreach
   ?>

   Autocomplete jQuery Plugin

   $(document).ready(function(){
   // ตรงนี้ไป copy code php ที่เขียนไว้ข้างบนเอามาใส่ใน JavaScript แต่อยากรู้ว่าจะให้ JavaScript ไปเรียกใช้งาน php ที่เขียนไว้ได้อย่างงัย
   var str_month = ‘$val) {$seq++;echo $val; if ($seq != $count_array) {echo ‘,’;}}?>’;
   var arr_month = str_month.split(“,”);

   $(“#month”).autocomplete( arr_month );

   })

   จงพิมพ์ ก ไก่ หรือชื่อเดือนไทย

   =================================================
   ลองทำแบบมั่วๆเอา 555
5. minddezign says:

   24/07/2009 at 16:16

   อีกเรื่องครับ

   หากผมจะให้มัน ค้นหา(Search) มากกว่าที่จะค้นหาคำแรกของเดือน คือผมต้องการค้นหาคำว่า “คม” ก็จะแสดงคำเดือนทั้งหมดที่มี คม ออกมาน่ะครับ ทำอย่างไรครับ
6. minddezign says:

   24/07/2009 at 16:17

   ผมจะให้มันค้นหาคำว่า คม แทนทีจะให้มันหาคำแรกทำอย่างไรดีครับ
7. platoosom says:

   24/07/2009 at 16:45

   ปรับปรุงโค้ดให้ ของเ่ด่นมันเยิ่นเย้อ และไม่จำเป็นต้องวนลูป แล้วเช็กว่าเป็นตัวท้ายหรือเปล่า แค่ใช้คำสั่ง implode ก็พอ
   < ?php
   $str_month = implode( ',' , $arr_month );
   ?>

   จะได้สตริงที่มี , คั่นโดยไม่ต้องวนลูปอะไรเลย จาก 9 บรรทัด เหลือบรรทัด เดียว แล้วตอนเขียนแทรกลงใน จาวาสคริปต์ ก็แทรกอย่างนี้ครับ

   var str_month = “< ?php echo $str_month ;?>“;
   var arr_month = str_month.split(“,”);
8. platoosom says:

   24/07/2009 at 16:50

   ส่วนที่ถามว่าอยากจะให้มันค้นหาคำว่า คมแทนที่ จะหาจากตัวแรก ทำได้ครับผม ลองดูตัวอย่าง

   http://jquery.bassistance.de/autocomplete/demo/

   ลองพิมพ์ ch ในช่อง Single Bird (remote): จะเห็นว่ามันทำได้อย่างที่เด่นต้องการ

   ส่วนทำอย่างไรนั้น เอ่อ… คงต้องศึกษาเพิ่มเติมจากเว็บเขานั่นแหละครับ ผมเองก็ใช้มันแค่ง่ายๆ เลยไม่ได้ศึกษาอย่างที่เด่นต้องการ
9. minddezign says:

   25/07/2009 at 08:27

   ขอบคุณครับ ผมรู้แหล่ะครับว่าจะ Search อย่างไรครับ หาตั้งนานแน่ะครับ แจ๋วๆจริงๆครับผม ผมอยากจะเรียนรู้พวก Java เพิ่มเติมมั่ง อยากเขียนพวก Ajax + JavaScript ตอนนี้เรียน Java แบบเล็กๆอยู่ครับผม

   ขอบคุณครับสำหรับความรู้ดีๆครับ
10. mrsitti says:

    12/09/2009 at 09:47

    ขอบคุณทั้งท่านผู้ถาม และท่านผู้ตอบที่แสนใจดี

    เป็นกำลังใจให้นะครับ
11. xxx says:

    09/10/2009 at 11:07

    ผมจะให้มันค้นหาคำว่า คม แทนทีจะให้มันหาคำแรกทำอย่างไรดีครับ
    $(“#month”).autocomplete( arr_month , {
    multiple: true, //ยอมให้ป้อนได้หลายค่า
    mustMatch: true, //ป้อนได้เฉพาะค่าที่เตรียมไว้ให้
    autoFill: true, //เติมคำอัตโนมัติ
    matchContains: true //หาค่าที่ไม่ใช่ตัวเริ่มต้น
    });
12. music says:

    04/11/2009 at 15:58

    ผมลองแล้วอ่ะครับ ถ้าใช้แบบ multiple มันจะไม่ support ie 8 ดูจาก demo ก็ไม่ดี งงมากคับ http://jquery.bassistance.de/autocomplete/demo/
13. ผ่านมา says:

    10/12/2009 at 11:06

    แจ่มครับ
14. bank says:

    07/02/2010 at 22:29

    ถ้ามีข้อมูลเยอะๆแล้วต้องการให้มีิตัวเลื่อนขึ้นเลื่อนลงเหมือนรูปตัวอย่างอันบนสุดต้องทำยังไงคับ
15. ภฤศ says:

    27/05/2010 at 01:36

    ก่อนอื่นต้องขอขอบคุณมากเลยครับ เป็นประโยชน์มากๆเลย

    และมีคำถามคือถ้าต้องการ เพิ่ม List มากกว่า 1 อันทำยังไงครับ

    ขอบคุณครับ