@html.checkbox Disabled Razor

MUAZHAN

2 min read

·

Jul 01, 2024

29

Share

Cara Menggunakan @html.checkbox Disabled dalam Razor

Dalam pengembangan web menggunakan Razor, seringkali kita perlu menonaktifkan kontrol input, termasuk kotak centang (checkbox). Dalam kasus ini, kita dapat menggunakan helper @Html.Checkbox dengan atribut disabled untuk mencapai tujuan tersebut.

Berikut adalah contoh kode Razor yang mendemonstrasikan cara menonaktifkan kotak centang:

@model MyModel

@{
    // Menentukan apakah kotak centang dinonaktifkan atau tidak
    bool isDisabled = Model.IsDisabled; 
}


    @Html.CheckboxFor(m => m.IsChecked, new { disabled = isDisabled })
    @Html.LabelFor(m => m.IsChecked)

Penjelasan:

• @Html.CheckboxFor: Helper Razor ini digunakan untuk menghasilkan kontrol kotak centang yang terikat ke properti model IsChecked.
• disabled: Atribut HTML yang digunakan untuk menonaktifkan kontrol input.
• new { disabled = isDisabled }: Ini adalah objek anonim yang menyimpan atribut HTML tambahan untuk kontrol kotak centang. Dalam kasus ini, kita menetapkan nilai disabled ke isDisabled, yang merupakan variabel Boolean yang menentukan apakah kotak centang akan dinonaktifkan.

Cara Kerja:

Dalam contoh di atas, nilai isDisabled berasal dari properti IsDisabled model MyModel. Jika IsDisabled bernilai true, kotak centang akan dinonaktifkan. Jika IsDisabled bernilai false, kotak centang akan diaktifkan.

Contoh Penggunaan:

Misalnya, Anda memiliki formulir untuk mendaftarkan pengguna. Setelah pengguna selesai mendaftar, Anda mungkin ingin menonaktifkan kotak centang "Syarat dan Ketentuan" untuk mencegah mereka mengubah statusnya. Anda dapat menggunakan helper @Html.Checkbox dengan atribut disabled untuk mencapai ini.

Catatan:

• Ketika kotak centang dinonaktifkan, pengguna tidak dapat mengubah statusnya.
• Nilai disabled harus berupa Boolean (true atau false).

Dengan memahami cara menggunakan @Html.Checkbox dengan atribut disabled, Anda dapat mengendalikan interaksi pengguna dengan formulir dan kontrol input Anda dengan lebih baik.