jquery javascript
Showing posts with label jquery javascript. Show all posts
Showing posts with label jquery javascript. Show all posts

Find All Checkboxes Javascript, Mencari Semua Checkbox di jQuery JavaScript (Multi Checbox)

Add Comment
Find all checkboxes javascript
Multiple Checkbox

 You can find many examples on the web, but here goes.
Using normal JavaScript (NP: I have not run this code):

?
1
2
3
4
5
6
7
8
9
10
11
12
13
var inputs = document.getElementsByTagName("input"); //or document.forms[0].elements;
var cbs = []; //will contain all checkboxes
var checked = []; //will contain all checked checkboxes
for (var i = 0; i < inputs.length; i++) {
  if (inputs[i].type == "checkbox") {
    cbs.push(inputs[i]);
    if (inputs[i].checked) {
      checked.push(inputs[i]);
    }
  }
}
var nbCbs = cbs.length; //number of checkboxes
var nbChecked = checked.length; //number of checked checkboxes

Using jQuery:?
1
2
3
4
5
var cbs = $("input:checkbox"); //find all checkboxes
var nbCbs = cbs.size(); //the number of checkboxes
  
var checked = $("input[@type=checkbox]:checked"); //find all checked checkboxes + radio buttons
var nbChecked = checked.size();




Sekian, terimakasih atas kunjungannya.
Salam,
PHP Aku : Membangun web terorganisasi dan mudah dimengerti, contoh tutorial dengan menggunakan HTML, CSS, JavaScript, SQL, PHP, dan XML.

Catatan tentang Tentang Sweet Alert

Add Comment

SweetAlert adalah salah satu plugin javascript yang gunanya untuk mempercantik alert atau informasi kepada pengguna website anda. Silakan kunjungi link di bawah ini untuk belajar lebih banyak lagi, karena dalam artikel ini, isinya adalah catatan kasus-kasus yang pernah penulis temui agar berharap membantu anda jika anda menemui kasus yang sama.

http://t4t5.github.io/sweetalert/

- SweetAlert dengan Timer

     success: function (result) {
        var txt = 'Data Berhasil disimpan';
        var type = 'success';
        if (result == 0) {
            txt = 'Data Gagal disimpan';
            type = 'error';
        }
        swal({
            title: 'Informasi!',
            text: txt,
            type: type,
            showConfirmButton: false,
            timer: 1500
        }).catch(function (timeout) {
            window.location.href = result;
        });
    }



Sekian, terimakasih atas kunjungannya.
Salam,
PHP Aku : Membangun web terorganisasi dan mudah dimengerti, contoh tutorial dengan menggunakan HTML, CSS, JavaScript, SQL, PHP, dan XML.

Cara Mengatasi Jquery Tidak Selalu Berjalan - Uncaught TypeError: $ is not a function

Add Comment
JQuery - Membuka Sebuah Halaman dengan Selector



Jika jquery kita tidak berjalan semestinya, maka web tidak akan terbuka sepenuhnya. Ini bisa dilihat ketika running atau menjalankan link website, kita spek element akan muncul error seperti di bawah ini:

Uncaught TypeError: $ is not a function

Mungkin salah satu penyebabnya adalah jquery tidak terpanggil semestinya, berikut cara mengatasinya:

Setelah jquery dipanggil, di dalam tag <head /> dimasukkan kode di bawah ini:

<script type="text/javascript">
if (typeof jQuery == 'undefined')
    document.write(unescape("%3Cscript src='/path/jquery' type='text/javascript'%3E%3C/script%3E"));
</script>




Sekian, terimakasih atas kunjungannya.
Salam,
PHP Aku : Membangun web terorganisasi dan mudah dimengerti, contoh tutorial dengan menggunakan HTML, CSS, JavaScript, SQL, PHP, dan XML.

JQuery - Membuka Sebuah Halaman menggunakan Selector

Add Comment
JQuery - Membuka Sebuah Halaman dengan Selector



Bagaimana cara membuka sebuah halaman menggunakan selector id atau class? Berikut contohnya:
<script src="<?php echo base_url(); ?>assets/js/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $('#loads').fadeOut(5000, function () {
            $("#data").load("<?php echo site_url('dashboard/data_skpd'); ?>" + id, function() {
            });
        });
    });
</script>




Sekian, terimakasih atas kunjungannya.
Salam,
PHP Aku : Membangun web terorganisasi dan mudah dimengerti, contoh tutorial dengan menggunakan HTML, CSS, JavaScript, SQL, PHP, dan XML.

Contoh Menu Fixed Position

Add Comment
fixed


Ketika kita berbicara mengenai menu navigasi yang cocok untuk kasus data yang terlalu besar, ada kalanya kita menerapkan navigasi dengan fixed position. Maksudnya, membuat menu navigasi yang selalu muncul dan berada di atas. Berikut contohnya:


HTML
<ul class="nav cf">
        <li><a href="">Home</a></li>
        <li><a href="">CSS</a></li>
        <li><a href="">PHP</a></li>
        <li><a href="">SEO</a></li>
        <li><a href="">jQuery</a></li>
        <li><a href="">Wordpress</a></li>
        <li><a href="">Services</a></li>
    </ul>

CSS

.f-nav{ z-index: 9999; position: fixed; left: 0; top: 0; width: 100%; padding:0 20px;} /* ini yang membuat menu menjadi melayang (fixed) */
    
.nav {
background: rgba(26, 37, 82, 0.24);
margin:0 0 20px 0;
}
.nav li {
list-style-type:none;
float:left;
display:inline-block;
padding:10px;
}

jQuery

<!-- jquery library -->
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script>
jQuery("document").ready(function($){
    
    var nav = $('.nav');
    
    $(window).scroll(function () {
        if ($(this).scrollTop() > 136) {
            nav.addClass("f-nav");
        } else {
            nav.removeClass("f-nav");
        }
    });
});
</script>



Sumber: yudiyusti[dot]com
Sekian, terimakasih atas kunjungannya.
Salam,
PHP Aku : Membangun web terorganisasi dan mudah dimengerti, contoh tutorial dengan menggunakan HTML, CSS, JavaScript, SQL, PHP, dan XML.
Subscribe to: Posts (Atom)