Wie füge ich einen Platzhalter für das Kontaktformular7 für die Dropdown-Liste hinzu?

Question

Wie füge ich einen Platzhalter für das Kontaktformular7 für die Dropdown-Liste hinzu?

- 18
- 112756 2016-01-06
Ich habe versucht,einen Platzhalter hinzuzufügen,der demfür Kontaktnummer fürmein Dropdown-Menü Outlet angegebenen ähnlichist,aberer wirdnicht angezeigt.

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>

Es wurde versucht,first_as_label "Preferred outlet?" hinzuzufügen,damit dies alsnormale Dropdown-Werte angezeigt wird.

In allen Feldern wird der Platzhalter angezeigt. Gibteseine andere Möglichkeit,einen Platzhalterfür das Dropdown-Menü anzugeben?
I tried adding placeholder similar to the given for ContactNumber for my drop down Outlet but it doesn't appear.

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>

Tried adding first_as_label "Preferred outlet?" so this displays as ordinary drop down values.

Rest all of the fields do show the placeholder,any other way to give placeholder for drop down?
plugin-contact-form-7

- Sie können die Platzhalteroptionin denfolgenden Arten von Formular-Tags verwenden: Text,E-Mail,URL,Telefon,Textbereich,Nummer,Bereich,Datum und Captchar.[cf7 Platzhalter] (http://contactform7.com/setting-placeholder-text/)
  
  You can use the placeholder option in the following types of form tags: text, email, url, tel, textarea, number, range, date, and captchar. [cf7 placeholder](http://contactform7.com/setting-placeholder-text/)
  - 1
  - 2016-01-06
  - Reigel
- Also haben wirfür Dropdown keine andere Wahl?
  
  so for drop down we don't have any other choice?
  - 0
  - 2016-01-06
  - Sanjuktha sandesh

2 Antworten

Stimmen

- 100
- 2016-01-06
Im Gegensatz zu den akzeptierten Antwortenist diestatsächlichmöglich undin Kontaktformular 7integriert. Hierist dietatsächliche Liste der Optionen [select]gilt .Mit first_as_label:
würden Sie dieerste Option als Platzhalter definieren
[select* Test first_as_label "Placeholder" "Option 1" "Option 2"]

Obwohlestraditionellnicht wieein Platzhalter aussieht,kann der Benutzer den Platzhalterbei Bedarfnicht auswählen und das Formular senden. Dies zwingt den Benutzer,eine der anderen Optionen auszuwählen.
Contrary to what the accepted answer suggests, it actually is possible and built into Contact Form 7. Here's the actual list of options [select] holds. Pretty much you would define the first option to be the placeholder using first_as_label:

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

While it won't traditionally look like a placeholder, if it's required the user won't be able to select the placeholder and send the form - this forces the user to select any of the other options.
- Vielen Dankfür die Hilfe. Ich habebereits `first_as_label` ausprobiert,aber wie Sie sagten,sahes anderen Platzhalterwertennicht ähnlich.
  
  Thanks for the help.i already tried `first_as_label` but as you said it didn't look similar to other placeholder values.
  - 0
  - 2016-01-07
  - Sanjuktha sandesh
- Diesisteine anständige Lösung.Undesfunktioniert ordnungsgemäß - das Formular wirdnichtgesendet,wenn Sie versuchen,dieerste Option zu verwenden.Um dieerste Option zuformatieren,zielen Sieeinfach auf das Auswahlfeld (dh `.wpcf7 select [name="menu-70 "] {color: #aaa;}`. Dann können Sie die Optionen dunklermachen,indem Sie auf die Optionen zielen (dh `.wpcf7 Wählen Sie die Option [name="menu-70"] {color: # 333;} `. Dieerste Option wirdim Fokus hervorgehoben. Wenn Sie diesen Teilnicht ändernmöchten,funktioniert die Lösung hervorragend.
  
  This is a decent solution. And it does work properly - the form doesn't send if you try using the first option. To format the first option, just target the select box (i.e. `.wpcf7 select[name="menu-70"] { color:#aaa; }`. Then you can make the options darker by targeting the options (i.e. `.wpcf7 select[name="menu-70"] option { color:#333; }`. The first option is highighted on focus, so unless you want to change this part, the solution works great.
  - 4
  - 2016-09-16
  - Rob Myrick
- Ichbin mirnichtganz sicher,warumjemandmöchte,dasseine ausgewählte Option wieein Platzhalter aussieht,es sei denn,mirfehltetwas Einfaches - Wählen Sieeine Option -,was diemeisten Leuteerwarten.Vielen Dank,dass Siemich davorbewahrt haben,die Dokumentation selbst durchzusehen!
  
  I'm not entirely sure why anyone would want a select option to look like a placeholder unless I am missing something a simple --Select an option-- is what most people expect to see. Thank you very much for saving me from looking through the documentation myself!
  - 0
  - 2018-09-21
  - Rick Calder

Reigel · Accepted Answer · 2016-01-06

1

2016-01-06

um die Frage zubeantworten: Diesistnichtmöglich.

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

Viele Entwickler,dieich kenne,neigen jedoch dazu,die disabled selected Kombinationfü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 undesgibt keineeinfache Möglichkeit,dieses HTML-Format zuerreichen.

Sie können den harten Weggehen,indem Sie die Aktion wpcf7_add_shortcode_selectfür wpcf7_initentfernen und stattdessen Ihre hinzufügen.

to answer the question: this is not possible.

AFAIK, (HTMLwise) there's no way to add a placeholder to select tags.

A lot of devs I know however tend to use disabled selected combination for the option...

<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

I have checked CF7's source code (version 4.3.1), and there's no easy way we can achieve this html format.

You can go the hard way by removing wpcf7_add_shortcode_select action on wpcf7_init and add yours instead.

Diese Antwort sollte wirklichentfernt,akzeptiert odernichtfalsch sein,undesistnicht so,als wäreeseine sehr alte Antwort. Sie wurde am selben Taggeliefert wie die richtige.

This answer really should be removed, accepted or not it's incorrect, and it isn't like it's a very old answer, it was supplied on the same day as the correct one was.
- 3
- 2018-09-21
- Rick Calder