Neulich musste ich in einem Formular des sehr beliebten Plugin Contact Form 7 ein Feld auf „readonly“ setzen. Ich war etwas verwundert, dass es für das Setzen dieser Eigenschaft keine Checkbox oder sonstige Möglichkeit in der GUI gibt. Auf der Suche nach der Lösung musste ich feststellen, dass man im Netz jede Menge – nennen wir sie… suboptimale Lösungen – findet. Die einfache Lösung vorweg: Es gibt in der aktuellen Version des Plugins die Eigenschaft „readonly“ und diese kann einfach als Parameter im Formularfeld mit übergeben werden.
[textarea* my-text readonly "Nicht editierbarer Defaultwert"]Da das Plugin „readonly“ nicht schon immer unterstützt. möchte ich hier eine weitere Möglichkeit vorstellen. Diese könnt Ihr verwenden, wenn ihr – warum auch immer – eine alte Version des Plugins im Einsatz habt.
Dazu wird dem entsprechenden Feld bzw. den Feldern in der Seite eine entsprechende eigene Class zugewiesen (Im Beispiel wurde „myreadonly“ verwendet). Mit folgendem Code kann anschließend allen Elementen dieser Class auf der Seite die Eigenschaft „readonly“ zugewiesen werden. Der Code muss dazu in der entsprechenden Seite eingebunden werden. Folgendem Eintrag im Codex kann entnommen werden wie genau das funktioniert.
jQuery(document).ready(function ($) {
$('.wpcf7-form .myreadonly').prop('readonly', true);
});
Wichtig zu wissen ist hier, dass die Eigentschaft „disabled“ nicht funktioniert, da so die Validierung fehlschlägt. Es muss also „readonly“ verwendet werden.
Eine eigene CSS Class lässt sich über das im Screenshot markierten Feld zuweisen.
