Bootstrap – Cara Merubah Label search Box dan Entries row

By , March 2, 2017,
Bootstrap – Cara Merubah Label search Box dan Entries row

Bootstrap – Cara Merubah Label search Box dan Entries row

Bootstrap – Cara Merubah Label search Box dan Entries row. Mungkin sedikit simpel kelihatannya, hanya sebuah label yang membuat sebuah form lebih interaktif terhadap user. Namun untuk kita label dengan bahasa inggris tersebut kadang membuat risih di pandangan mata.

Nah berikut ini cara untuk mengganti label tersebut, tidak sulit, cukup menambahkan beberapa baris jquery di script yang sedang kamu buat. Untuk tabel yang digunakan sendiri yaitu menggunakan tabel dari datatables.

Cara Merubah Label search Box dan Entries row

1. Letakkan script berikut ini di atas tag html </body>

2. Script jquery mengganti label pada tabel bootsrap


$('#t2').DataTable( {

"dom": '<"top"<"pull-left"f><"pull-right"l>>rt<"bottom"<"pull-left"i><"pull-right"p>>',

"language": {

"search": "Cari:",

"lengthMenu": "Tampilkan _MENU_ baris",

"zeroRecords": "Maaf - Data tidak ada",

"info": "Halaman _PAGE_ dari _PAGES_",

"infoEmpty": "Tidak ada data",

"infoFiltered": "(pencarian dari _MAX_ data)"

},

responsive: true,

stateSave: true // keep paging

} );

Pada script diatas sebenarnya bukan hanya label dari form pencarian dan penampilan baris data saja yang dapa kita rubah. Namun untuk pesan jika baris tidak ada pada tabel juga dapat kita setting sesuai dengan bahasa kita. Selanjutnya info untuk halaman dari paging tabel, kemudian info text pencarian data. Pada script jquery diatas lebih khususnya parameter “dom”, adalah untuk mensetting posisi. Dan #t2 adalah kelas yang saya gunakan pada datatables.

Category: Artikel

Tentang: Abdul Rohman Wahid, ST

Programmer yang Bekerja menjadi tenaga ahli IT di Instansi Pemerintah Provinsi Riau. Saya biasanya menulis di blog ini terkait pemrograman. Selain itu Saya juga aktif mengelola web searti.com, aplikasikan.com dan kasitau.com. TLP/WA: 082285417494. Profil Lengkap.

Leave a Reply

Your email address will not be published. Required fields are marked *