0

0

0

share


#jquery#json#ajax#web
0 Reaksi

0 Komentar

Sepuluh Plugin Live Search Gratis

Profile
Bagus Aji Santoso

7 Juli 2017

Sepuluh Plugin Live Search Gratis

Live search adalah search form yang menggunakan teknologi AJAX untuk memberikan hasil atau saran tanpa memuat halaman baru. Teknik ini berbeda dengan autocomplete yang ada di peramban modern seperti Chrome, Firefox atau Safari. Autocomplete yang ada di peramban modern hanya memberikan saran berdasarkan nilai yang pernah dimasukkan pada sebuah field input, sedangkan live search adalah field input yang sudah diprogram sedemikian rupa agar dapat menampilkan hasil atau saran dari sekumpulan data tertentu.

Berikut kumpulan plugin live search terpopuler yang dapat kita pakai:

Ajax Live Search

Image

Ajax Live Search adalah plugin jQuery. Ia memiliki dokumentasi yang sangat baik serta bekerja dengan sempurna di berbagai peramban seperti Chrome, Firefox, Safari, Opera, hingga IE8. Fitur yang paling menarik dari plugin ini adalah penyampaian hasil pencarian dalam bentuk tabel berhalaman.

Semantic UI Search Component

Image

Semantic UI adalah framework CSS yang memiliki lebih dari 50 komponen UI. Salah satu komponen yang dapat digunakan untuk membuat live search adalah search component.

Image

Baca juga: Kumpulan Channel Telegram untuk Update Informasi Seputar Teknologi

jQueryUI Autocomplete

Image

Plugin ini merupakan bagian dari pustaka jQuery UI. jQuery UI sendiri merupakan kumpulan komponen, efek, dan tema yang dibuat diatas jQuery.

DevBridge jQuery AutoComplete

Image

DevBridge jQuery AutoComplete adalah pustaka JavaScript yang berukuran kecil dan memperbolehkan kita untuk mengubah field text input agar dapat menamilkan saran hasil. API yang dimilikinya cukup terdokumentasi dengan baik sehingga kita dapat melakukan konfigurasi yang berbeda-beda.

EasyAutocomplete

Image

EasyAutocomplete adalah plugin jQuery untuk melakukan autocomplete dengan fitur-fitur yang umum digunakan. Plugin ini dapat menggunakan kumpulan data di lokal maupun remote dalam bentuk JSON, XML atau format plain text. EasyAutoComplete juga memiliki fitur template yang membuat hasil pencarian lebih lengkap dengan kemampuan untuk menambahkan deskripsi, gambar ikon, tautan, atau menentukan sendiri tambahan data yang diperlukan.

PixaBay jQuery-autoComplete

Image

Pixabay.com, salah satu situs penyedia stock photo, memiliki sebuah plugin autocomplete untuk jQuery yang dapat kita pakai. Pada awalnya, Pixabay menggunakan DevBridge jQuery AutoComplete namun kemudian memutuskan untuk membuat sebuah fork yang memperbaruinya untuk memenuhi kebutuhan mereka sendiri. Saking banyaknya modifikasi yang mereka lakukan, plugin ini akhirnya menjadi sangat ringan, versi terkompresinya hanya berukuran 1.4kb.

xDSoft Autocomplete Like Google

Image

Plugin autocomplete jQuery yang ringain ini memiliki fitur untuk memuat sumber data lokal maupun remote.

jQuery Typeahead Search

Image

jQuery Typeahead Search merupakan plugin autocomplete yang memiliki opsi kostumisasi yang sangat lengkap. Plugin ini dapat berjalan di semua peramban modern yang dimulai dari IE8+. Ia juga mendukung callback AJAX internal maupun external.

Algolia Autocomplete

Image

Plugin ini mendukung semua peramban modern mulai dari IE9 dan tersedia sebagai plugin jQuery, Angular directive, atau sebagai pustaka yang berdiri sendiri. Algolia Autocomplete juga menanamkan fitur keamanan untuk menjaga dari serangan XSS.

W3Schools Ajax Live Search

Image

Pembaca pasti cukup familiar dengan w3schools.com. Situs ini merupakan salah satu referensi utama bagi setiap orang yang sedang belajar pemrograman HTML, CSS, atau Javascript. W3Schools juga merilis sebuah pustaka untuk melakukan live search. Pustaka yang dibuat oleh W3Schools ini berdiri sendiri tanpa ada ketergantungan dengan pustaka lain seperti jQuery. Format data yang digunakan adalah XML, tapi jika ingin menggunakan JSON kita dapat memodifikasi kodenya.

sumber

0

0

0

share