Activate JS Examples
Your trail: 

This page (revision-1) was last changed on 21-Apr-2017 08:44 by Dieter Käppel

Only authorized users are allowed to rename pages.

Only authorized users are allowed to delete pages.

Page revision history

Version Date Modified Size Author Changes ... Change note
1 21-Apr-2017 08:44 2 KB Dieter Käppel

Page References

Incoming links Outgoing links
Activate JS Examples
Activate JS Examples

Version management

Difference between version and

At line 1 added 70 lines
Auf dieser Seite befinden sich einige Beispiele für den Einsatz von [Activate JS] und [JSF Activate JS]. Wie ein Framework angewendet werden kann, zeigt sich oft durch Code aus der Praxis. Hier finden Sie solche Ausschnitte.
!!!Select2 Autocomplete Dropdown
Folgendes Beispiel zeigt die Integration des auf [JQuery] basierenden Select2-Dropdowns (Dritthersteller) in das [Activate JS] Framework. Zunächst das Control selbst:
{{{
$.controls.extend({
autocomplete: function(next) {
var value = this.control.get();
this.element.select2({
multiple: value.type == "multiple",
dropdownCssClass: "ui-widget",
createSearchChoice: function(term, data) {
return {id: term, text: term};
},
initSelection: function(element, callback) {
if (value.value == null || value.value == "")
return;
if (value.type == "multiple") {
callback($.map((value.value || "").split(","), function(value) {
return {id: value, text: value};
}));
} else {
callback({id: value.value, text: value.value});
}
},
query: function(query) {
var data = {element: value, search: query.term, page: query.page};
query.element.trigger("autocomplete", {data: data, callback: function(response) {
query.callback({results: response});
}});
}
});
this.element.select2("val", []);
next();
}
});
}}}
Folgender Code ist die Anwendung des Controls im JSF/XHTML mittels [JSF Activate JS] Basis-Tag <j:activate>:
{{{
<j:activate events="change autocomplete" value="#{autocompleteController.node}" variable="node" handler="#{autocompleteController}">
<div control="{autocomplete: this.node, bind: this.node.value}"/>
</j:activate>
}}}
Schließlich der Java-Code:
{{{
public class AutocompleteController implements Serializable {
[...]
public Node getValue() {
if (value == null)
value = new Node();
return value;
}
public void change(Node node) {
this.value = node;
}
public List<Select2Item> autocomplete(Query query) {
return getComplete().stream()
.filter(s -> s.contains(query.getSearch()))
.map(Select2Item::new)
.collect(Collectors.toList());
}
}
}}}
This page (revision-1) was last changed on 21-Apr-2017 08:44 by Dieter Käppel Top
Übersicht
Startseite
Das Unternehmen
Produkte
Consulting
Referenzen

Jobmarkt
Jobangebote
Profile

Hilfe
Suche
Seitenindex
Letzte Änderungen
Sichere Verbindung

Systeme
Tickets
Jenkins
Nexus
SVN
Email Client
1142 Aufrufe

referenziert von
Activate JS

© 2022 Intersult GmbH | Jobs | Kontakt | Presse | AGB | Impressum | Cookies | Datenschutz | Serverzeit 2024.04.27 06:35:08 GMT