APEX-AT-WORK no image

Ein paar nützliche Informationen zum APEX Autocomplete Item

Von Tobias Arnhold 12.15.2010
1. Das Item basiert auf dem JQuery Plugin: Autocomplete. Wenn Sie nähere Informationen zur Funktionsweise suchen, dann schauen Sie auf dieser Seite nach.

2. Tyler Muth erstellte unter APEX 3 eine Erweiterung für APEX: jquery-autocomplete-for-apex

3. Seit APEX 4 ist es ein Standard Item Type

4. Innerhalb des APEX Items können Sie spezielle Einstellungen für diesen Item Type vornehmen. Die wichtigste Einstellung ist die "Search"-Einstellung, Sie beinhaltet "Exact" oder "Contains" zur Auswahl.
Der entscheidende Unterschied ist die Art der Suche!
Bei dem Exact Verfahren wird ein Select ähnlich diesem während der Laufzeit aufgebaut:

-- Exact
SELECT a.*
FROM (SELECT DISTINCT CITY AS RV
FROM address_data ad
WHERE ad.country = :P1_COUNTRY
ORDER BY 1) a
WHERE "RV" LIKE :p$_search_string || '%' AND ROWNUM <= :p$_max_rows;

Wobei bei dem Contains Verfahren die INSTR Funktion verwendet wird:

SELECT a.*
FROM ( SELECT DISTINCT CITY AS RV
FROM address_data ad
WHERE country_id = :P1_COUNTRY
ORDER BY 1) a
WHERE INSTR ("RV", :p$_search_string) > 0 AND ROWNUM <= :p$_max_rows;

Bei der Verwendung von Indizes kann diese Info von entscheidenden Vorteil sein.
Ich habe zu diesem Thema vor kurzem auch eine Forum Anfrage gestartet: Problem with Textfield autocomplete --> only uses the INSTR function

5. Speichern Sie Werte nach jeder Eingabe durch eine Dynamic Action in der APEX Session *:
Event: Lose Focus
Selection Type: Item(s)
Item(s): P1_CITY
TRUE Action: Execute PL/SQL Code
PL/SQL Code: null;
Page Items To Submit: P1_CITY

6. Löschen Sie den Cache der Autocomplete Ergebnisliste durch eine Dynamic Action *:
Event: Lose Focus
Selection Type: Item(s)
Item(s): P1_CITY
TRUE Action: Execute Javascript Code
Code: $('#P1_STREET').flushCache(); $('#P1_ZIP').flushCache();

7. Sie können durch ein wenig Aufwand auch direkt durch TAB in das nächstes Input Item springen (Achtung: Item zurück SHIFT-TAB ist in der Lösung nicht möglich!)
Event: Key Release
Selection Type: Item(s)
Item(s): P1_CITY
TRUE Action: Execute Javascript Code
Code:

var vEvent = this.browserEvent.keyCode;
var vEl = this.triggeringElement;
var vName = this.triggeringElement.id;
var vButton = "9"; /* TAB Key */

/* Check ob Event TAB Press ist */
if (vEvent == vButton){

if (vName == 'P1_CITY'){
/* Flush Cache aller anderen Autocomplete Items */
$('#P1_ZIP').flushCache(); $('#P1_STREET').flushCache();
/* Sprung in naechstes Item - manuelle Vorgabe */
setTimeout(function() {$('#P1_STREET').focus();}, 1);
}

if (vName == 'P1_STREET'){
$('#P1_ZIP').flushCache(); $('#P1_CITY').flushCache();
setTimeout(function() {$('#P1_STREET_NO').focus();}, 1);
}
}


8. Aktuell fehlt noch das Lade-Icon das während der Suche im Item angezeigt wird. Dieses Problem wird in APEX 4.1 behoben sein. Workaround: APEX Page item Text Field with autocomplete doesn't show load icon

* Wichtig bei der Verwendung mehrerer Autocomplete Items auf einer Seite, da sonst der Such-Wert fehlen könnte!