JSFiddle - React, Tailwind, and code Playground

by pharzan Tinati

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/mithril/0.2.3/mithril.min.js"></script>

JavaScript

var inputBox = (function() {

    function InputBox(config) {
	
        this.config = config || {
            list: [],
            width: 100,
            itemsPerPage: 10,
            sortByName: false
        };

        this.userInput = m.prop('');
        this.selected = '';
        this.init();
	var a='hi';
	
    }
    function _updateList(newList) {
	
        self.list = newList;
	};

    InputBox.prototype.init = function(param) {
        this.updateList(this.config.list);
    };
    
    InputBox.prototype.updateList = function(foundItems) {
        this.list = foundItems;
        var perPage = this.config.itemsPerPage;
        var sort = this.config.sortByName;	
    };
    
    InputBox.prototype.update = function(newList) {
	
        this.list = newList;
        this.config.list = newList;
        var perPage = this.config.itemsPerPage;
        var sort = this.config.sortByName;

	
    };

    InputBox.prototype.find = function() {

        var self = this;
        var foundItems = [];
        this.config.list.map(function(item) {
            var lowerItem = item.toLowerCase();

            if (lowerItem.indexOf(self.userInput()) > -1) {
                foundItems.push(item);
            }
        });
	
	
        this.updateList(foundItems);
    };

    InputBox.prototype.getSelected = function() {
        return this.selected;

    };

    InputBox.prototype.view = function() {
        var self = this;
        return m('.mithChosen',
		 m('input', {
                     oninput: m.withAttr('value', this.userInput),
                     onkeyup: this.find()
		     
                },
                this.userInput()),
		 m('ol', {style:{width:self.config.styles.width}},
                this.list.map(
                    function(listItem, i) {
                        if (i >= self.config.itemsPerPage)
                            return;
                        else
                            return m('li', {
                                onclick:...