ドロップダウン用の連絡先form7のプレースホルダーを追加するにはどうすればよいですか？

Question

ドロップダウン用の連絡先form7のプレースホルダーを追加するにはどうすればよいですか？

- 18
- 112756 2016-01-06
ドロップダウンアウトレットの連絡先番号に指定されているのと同様のプレースホルダーを追加しようとしましたが、表示されません.

コード-

<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>

first_as_label "Preferred outlet?"を追加して、通常のドロップダウン値として表示されるようにしました.

すべてのフィールドにプレースホルダーが表示されますが、ドロップダウン用のプレースホルダーを指定する他の方法はありますか?
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

- プレースホルダーオプションは、テキスト、メール、URL、電話、テキストエリア、数値、範囲、日付、キャプチャの種類のフォームタグで使用できます.[cf7プレースホルダー](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
- ドロップダウンについては、他に選択肢はありませんか?
  
  so for drop down we don't have any other choice?
  - 0
  - 2016-01-06
  - Sanjuktha sandesh

2 回答

投票

- 100
- 2016-01-06
受け入れられた回答が示唆していることに反して、それは実際に可能であり、お問い合わせフォーム7に組み込まれています.これが実際のオプションのリスト[select]が保持します.ほとんどの場合、first_as_labelを使用して、最初のオプションをプレースホルダーとして定義します.

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

従来はプレースホルダーのようには見えませんが、必要な場合、ユーザーはプレースホルダーを選択してフォームを送信できません.これにより、ユーザーは他のオプションを選択する必要があります.
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.
- help.iはすでに `first_as_label`を試しましたが、あなたが言ったように、他のプレースホルダー値とは似ていませんでした.
  
  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
- これはまともな解決策です.そして、それは正しく機能します-最初のオプションを使用しようとすると、フォームは送信されません.最初のオプションをフォーマットするには、選択ボックスをターゲットにします(つまり、 `.wpcf7 select [name="menu-70 "] {color:#aaa;}`.次に、オプションをターゲットにすることで、オプションを暗くすることができます(つまり、 `.wpcf7 select [name="menu-70"] option {color:#333;} `.最初のオプションはフォーカスが強調されているため、この部分を変更しない限り、ソリューションはうまく機能します.
  
  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
- 単純なもの(オプションの選択)がほとんどの人に期待されているものを見逃していない限り、なぜ誰かが選択オプションをプレースホルダーのように見せたいのか完全にはわかりません.ドキュメントを自分で読む必要がないようにしてくれてありがとう！
  
  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

質問に答える:これは不可能です.

AFAIK、(HTMLwise)タグを選択するためのプレースホルダーを追加する方法はありません.

私が知っている多くの開発者は、オプションにdisabled selectedの組み合わせを使用する傾向があります...

 <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>

デモ

CF7のソースコード(バージョン4.3.1)を確認しましたが、このhtml形式を簡単に実現する方法はありません.

wpcf7_add_shortcode_selectのwpcf7_initアクションを削除し、代わりに自分のアクションを追加することで、難しい方法を実行できます.

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.

この回答は本当に削除するか、受け入れるか、間違っているかどうかを確認する必要があります.非常に古い回答ではなく、正しい回答と同じ日に提供されました.

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