Tulisan ini akan mencakup topik-topik berikut:
- Bagaimana cara Menonaktifkan Bidang Input Teks?
- Bagaimana cara Menonaktifkan opsi Kotak pilih?
- Bagaimana cara Menonaktifkan Elemen input kotak centang?
- Bagaimana cara Menonaktifkan Elemen masukan tombol?
Prasyarat: Buat Formulir
Pertama, buat form dengan memanfaatkan HTML “
< membentuk >< / membentuk >
Kemudian, tambahkan “
< fieldset kelas = 'col-md-12' >
< legenda >Formulir Pendaftaran Siswa< / legenda >
< / fieldset >
Keluaran
Bagaimana cara Menonaktifkan Bidang Input Teks?
Untuk contoh yang sedang berlangsung, ikuti instruksi yang diberikan:
- Di dalam '
”, setelah elemen legenda, tambahkan tag dan berikan kelas “ form-group ”.- Kemudian, sertakan “ ' dan '
” masing-masing untuk kolom keterangan dan input. Tetapkan elemen input sebagai kelas “ bentuk-kontrol ”. - Setelah itu, alokasikan “ dengan disabilitas ” atribut untuk membuat kolom input dinonaktifkan:
< div kelas = 'bentuk-grup' >
< label > Masukkan Anda Nama
< memasukkan Tipe = 'teks' kelas = 'kontrol bentuk' dengan disabilitas>
< / label >
< / div >Berikut penjelasan dari kelas-kelas tersebut di atas:
- “ form-group ” adalah kelas fleksibel yang menyediakan cara paling sederhana untuk menyertakan struktur dalam formulir.
- “ bentuk-kontrol ” secara otomatis menambahkan gaya ke elemen formulir.
Keluaran
Tambahkan kolom input lain tanpa “ dengan disabilitas ” atribut:
< div kelas = 'bentuk-grup' >
< label > Masukkan Ayahmu Nama
< memasukkan Tipe = 'teks' kelas = 'kontrol bentuk' >
< / label >
< / div >Dapat diamati bahwa bidang input pertama dinonaktifkan dan yang kedua diaktifkan:
Bagaimana cara Menonaktifkan opsi Kotak Pilih?
Untuk membuat kotak pilih dalam formulir, gunakan HTML '
” elemen. “ ” elemen kemudian ditambahkan untuk memilih item kotak. Dalam contoh ini, perhatikan bahwa opsi kedua disetel sebagai dinonaktifkan menggunakan tombol “ dengan disabilitas ” atribut:
< div kelas = 'bentuk-grup' >
< label > Dengan disabilitas Pilih Kotak
< Pilih kelas = 'kontrol bentuk' >
< pilihan > pilih < / pilihan >
< pilihan dengan disabilitas> Dengan disabilitas pilih < / pilihan >
< pilihan >Menu< / pilihan >
< / Pilih >
< / label >
< / div >Keluaran
Bagaimana cara Menonaktifkan Elemen input kotak centang?
Mari kita buat kotak centang kontrol formulir lainnya. Untuk membuat kotak centang dinonaktifkan, tombol “ dengan disabilitas ” atribut ditentukan sebagai berikut:
< div kelas = 'pemeriksaan formulir' >
< label kelas = 'form-check-label' >
< memasukkan kelas = 'form-check-input' Tipe = 'kotak centang' dengan disabilitas>
Kamu bisa jangan periksa ini
Keluaran
Bagaimana cara Menonaktifkan Elemen masukan tombol?
Anda juga dapat menambahkan elemen tombol HTML untuk pengiriman formulir. Sekarang, mari kita buat tombol ini dinonaktifkan dengan menggunakan tombol “ dengan disabilitas ' kelas:
< tombol Tipe = 'Kirimkan' kelas = ' btn btn-primer btn-lg dinonaktifkan' >Kirim< / tombol >Keluaran
Itu semua tentang membuat kolom input dinonaktifkan di Bootstrap.
Kesimpulan
Di Bootstrap, kontrol formulir dapat dinonaktifkan menggunakan ' dengan disabilitas ” atribut atau kelas. Atribut ditempatkan di dalam tag awal elemen. Di sisi lain, “ dengan disabilitas ” kelas ditempatkan di dalam “ kelas ” atribut. Artikel ini telah memberikan contoh untuk mengilustrasikan cara menonaktifkan kontrol formulir di Bootstrap.
- Kemudian, sertakan “ ' dan '