Autocomplete ohne Jquery - fast fertig!

clemensplainer · 15.12.2011, 17:04

Hallo Jungs,

ich hab wieder mal ein Anliegen. Zuerst, ich mag JS nicht =) Noch weniger mag ich jQuery, ich regle normalerweise solche sachen serverseitig, also mit PHP. Aber bei einer Auto-Suggest-Funktion stoße ich mit PHP natürlich an die Grenze des Vermöglichbaren =)

Hab ein tolles und vor allem kompaktes Script gefunden (http://blogswizards.com/3d-text-styl...-photoshop-cs3) welches auch prächtig funktioniert.

Aufgerufen wird es über das jeweilige Formular mit

Code:

onkeyup="javascript:autosuggest()"

, was ich schon mal super finde, da ich scripts, die ich auf jeder Seite einbinde grundsätzlich verabscheue =)

Das einzige Problem, welches ich nun habe, ist das ich diese Autosuggest-Entries nicht anklicken kann, bzw. dass sich diese nach einem Klick nicht in das jeweilige Feld "zaubern" lassen.

So sieht der Source von search.php aus - die Datei die das Ajax-Pattern bewältigt:

PHP-Code:

      $term = strip_tags($_GET['q']);

 
        if(strlen($term)>0) {

 
            $sql = "SELECT * FROM `" . DB_TABLE_USERS . "` WHERE company LIKE '%" . $term . "%'";

            $query = mysql_query($sql);

 
            echo '<ul id="suggestions"></ul>';

 
            while($row = mysql_fetch_array($query)) {

 
                echo '<li><a href="#"> ' . $row['company'] .' | ' . $row['uid'] .'</a></li>';

 
            }

 
 
        }

Es ist wahrscheinlich überhaupt nicht schwer. Ich brauche einfach eine Funktion, die ich onclick bei den <li><a>-Elementen aufrufe, welche den Wert aus dem Feld ausliest und in in das jeweilige Input-Feld schiebt, also den DOM manipuliert.

Verglichen mit PHP wäre das auf der Schwierigkeitsskala wahrscheinlich mit der Funktion echo() vergleichbar, aber ich gebs zu, ich kann das nicht =)

Es wäre total toll, wenn ihr mir so eine Funktion liefern würdet, da ich echt ungern auf jQuery umsteigen will =)

Das würde mir den Tag retten und die Nacht verlängern =)
LG Clemens

clemensplainer · 15.12.2011, 17:46

Okay, es scheint als könnte man mit PHP-Vorkenntnissen doch was in Javascript anfangen =)

Ich hab das jetzt mal so:

PHP-Code:

      $term = strip_tags($_GET['q']);

        if(strlen($term)>0) {

            $sql = "SELECT * FROM `" . DB_TABLE_USERS . "` WHERE company LIKE '%" . $term . "%'";
            $query = mysql_query($sql);

            echo '<ul id="suggestions"></ul>';
            $number = 1;
            while($row = mysql_fetch_array($query)) {

                echo '<li><a id="'.$number.'" href="javascript:select('.$number.')""> ' . $row['company'] .'</a></li>';
                $number++;

            }


        }

Und die JS-Funktion

PHP-Code:

      function select(id) {

    q = document.getElementById(id).innerHTML;
    document.getElementById('search-q').value =q;

    }

Wie kann man denn das noch besser, bzw effizienter gestalten?
LG

mquadrat · 15.12.2011, 18:34

Naja, du könntest statt der ID einfach direkt den Text übergeben, der reingeschrieben werden soll

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
jQueryLog new extension for debugging jquery (feedback request)	jquerylog	JavaScript, Ajax und mehr	8	26.12.2011 11:58
jQuery UI Tabs komplett mit AJAX laden und letzt gewählten Tab wählen	K00S	JavaScript, Ajax und mehr	6	10.09.2011 13:54
Einsatz von Milestones (jQuery)	dreamcatcher	JavaScript, Ajax und mehr	4	28.06.2011 12:07
PHP und jquery	mehlwurm	PHP Einsteiger	13	30.05.2011 23:09
jQuery Post in iFrame	Atikos	JavaScript, Ajax und mehr	9	13.04.2011 16:45
jQuery Autocomplete AutoFill funktioniert nicht	Atikos	JavaScript, Ajax und mehr	15	12.04.2011 16:16
jQuery UI Autocomplete MySQL - Verbesserung/"Best practise"	dreamcatcher	JavaScript, Ajax und mehr	0	01.04.2011 02:01
[Erledigt] jquery autocomplete mit ajax	PiXeL1337	JavaScript, Ajax und mehr	4	11.01.2011 12:23
[Erledigt] jQuery Autocomplete - nur Begriffe aus Vorschlagsliste erlauben?	Berliner030	JavaScript, Ajax und mehr	9	15.09.2010 13:42
[Erledigt] jQuery Slider - In eine Richtung sperren	Trainmaster	JavaScript, Ajax und mehr	2	08.08.2010 16:06
[Erledigt] Statistik mit jQuery	DJ_RhoxxZ	JavaScript, Ajax und mehr	6	25.07.2010 17:47
JQuery + Autocomplete mit htmlentities	saduccm	JavaScript, Ajax und mehr	4	13.05.2009 09:15
jQuery Plugin - so richtig?	stayInside	JavaScript, Ajax und mehr	5	23.02.2009 12:34
Scriptsuche AJAX AutoComplete mit PHP + JSON	PsychoEagle	Scriptbörse	5	07.08.2008 13:32
Projekt fertig stellen		Beitragsarchiv	4	15.01.2005 11:38

15.12.2011, 17:04
clemensplainer Benutzer Registriert seit: 30.07.2011 Beiträge: 45 PHP-Kenntnisse: Anfänger	Autocomplete ohne Jquery - fast fertig! Hallo Jungs, ich hab wieder mal ein Anliegen. Zuerst, ich mag JS nicht =) Noch weniger mag ich jQuery, ich regle normalerweise solche sachen serverseitig, also mit PHP. Aber bei einer Auto-Suggest-Funktion stoße ich mit PHP natürlich an die Grenze des Vermöglichbaren =) Hab ein tolles und vor allem kompaktes Script gefunden (http://blogswizards.com/3d-text-styl...-photoshop-cs3) welches auch prächtig funktioniert. Aufgerufen wird es über das jeweilige Formular mit Code: onkeyup="javascript:autosuggest()" , was ich schon mal super finde, da ich scripts, die ich auf jeder Seite einbinde grundsätzlich verabscheue =) Das einzige Problem, welches ich nun habe, ist das ich diese Autosuggest-Entries nicht anklicken kann, bzw. dass sich diese nach einem Klick nicht in das jeweilige Feld "zaubern" lassen. So sieht der Source von search.php aus - die Datei die das Ajax-Pattern bewältigt: PHP-Code: $term = strip_tags($_GET['q']); if(strlen($term)>0) { $sql = "SELECT * FROM `" . DB_TABLE_USERS . "` WHERE company LIKE '%" . $term . "%'"; $query = mysql_query($sql); echo '<ul id="suggestions"></ul>'; while($row = mysql_fetch_array($query)) { echo '<li><a href="#"> ' . $row['company'] .' \| ' . $row['uid'] .'</a></li>'; } } Es ist wahrscheinlich überhaupt nicht schwer. Ich brauche einfach eine Funktion, die ich onclick bei den <li><a>-Elementen aufrufe, welche den Wert aus dem Feld ausliest und in in das jeweilige Input-Feld schiebt, also den DOM manipuliert. Verglichen mit PHP wäre das auf der Schwierigkeitsskala wahrscheinlich mit der Funktion echo() vergleichbar, aber ich gebs zu, ich kann das nicht =) Es wäre total toll, wenn ihr mir so eine Funktion liefern würdet, da ich echt ungern auf jQuery umsteigen will =) Das würde mir den Tag retten und die Nacht verlängern =) LG Clemens


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

15.12.2011, 17:46
clemensplainer Benutzer Registriert seit: 30.07.2011 Beiträge: 45 PHP-Kenntnisse: Anfänger	Okay, es scheint als könnte man mit PHP-Vorkenntnissen doch was in Javascript anfangen =) Ich hab das jetzt mal so: PHP-Code: $term = strip_tags($_GET['q']); if(strlen($term)>0) { $sql = "SELECT * FROM `" . DB_TABLE_USERS . "` WHERE company LIKE '%" . $term . "%'"; $query = mysql_query($sql); echo '<ul id="suggestions"></ul>'; $number = 1; while($row = mysql_fetch_array($query)) { echo '<li><a id="'.$number.'" href="javascript:select('.$number.')""> ' . $row['company'] .'</a></li>'; $number++; } } Und die JS-Funktion PHP-Code: `function select(id) { q = document.getElementById(id).innerHTML; document.getElementById('search-q').value =q; }` Wie kann man denn das noch besser, bzw effizienter gestalten? LG

15.12.2011, 18:34
mquadrat Erfahrener Benutzer Registriert seit: 02.09.2009 Beiträge: 1.019 PHP-Kenntnisse: Fortgeschritten	Naja, du könntest statt der ID einfach direkt den Text übergeben, der reingeschrieben werden soll __________________ Wir suchen PHP Entwickler (Vollzeit) im Raum Darmstadt / Rhein-Main. Infos via E-Mail mueller@new-frontiers.de