Wie füge ich einen Platzhalter für Kontaktformular7 für Dropdown hinzu? [geschlossen]

16

Ich habe versucht, einen Platzhalter hinzuzufügen, der dem für ContactNumber angegebenen Platzhalter für mein Dropdown- Outlet ähnelt, der jedoch nicht angezeigt wird .

Code-

<div class="form-group form-icon-group">
    <i class="fa fa-phone" > </i> [tel* ContactNumber /8 class:form-control placeholder "Contact Number *"]
</div>
<div class="form-group form-icon-group">
<i class="fa fa-food" > </i> [select Outlet id:outlet class:form-control "-- Select Outlet--" "Pasir Ris" "Thomson"]
</div>

Beim Hinzufügen wurde versucht, first_as_label "Preferred outlet?"dies als normale Dropdown-Werte anzuzeigen.

Zeigen alle Felder den Platzhalter an, gibt es eine andere Möglichkeit, den Platzhalter für das Dropdown-Menü festzulegen?

Sanjuktha Sandesh
quelle
1
Sie können die Platzhalteroption in den folgenden Arten von Formular-Tags verwenden: Text, E-Mail, URL, Telefon, Textbereich, Nummer, Bereich, Datum und Captchar. cf7 placeholder
Reigel
Also für Dropdown haben wir keine andere Wahl?
Sanjuktha Sandesh

Antworten:

2

um die frage zu beantworten: das ist nicht möglich.

AFAIK, (HTMLwise) Es gibt keine Möglichkeit, einen Platzhalter zum Auswählen von Tags hinzuzufügen.

Viele Entwickler, die ich kenne, tendieren jedoch dazu, disabled selectedKombinationen für die Option zu verwenden ...

<select>
    <option value="" disabled selected>Select your option</option>
    <option value="ydasdas">ydasdas</option>
    <option value="dasda">dasda</option>
    <option value="ydagfdsdas">ydagfdsdas</option>
    <option value="ewefsdf">ewefsdf</option>
</select>

Demo

Ich habe den Quellcode von CF7 (Version 4.3.1) überprüft und es gibt keine einfache Möglichkeit, dieses HTML-Format zu erreichen.

Sie können den harten Weg gehen, indem Sie die wpcf7_add_shortcode_selectAktion wpcf7_initaufheben und stattdessen Ihre hinzufügen.

Reigel
quelle
2
Diese Antwort sollte wirklich entfernt werden, akzeptiert werden oder nicht. Sie ist nicht wie eine sehr alte Antwort. Sie wurde am selben Tag wie die richtige Antwort geliefert.
Rick Calder
78

Im Gegensatz zu dem, was die akzeptierte Antwort schon sagt, ist es tatsächlich möglich , und in Kontaktformular gebaut 7. Hier ist die aktuelle Liste der Optionen [select]hält . Ziemlich genau würden Sie die erste Option definieren, um der Platzhalter zu sein, indem Sie verwenden first_as_label:

[select* Test first_as_label "Placeholder" "Option 1" "Option 2"]

Während es normalerweise nicht wie ein Platzhalter aussieht, kann der Benutzer den Platzhalter nicht auswählen und das Formular senden, wenn dies erforderlich ist. Dies zwingt den Benutzer, eine der anderen Optionen auszuwählen.

Howdy_McGee
quelle
Vielen Dank für die Hilfe. Ich habe es bereits versucht, first_as_labelaber wie Sie sagten, sah es nicht nach anderen Platzhalterwerten aus.
Sanjuktha Sandesh
4
Dies ist eine anständige Lösung. Und es funktioniert einwandfrei - das Formular wird nicht gesendet, wenn Sie versuchen, die erste Option zu verwenden. Um die erste Option zu formatieren, zielen Sie einfach auf das Auswahlfeld (d .wpcf7 select[name="menu-70"] { color:#aaa; }. .wpcf7 select[name="menu-70"] option { color:#333; }H., Sie können die Optionen dunkler machen, indem Sie auf die Optionen zielen (d . H. Die erste Option ist fokussiert). Wenn Sie also diesen Teil nicht ändern möchten, funktioniert die Lösung hervorragend.
Rob Myrick
Ich bin mir nicht ganz sicher, warum jemand möchte, dass eine Auswahloption wie ein Platzhalter aussieht, es sei denn, mir fehlt etwas Einfaches. Vielen Dank, dass ich die Dokumentation nicht selbst durchgesehen habe!
Rick Calder