Basic Dynamic Autocomplete Library – pc-autocompletion.js

Category: Form , Javascript | September 26, 2018
Author: ikhwanh
Views Total: 347
Official Page: Go to website
Last Update: September 26, 2018
License: MIT

Preview:

Basic Dynamic Autocomplete Library – pc-autocompletion.js

Description:

pc-autocompletion.js is a small JavaScript autocomplete plugin that works with text field and supports dynamic data rendering.

How to use it:

Create an input field on the webpage.

<input placeholder="Type Something" id="example" type="text">

Create an array of JS objects that hold key-value pairs for the suggestions.

var myDare = new Array({
    id: 1,
    name: 'Banana',
    price: 4000
}, {
    id: 2,
    name: 'Grape',
    price: 12000
}, {
    id: 3,
    name: 'Durian',
    price: 25000
}, {
    id: 4,
    name: 'Coconut',
    price: 10000
},{
    id: 5,
    name: 'Apel',
    price: 7500
},{
    id: 6,
    name: 'Apel Premium',
    price: 15000
},{
    id: 7,
    name: 'Rambutan',
    price: 8500
});

Initialize the pc-autocompletion library and done.

new PCAutoCompletion({
    id: 'example',
    itemList: myData,
    showElement: 'name'
}

You Might Be Interested In:

Leave a Reply