Bagaimana cara menambahkan placeholder untuk form7 kontak untuk dropdown? [Tutup]


16

Saya mencoba menambahkan placeholder mirip dengan yang diberikan untuk ContactNumber untuk drop down Outlet saya tetapi tidak muncul.

Kode-

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

Mencoba menambahkan first_as_label "Preferred outlet?"sehingga ini ditampilkan sebagai nilai drop-down biasa.

Selebihnya semua kolom menampilkan placeholder, cara lain untuk memberikan placeholder untuk drop down?


1
Anda bisa menggunakan opsi placeholder dalam jenis tag formulir berikut: teks, email, url, tel, textarea, nomor, rentang, tanggal, dan captchar. cf7 placeholder
— Reigel

jadi untuk drop-down kita tidak punya pilihan lain?
— Sanjuktha sandesh

Jawaban:


2

untuk menjawab pertanyaan: ini tidak mungkin.

AFAIK, (HTMLwise) tidak ada cara untuk menambahkan placeholder untuk memilih tag.

Banyak devs yang saya tahu namun cenderung menggunakan disabled selectedkombinasi untuk opsi ...

<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

Saya telah memeriksa kode sumber CF7 (versi 4.3.1), dan tidak ada cara mudah untuk mencapai format html ini.

Anda dapat melakukannya dengan menghapus wpcf7_add_shortcode_selecttindakan wpcf7_initdan menambahkan tindakan Anda sebagai gantinya.


2
Jawaban ini benar-benar harus dihapus, diterima atau tidak salah, dan ini bukan jawaban yang sangat lama, tetapi diberikan pada hari yang sama dengan jawaban yang benar.
— Rick Calder

78

Bertentangan dengan apa jawaban yang diterima menunjukkan, itu benar-benar adalah mungkin dan dibangun ke dalam Contact Form 7. Berikut sebenarnya daftar pilihan [select]memegang . Cukup banyak Anda akan menentukan opsi pertama untuk menjadi pengganti menggunakan first_as_label:

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

Meskipun secara tradisional tidak akan terlihat seperti placeholder, jika diperlukan, pengguna tidak akan dapat memilih placeholder dan mengirim formulir - ini memaksa pengguna untuk memilih salah satu opsi lain.


Terima kasih atas bantuannya. Saya sudah mencoba first_as_labeltetapi seperti yang Anda katakan itu tidak terlihat mirip dengan nilai placeholder lainnya.
— Sanjuktha sandesh

4
Ini solusi yang layak. Dan itu berfungsi dengan baik - formulir tidak mengirim jika Anda mencoba menggunakan opsi pertama. Untuk memformat opsi pertama, cukup targetkan kotak pilih (mis .wpcf7 select[name="menu-70"] { color:#aaa; }. Kemudian Anda dapat membuat opsi lebih gelap dengan menargetkan opsi (mis .wpcf7 select[name="menu-70"] option { color:#333; }. Opsi pertama menyoroti pada fokus, jadi kecuali jika Anda ingin mengubah bagian ini, solusinya bekerja dengan baik.
— Rob Myrick

Saya tidak sepenuhnya yakin mengapa ada orang yang menginginkan opsi pilih terlihat seperti pengganti kecuali jika saya melewatkan sesuatu yang sederhana - Pilih opsi - adalah apa yang diharapkan oleh kebanyakan orang. Terima kasih banyak telah menyelamatkan saya dari melihat dokumentasi sendiri!
— Rick Calder
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.