Zum Inhalt springen

Datepicker und weitere jQuery-Elemente für Fluid?

Erstellt am 16. September 2011 · 8 Antworten · letzte Antwort am 17. März 2012

Tags: Frage

Vivid ·

Gibt es schon Widgets oder Partials zum Thema Datepicker? Gerade im Frontend wäre das doch ideal, um ein Datum einzutragen. Generell wären dort mal ein paar jQuery-Erweiterungen sinnvoll. Z.B. solche Selectionboxes, damit man mehr als nur eine Auswahl tätigen kann. :-)

BFSven ·

Ich versteh die Frage nicht ganz, der DatePicker hat doch nix mit Fluid zu tun!?

Ich hab in sehr vielen Extbase/Fluid-Projekten und -Extensions jQuery bzw den DatePicker im Einsatz.

Habt ihr Probleme beim Einbinden? Wie können wir konkret helfen?

Gruß, Sven

metaxos ·

Hallo BFSven

Vielen Dank, dann kannst du uns sicher helfen. Hättest du ein konkretes Beispiel wie wo was eingebunden werden soll damit es "richtig" und "sauber" ist. Konnte dazu kein schlüssiges Beispiel finden, möchte auch so viel wie möglich mit Bordmitteln handeln.
Vielen Dank.

BFSven ·

Na dann versuch ich es mal:

Die Einbindung der Sources mache ich im Layout:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="{f:uri.resource(path:'JavaScript/jquery-ui-1.8.18.custom.min.js')}"></script>

sowie zusätzlich meine JavaScript-Datei

<script type="text/javascript" src="{f:uri.resource(path:'JavaScript/myext.js')}"></script>

weiterhin habe ich Variablen im Layout definiert:

<script type="text/javascript">
	jQuery.noConflict();
	var myVar1 = '{location.name}';
	var myVar2 = '{location.city.uid}';
}...

Den Rest an jQuery/JavaScript habe ich dann in die myext.js ausgelagert.

Mehr ist das eigentlich nicht, wo haperts dann noch?

Beste Grüße,
Sven

metaxos ·

Hi BFSven

Vielen lieben Dank.
Wie verbindest du das Javascript mit dem Datum-Formularfeld?
Hattest du das jquery-ui-1.8.18.custom.min.js generiert? Warum hast du zwei jquerys?

Viele Grüsse

BFSven ·

Hey,

eigentlich sinds ja sogar drei js-files:
1.) jQuery
2.) jQuery-UI
3.) meine eigene

Das Datums-Inputfield bekommt einfach eine Klasse (z.B. .datepicker) der ich dann in meiner js-datei den Datepicker zuweise. Dazu schaust Du Dir am besten jqueryui.com/demos/datepicker/ an.

Weitere Links:
jqueryui.com/home
docs.jquery.com/Main_Page

Das UI-min hatte ich mir generieren lassen (auf o.g. Seite), weil ich ja nicht alle UI-Elemente brauche. Klick mal ein bisschen rum, in den Docs findest Du eigentlich immer gute Beispiele.

Gruß,
Sven

metaxos ·

Hi BFSven

Vielen Dank für deine Hilfe, hat uns vorangebracht.
Die Verwirrung ist noch wann man z.b. so ein Datepicker in ein ViewHelper auslagern sollte??

Viele Grüsse

BFSven ·

Was meinst Du mit auslagern? DatePicker ist hauptsächlich jQuery, da müsssen nur die Klassen/ID der Eingabefelder angepasst werden.

Vielleicht hab ich Dich auch nicht ganz verstanden?