jQuery UI input autocomplete mit Datenbank


/ Published in: jQuery
Save to your folder(s)

Mit dem php-Script innerhalb der Seite wird aus der SQL-Datenbank ein Javascript-Array zusammengestellt. Darauf greift das autocomplete-Widget zu.


Copy this code and paste it in your HTML
  1. <html>
  2. <head>
  3. <?php
  4. // Verbindung zur Datenbank herstellen
  5. $db_server = "localhost";
  6. $db_user = "db12345-user";
  7. $db_passwort = "geheimnis";
  8. $db_name = "db12345-db";
  9. $db = @ mysql_connect($db_server, $db_user, $db_passwort)
  10. or die ( 'Konnte keine Verbindung zur Datenbank herstellen' );
  11. $db_select = @ mysql_select_db($db_name );
  12.  
  13. // Einträge aus Datenbank abrufen
  14. $autoFrage = "SELECT tblObject_1.input_name FROM tblObject_1";
  15. $autoResult = mysql_query($autoFrage);
  16. while($autoDaten = mysql_fetch_object($autoResult)){
  17. $autoString .= '"'.$autoDaten->input_name.'",';
  18. }
  19. ?>
  20. <script type="text/javascript">
  21. $(function() {
  22. var availableTags = [<?php echo $autoString; ?>];
  23. $( "#tags" ).autocomplete({
  24. source: availableTags
  25. });
  26. });
  27. </script>
  28. <style type="text/css">
  29. /* Formatierung der Ergebnisse: *>
  30.  
  31. /* Die Statuszeile von jQuery UI autocomplete wird ausgeblendet: */
  32. .ui-helper-hidden-accessible {display: none;}
  33. </style>
  34. </head>
  35. <body>
  36. <form>
  37. <input type="text" id="tags" name="eingabe"/>
  38. </form>
  39. </body>
  40. </html>

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.