Saat kita sedang menginput sebuah text yang panjang mungkin perlu suatu batasan jumlah text supaya data yang kita input tidak terlalu banyak sehingga dapat ditampilkan sesuai kebutuhan yang ada. Salah satu contohnya adalah twitter, kita hanya bisa membuat postingan twett sepanjang 140 karakter text saja, jadi jika melebihi batas yang sudah ditentukan maka tombol submit twett tidak bisa diklik twett tersebut.
Saya akan membagikan tutorial yang simple cara menghitung jumlah karakter Menggunakan jquery mungkin ini dapat membantu kalian untuk mengerjakan sebuah project.
Berikut tutorial cara menghitung jumlah karakter dengan jquery
<div class="form-group">
<div class="col-md-12">
<textarea class="message form-control" rows="5" cols="30" ></textarea>
<span class="countdown"></span>
<button type="submit" class="btn_cut btn" id="update">
Update
</button>
</div>
</div> $(document).ready(function ($) {
updateCountdownAll();
$('.message').live('input', updateCountdown);
});
function updateCountdownAll() {
$('.message').each(function () {
updateCountdown(this);
});
}
function updateCountdown(e) {
var currentElement;
if (e.target) {
currentElement = e.target;
} else {
currentElement = e;
}
var maxLengh = 50;
var remaining = maxLengh - $(currentElement).val().length;
$(currentElement).nextAll('.countdown:first').text(remaining).css('color', 'black');
if (remaining == 0 ){
$('.countdown:first').hide();
$(':input[type="submit"]').removeAttr("disabled");
}else if(remaining < 0){
$(currentElement).nextAll('.countdown:first').text(remaining).css('color', 'red').show();
$(':input[type="submit"]').prop('disabled', true);
}else{
$(currentElement).nextAll('.countdown:first').text(remaining).css('color', 'black').show();
}
} 
Saat kita sedang menginput sebuah text yang panjang mungkin perlu suatu batasan jumlah text supaya data yang kita input tidak terlalu banyak sehingga dapat ditampilkan sesuai kebutuhan yang ada. Salah satu contohnya adalah twitter, kita hanya bisa membuat postingan twett sepanjang 140 karakter text saja, jadi jika melebihi batas yang sudah ditentukan maka tombol submit twett tidak bisa diklik twett tersebut.
Saya akan membagikan tutorial yang simple cara menghitung jumlah karakter Menggunakan jquery mungkin ini dapat membantu kalian untuk mengerjakan sebuah project.
Berikut tutorial cara menghitung jumlah karakter dengan jquery
<div class="form-group">
<div class="col-md-12">
<textarea class="message form-control" rows="5" cols="30" ></textarea>
<span class="countdown"></span>
<button type="submit" class="btn_cut btn" id="update">
Update
</button>
</div>
</div> $(document).ready(function ($) {
updateCountdownAll();
$('.message').live('input', updateCountdown);
});
function updateCountdownAll() {
$('.message').each(function () {
updateCountdown(this);
});
}
function updateCountdown(e) {
var currentElement;
if (e.target) {
currentElement = e.target;
} else {
currentElement = e;
}
var maxLengh = 50;
var remaining = maxLengh - $(currentElement).val().length;
$(currentElement).nextAll('.countdown:first').text(remaining).css('color', 'black');
if (remaining == 0 ){
$('.countdown:first').hide();
$(':input[type="submit"]').removeAttr("disabled");
}else if(remaining < 0){
$(currentElement).nextAll('.countdown:first').text(remaining).css('color', 'red').show();
$(':input[type="submit"]').prop('disabled', true);
}else{
$(currentElement).nextAll('.countdown:first').text(remaining).css('color', 'black').show();
}
} 
