Sunday, 15 August 2010

javascript - Twitter Bootstrap Typeahead force selection -



javascript - Twitter Bootstrap Typeahead force selection -

i'm using bootstrap typeahead plugin in app, , here code (it's example). i'm looking way validate selection of user (basically if input did not match results -> empty box on blur). result must match. searched everywhere , couldn't find thing. help highly appreciated.

$('#search').typeahead({ source: function (query, process) { var states = []; var map = {}; var info = [ { "statecode": "ca", "statename": "california" }, { "statecode": "az", "statename": "arizona" }, { "statecode": "ny", "statename": "new york" }, { "statecode": "nv", "statename": "nevada" }, { "statecode": "oh", "statename": "ohio" } ]; $.each(data, function (i, state) { map[state.statename] = state; states.push(state.statename); }); process(states); } });

if extract out data, states , map, can utilize them in .blur function lookup:

var info = [ { "statecode": "ca", "statename": "california" }, { "statecode": "az", "statename": "arizona" }, { "statecode": "ny", "statename": "new york" }, { "statecode": "nv", "statename": "nevada" }, { "statecode": "oh", "statename": "ohio" } ]; var states = []; var map = {}; $.each(data, function (i, state) { map[state.statename] = state; states.push(state.statename); }); $('#search').typeahead({ source: function (query, process) { process(states); } }).blur(function(){ if(states[$(this).val()] == null) { $('#search').val(''); } });

javascript jquery twitter-bootstrap bootstrap-typeahead

No comments:

Post a Comment