contact
WA: 0822-8846-7823
SMS: 0822-8846-7823
Call: 0822-8846-7823
BBM: D7DB3491
ebsofmail@gmail.com

Validasi Form dengan Disabled Tombol Submit Form

Posted in Javascript Jquery Life at 21 Desember 2016 With 0 Comments

Tutorial kali ini merupakan artikel tentang validasi Form dengan Teknik Disable tombol submit di form sebelum apa yang diinputkanuser dalam kategori benar di logika programnyal. Untuk Validasi Tombol submit disabled sebelum user menginputkan dengan benar, bisa dilihat pada gambar dibawah ini :

validasi disabel tombol submit form

▼ Download Source Code Dibawah Ini ▼


 

 Pada contoh diatas, jika user tidak menginputkan dengan data maksimal sebanyak 6, dan minimal 6, maka tombol submit di form akan disabled, sehingga pengiriman data tidak akan dapat dilakukan tanpa adanya action di tombol submit, Untuk codenya anda bisa lihat dibawah ini :

Code HTML

<input type="text" maxlength="6" id="check" data-minlength="6" /><br />
<input type="submit" value="send" />

Javascript

$(function() {
    $('input[type="submit"]').prop('disabled', true);
    $('#check').on('input', function(e) {
        if(this.value.length === 6) {
            $('input[type="submit"]').prop('disabled', false);
        } else {
            $('input[type="submit"]').prop('disabled', true);
        }
    });
});

 

Artikel Rekomendasi



Artikel Terkait

Diskusi