Untuk pilihan saya yang lebih signifikan, kotak pencarian di Select2 luar biasa. Namun, dalam satu contoh, saya memiliki pilihan sederhana 4 pilihan hard-coded. Dalam hal ini, kotak pencarian berlebihan dan terlihat konyol. Apakah mungkin menyembunyikannya? Saya melihat-lihat dokumentasi online dan tidak dapat menemukan opsi untuk ini di konstruktor.
Saya bisa, tentu saja, hanya menggunakan pilih html biasa, tetapi untuk konsistensi saya ingin menggunakan Select2 jika memungkinkan.
jquery
jquery-select2
EleventyOne
sumber
sumber
hide
Metode ini dijelaskan di sini: api.jquery.com/hide Selama Anda hanya menerapkannya pada pemilih yang sesuai, ya, itu harus menyembunyikan kotak pencarian saja. Namun demikian, ada metode khusus plugin yang dapat digunakan untuk menyembunyikannya, yang saya sarankan Anda gunakan sebagai gantinya (lihat di bawah).Jawaban:
Lihat utas ini https://github.com/ivaynberg/select2/issues/489 , Anda dapat menyembunyikan kotak pencarian dengan menetapkan minimumResultForSearch ke nilai negatif.
sumber
Infinity
bukan nilai negatif. Hasil edit Anda membuat teks dan kode tidak cocok. Masalah yang terkait secara khusus menunjukkan bahwa nilai negatif adalah pendekatan yang didukung dengan benar. Masalah yang ditautkan dengan juga mengklaim "Nilai minimumRestultsForSearch tinggi hanya menyembunyikan kotak pencarian di pilih yang dipilih. Tetapi jika kita mengetikkan beberapa huruf saat pilih ditutup dan fokus - pencarian akan muncul, tidak peduli seberapa tinggi" dan meskipun saya tidak dapat mereproduksi masalah khusus itu dalam versi saat ini, kemungkinan akan menjadi masalah nyata di versi yang lebih lama. Karena alasan itu, saya memutar kembali hasil edit Anda.Itu ada di halaman Contoh mereka: https://select2.org/searching#hiding-the-search-box
sumber
sumber
Versi 4.0.3
Cobalah untuk tidak mencampur persyaratan antarmuka pengguna dengan kode JavaScript Anda.
Anda dapat menyembunyikan kotak pencarian di markup dengan atribut:
data-minimum-results-for-search="Infinity"
Markup
Contoh
sumber
Menghapus input dengan jQuery berfungsi untuk saya:
sumber
Ini adalah solusi terbaik, bersih dan berfungsi dengan baik:
Lalu, buat kelas
.hidden { display;none; }
sumber
Jika Anda ingin menyembunyikan pencarian untuk drop down tertentu gunakan atribut id untuk itu.
sumber
Jika pilih ini menunjukkan hasil, Anda harus menggunakan ini:
itu menutup kotak hasil pencarian dan kemudian mengatur kontrol tidak terlihat
sumber
Saya suka melakukan ini secara dinamis tergantung pada jumlah opsi dalam pilih; untuk menyembunyikan pencarian dengan hasil 10 atau lebih sedikit, saya lakukan:
sumber
sumber
sumber
Jika Anda memiliki multi atribut pada pilihan Anda, hack kotor ini berfungsi:
lihat dokumen di sini https://select2.org/searching#limiting-display-of-the-search-box-to-large-result-sets
sumber
Jika Anda ingin menyembunyikan pada pembukaan awal dan Anda mengisi dropdown melalui panggilan ajax, tambahkan berikut ini ke blok ajax di deklarasi select2 Anda:
Untuk kemudian menampilkannya lagi (dan fokus) setelah permintaan ajax Anda berhasil:
sumber
Anda bisa mencoba ini
itu menutup kotak hasil pencarian dan kemudian mengatur kontrol tidak terlihat
Anda dapat memeriksa di sini di dokumen select2 dokumen select2
sumber
@Misha Kobrin bekerja dengan baik untuk saya. Jadi saya memutuskan untuk menjelaskannya lebih lanjut
Anda ingin menyembunyikan kotak pencarian yang bisa Anda lakukan dengan jQuery.
misalnya Anda telah menginisialisasi plugin select2 pada drop down memiliki id audiens
Contoh ini bekerja pada semua perangkat yang berfungsi select2
sumber
Saya mengedit
select2.min.js
file untuk mengaturselect-2__search
bidang input yang dihasilkanreadonly="true"
.sumber
Untuk pilihan ganda Anda harus menulis kode js, tidak ada properti pengaturan.
Ini disebutkan di halaman mereka: https://select2.org/searching#multi-select
sumber
coba CSS ini
input ini adalah kolom pencarian
sumber