Loading Historical Data As Autocomplete / Typeahead

I can load autocomplete data from a function e.g. ‘source’=>array(‘London’, ‘Paris’, ‘New York’, etc, but what i want to do is load data dynamically from the database, based on historical data already entered for that input field.

So take an address form for example, when you go to type city, it looks through all the cities already in the database for that form field and presents suggestions…

simarly, it could also check a DB Table outside the Model for data form suggestions that havent yet been entered…

Anyone know of a good tutorial or even a plugin to achieve this.

Need so solve HUGE dropdowns full of job titles, citys etc…


[color="#006400"]/* Moved from Tips, Tutorials to General Discussion … */[/color]

Thank s for the move Jacmoe…

So, heres a good example and also might help anyone who needs a csv list of UK occupations lol, i made this one myself, took a whiel thought id share.

I naturally want to load this data from the database, and not as it is below, becasue a few of these, and the page is going to be megabytes!


update, i had to strip out 99% of the data because it made the post too long, doh! So i’ve attached if anyone wants it, actually, im not allowed to upload doh!!

Yii::app()->bootstrap->registerTypeahead('.typeahead-occupation', array(

    //'source'=>array('Alabama', 'Alaska', 'Arizona', 'Arkansas', 'California', 'Colorado', 'Connecticut', 'Delaware', 'Florida', 'Georgia', 'Hawaii', 'Idaho', 'Illinois', 'Indiana', 'Iowa', 'Kansas', 'Kentucky', 'Louisiana', 'Maine', 'Maryland', 'Massachusetts', 'Michigan', 'Minnesota', 'Mississippi', 'Missouri', 'Montana', 'Nebraska', 'Nevada', 'New Hampshire', 'New Jersey', 'New Mexico', 'New York', 'North Dakota', 'North Carolina', 'Ohio', 'Oklahoma', 'Oregon', 'Pennsylvania', 'Rhode Island', 'South Carolina', 'South Dakota', 'Tennessee', 'Texas', 'Utah', 'Vermont', 'Virginia', 'Washington', 'West Virginia', 'Wisconsin', 'Wyoming'),

    'source'=>array("A","A1","A2","A3","A4","A5","A6","A7","AA","AB","ACA","ACIS","ACWA","AM","AO","AP(T)","APA","ASAA","Abbot","Abseiler","Abstractor","Accompanist","Accountant, bank","Accountant, barrack","Accountant, barracks","Accountant, borough","Accountant, branch","Accountant, certified","Accountant, chartered","Accountant, chief, group","Accountant, chief","Accountant, company","Accountant, cost","Accountant, cost and management","Accountant, cost and works","Accountant, district","Accountant, financial","Accountant, forensic","Accountant, group","Accountant, incorporated","Accountant, management, chartered","Accountant, management","Accountant, principal","Accountant, tax","Accountant, taxation","Accountant, turf","Accountant, works","Accountant","Accountant and auditor","Accountant of Court","Accountant-secretary","Acetoner","Acidifier","Acoustician","Acrobat","Actor","Actor-manager","Actuary","Acupuncturist","Adjudicator","Adjuster, average","Adjuster, brake","Adjuster, claims","Adjuster, compass","Adjuster, dial","Adjuster, envelope","Adjuster, lift","Adjuster, loss","Adjuster, machine","Adjuster, relay","Adjuster, spring, set","Adjuster, unit","Adjuster, weight","Adjuster","Adjutant","Adjutant-General","Administrator, account","Administrator, accounts","Administrator, arts","Administrator, bonus","Administrator, business","Administrator, catering","Administrator, charity","Administrator, church","Administrator, circuit","Administrator, claim","Administrator, clerical","Administrator, clinic","Administrator, college","Administrator, commercial","Administrator, committee","Administrator, computer","Administrator, conference","Administrator, contract","Administrator, contracts, purchasing","Administrator, contracts, sales","Administrator, cost","Administrator, course","Administrator, court","Administrator, courts","Administrator, covenant","Administrator, database","Administrator, distribution","Administrator, electoral","Administrator, export","Administrator, faculty","Administrator, finance","Administrator, financial""Retired"),


    'matcher'=>"js:function(item) {

        return ~item.toLowerCase().indexOf(this.query.toLowerCase());



Please provide the link where the above tutorial is kept…