Tutorials von Thomas Frei-Herrmann
Style eines Formular-Feldes mittels jQuery ändern
Zunächst vielen Dank an Stefan von SwissKnife for NOF für dieses Skript.
Der Einbau funktioniert denbar einfach.
Ihr fügt zunächst diesen Link zu dieser jQuery Datei in die HTML des Layouts ein.
> Layout markieren > Fenster “Layout-Eigenschaften” > Button “HTML” > Zwischen Head Tags einfügen
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
Nun gebt Ihr dem, zu dem entsprechenden Button passendem Eingabefeld, eine CSS-Class. Ich habe diese Class hier für die beiden Felder unterschiedlich benannt, nämlich für das obere Feld:
> Eingabefeld markieren > Fenster “Eingabefeld-Eigenschaften” > Button “HTML” > im Tag (ab NOF11 “innen”) einfügen
class="changecolor1"
... und für das untere Feld:
class="changecolor2"
Jetzt fügt Ihr Eure Buttons zur Farbwahl ein - ich habe hierfür einfach NOF-Rechtecke als Buttons verwendet und dann dort den dazu passenden onClick Befehl eingetragen.
> Button markieren > im “Eigenschaften-Fenster” auf den Button “HTML” klicken > im Tag (ab NOF 11 “innen”) einfügen
hier für meinen ersten Button mit der Class “changecolor1”
onClick="javascript: $('input.changecolor1').css({'background-color':'#0000FF','color':'#FFFF00'});"
... für den zweiten Button entsprechend die Class “changecolor2”
onClick="javascript: $('input.changecolor2').css({'background-color':'#FFFF00','color':'#0000FF'});"
... und für den Button “Löschen” habe ich gleich beide Felder in der Farbe zurückgesetzt
onClick="javascript: $('input.changecolor1,input.changecolor2').css({'background-color':'#FFFFFF','color':'#000000'});"