Filter and Search ASP.Net DropDownList items using JavaScript

The post is originally from http://www.aspsnippets.com/Articles/Filter-and-Search-ASP.Net-DropDownList-items-using-JavaScript.aspx
have update to object oriented.
We just have to create object for each filter, and alter the function FilterItemsByText

//http://www.aspsnippets.com/Articles/Filter-and-Search-ASP.Net-DropDownList-items-using-JavaScript.aspx
//https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith
function CacheItems(ddl, lblMessage) {
    this.ddlText = new Array();
    this.ddlValue = new Array();
    this.ddlTempItems = ddl;
    this.lblMesg = lblMessage;
    this.hasDefault = false;
    this.DefaultOption = new Option("", "");

    if (typeof this.ddlTempItems === 'undefined' || typeof this.ddlTempItems.options === 'undefined' || this.ddlTempItems.options.length == 0)
        return;

    //http://jsperf.com/jquery-each-push-vs-filter-map/2
    for (var i = 0; i < this.ddlTempItems.options.length; i++) {
        this.ddlText[this.ddlText.length] = this.ddlTempItems.options[i].text;
        this.ddlValue[this.ddlValue.length] = this.ddlTempItems.options[i].value;
    }
}

CacheItems.prototype.AddItems = function (text, value, index) {
    var options = new Option(text, value);

    if (typeof this.ddlTempItems === 'undefined'
        || typeof this.ddlTempItems.options === 'undefined'
        )
        return;

    if (this.hasDefault && this.DefaultOption.value != "" && !this.HasOption(this.DefaultOption.value)) {
        this.ddlTempItems.options.add(this.DefaultOption);
    }

    if (index === -1) {
        this.ddlTempItems.options.add(options);
        return;
    }

    if (index === 0 && this.ddlTempItems.options[0].text.toLowerCase() != text.toLowerCase()) {
        this.ddlTempItems.options.add(options, this.ddlTempItems[0]);
    }
}

CacheItems.prototype.RemoveItems = function (text, value) {
    var options = new Option(text, value);

    if (typeof this.ddlTempItems === 'undefined'
        || typeof this.ddlTempItems.options === 'undefined'
        )
        return;

    if (this.ddlTempItems.options[0].text.toLowerCase() == text.toLowerCase())
        this.ddlTempItems[0] = null;
}

CacheItems.prototype.HasOption = function (value) {
    for (var i = 0, len = this.ddlTempItems.options.length; i != len; ++i) {
        if (this.ddlTempItems.options[i].value == value) {
            return true;
        }
    }
    return false;
}

function FilterItems(value, objCacheItem) {

    AddProtoTypes();

    objCacheItem.ddlTempItems.options.length = 0;//Clear the dropdown

    for (var i = 0; i < objCacheItem.ddlText.length; i++) {
        //if (objCacheItem.ddlText[i].toLowerCase().indexOf(value) != -1) {//Contains 
        if (objCacheItem.ddlText[i].toLowerCase().StartsWith(value, 0)) {//Contains 
            objCacheItem.AddItems(objCacheItem.ddlText[i], objCacheItem.ddlValue[i], -1);
        }
    }

    //when no element found
    if (objCacheItem.ddlTempItems.options.length == 0 && objCacheItem.hasDefault) {
        objCacheItem.ddlTempItems.options.add(objCacheItem.DefaultOption);
    }

    objCacheItem.lblMesg.innerHTML = value == "" ? "" :
        objCacheItem.ddlTempItems.options.length + (objCacheItem.hasDefault ? -1 : 0) + " items found.";

    objCacheItem.ddlTempItems[0].selected = true;
}

function AddProtoTypes() {
    if (!String.prototype.StartsWith) {
        String.prototype.StartsWith = function (searchString, position) {
            position = position || 0;
            return this.indexOf(searchString, position) === position;
        };
    }
}

    
        
            

                

                    
Customer
                    


                        

                        

                            

                        

                        
                    
Project
                    


                        

                        

                            

                        

                        
                
        
    

Cannot create file 'entityFmTest.mdf' because it already exists. Change the file path or the file name, and retry the operation.

< add connectionstring="Data Source=.\SQLEXPRESS;AttachDbFilename=|DataDirectory|\entityFmTest.mdf; Integrated Security=True;User Instance=True;" name="entityFmContext" providername="System.Data.SqlClient">
< /add>

CREATE DATABASE failed. Some file names listed could not be created. Check related errors.
Cannot create file 'entityFmTest.mdf' because it already exists. Change the file path or the file name, and retry the operation.
replace the above with

replace the above connection string with below

< add connectionstring="data source=.\SQLEXPRESS;Initial Catalog=entityFmTest; Integrated Security=SSPI;User Instance=true" name="entityFmContext" providername="System.Data.SqlClient">
< /add>