Home/ Questions/Q 8329089
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-09T01:39:16+00:00

I want to change this code (dropdown select course) into typeahead so i just

  • 0

I want to change this code (dropdown select course) into typeahead so i just need to type a few word and then, it will suggest.

<TD width="112"><INPUT type="checkbox" name="chk[]"/></TD>
        <TD width="472">
            <SELECT name="course[]">
                <?php
                  $sql = "select * from tt_course";
                  $result = mysql_query($sql);
                  while($rs = mysql_fetch_assoc($result))
                    {
                        $select="";
                        echo "<option value=\"".$rs['course_id']."\" ".$select.">".$rs['course_name']."</option>";
                    }
                  ?>
            </SELECT>
        </TD>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Have a look at http://jqueryui.com/demos/autocomplete/
    Its simple and easy to setup and will serve the purpose. You can create an array of values and provide it to Autocomplete or you can make it call your php page and parse the returned JSON data.

    As promised, here is an example code to get you going. Please note that this code uses a local javascript variable to prepare suggestions for the autocomplete box. You can easily update that to look for JSON data from your php page and i could easily have made you even that but purpose is to help you learn so i think this way it would be better for you so that you can see how it works and then update it to your needs accordingly. Here you go, you can simply copy paste this code and see it running

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/black-tie/jquery-ui.css" type="text/css" />
    <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'></script>
    <script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.min.js'></script>
    <script>
    $(document).ready(function() {
        $( "#AC" ).autocomplete({
            source: programmingLang
        });
    });
    var programmingLang = ["ActionScript","AppleScript","Asp","BASIC","C","C++",
    "Clojure","COBOL","ColdFusion","Erlang","Fortran","Groovy","Haskell",
    "Java","JavaScript","Lisp","Perl","PHP","Python","Ruby","Scala","Scheme"];
    </script>
</head>
<body>
    <input type=text name="AC" id="AC">
</body>
</html>
    • 0