javascript - Twitter typeahead not working with with ajax -


i'm quite inexpert frontend world , i'm trying make working.

$('#the-basics .typeahead').typeahead({     hint: true,     highlight: true,     minlength: 6 }, {     source: function (query, process) {         return $.get('autocompletecodicefiscale', {             codicefiscale: query         }, function (data) {             //alert(json.stringify(data));             return process(data.options);         });     } }).on('typeahead:selected', function (evt, data) {     //mocking data     if (data.length >= 16) {         $('#nome').val("mohamed");         $('#cognome').val("shafik");         $('#sesso').val("maschio");         $('#codiceregionale').val("romab");         $('#codicefiscale').val("shfmmd81d06z336b");         $('#datanascita').val("6/04/1981");         $('#indirizzo').val("via della prova");         $('#numerocivico').val("123");         $('#comune').val("roma");         $('#cap').val("00100");         $('#telfisso').val("0612345678");         $('#telmobile').val("3471234567");         $('#email').val("prova@lait.it");         $('#aslcircoscrizione').val("roma iv");     } else {         // other stuff     } });

this give no errors not show returned data, alert shows informations requested returned correctly.

if use this

var substringmatcher = function(strs) {     return function findmatches(q, cb) {         var matches, substringregex;          // array populated substring matches         matches = [];          // regex used determine if string contains substring `q`         substrregex = new regexp(q, 'i');          // iterate through pool of strings , string         // contains substring `q`, add `matches` array         $.each(strs, function(i, str) {             if (substrregex.test(str)) {                 matches.push(str);             }         });          cb(matches);     }; };  var anagrafica = ['shfmmd81d06z336b - mohamed shafik - 06/04/1981',     'shfmmd81d06z336b - mohamed shafik - 06/04/1982',     'mrtclg81d08g442b - calogero martello - 01/01/1981' ];  $('#the-basics .typeahead').typeahead({     hint: true,     highlight: true,     minlength: 6 }, {     name: 'anagrafica',     source: substringmatcher(anagrafica) }).on('typeahead:selected', function(evt, data) {     //mock     if (data.length >= 16) {         $('#nome').val("mohamed");         $('#cognome').val("shafik");         $('#sesso').val("maschio");         $('#codiceregionale').val("romab");         $('#codicefiscale').val("shfmmd81d06z336b");         $('#datanascita').val("6/04/1981");         $('#indirizzo').val("via della prova");         $('#numerocivico').val("123");         $('#comune').val("roma");         $('#cap').val("00100");         $('#telfisso').val("0612345678");         $('#telmobile').val("3471234567");         $('#email').val("prova@lait.it");         $('#aslcircoscrizione').val("roma iv");     } else {         //do other stuff     } });

everything works fine.

my controller looks this

@requestmapping(value = { "autocompletecodicefiscale" }, method = requestmethod.get, produces="application/json")     public @responsebody tempclass autocompletecodicefiscale(@requestparam string codicefiscale, modelmap map) {         list<assistitodto> assistiti = //requested data db          tempclass autocomplete = new tempclass();         for(assistitodto assistito : assistiti)         {             autocomplete.options = new arraylist<string>();           autocomplete.options.add(assistito.getanagrafica().getcodicefiscale() + " - " +                              assistito.getanagrafica().getcognome() + " " +                              assistito.getanagrafica().getnome() + " - " +                              assistito.getanagrafica().getdatanascita().getday() + "/" +                              assistito.getanagrafica().getdatanascita().getmonth() + "/" +                              assistito.getanagrafica().getdatanascita().getyear());         }                system.out.println("la string json è: " + new gson().tojson(autocomplete));         return autocomplete;     }      private class tempclass     {         public list<string> options;     }

it looks ugly know i'm testing why it's not working @ moment. don't think need show css because works correctly mock. way suggestions aren't getting populated, it's not visual issue. apologize english.

oh god solved it, i've chenged quite bit, , thats result,

var people = new bloodhound({      	    datumtokenizer: bloodhound.tokenizers.obj.whitespace('codicefiscale'),      	    querytokenizer: bloodhound.tokenizers.whitespace,      	    remote: {      	    	url: 'autocompletecodicefiscale/?codicefiscale=%query',      	  		wildcard: '%query'      	    }      	});        	people.initialize();        	$('#the-basics .typeahead').typeahead({      	  minlength: 6      	}, {      		limit: 10,      	    name: 'people',      	    display: 'codicefiscale',      	    source: people.ttadapter(),      	    templates: {empty: [      	                          '<div class="empty-message">',      	                          'nessun assistito / assistibile trovato',      	                          '</div>'      	                       ].join('\n'),      	                suggestion: handlebars.compile('<div><strong>{{codicefiscale}}</strong> - {{cognome}} {{nome}} - {{datanascita}}</div>')      	    }      	}).on('typeahead:selected', function(obj, datum) {      	    // stuff      	});        </script>

and controller has been modified too

@requestmapping(value = { "autocompletecodicefiscale" }, method = requestmethod.get, produces="application/json")  	public @responsebody list<temp> autocompletecodicefiscale(@requestparam string codicefiscale, modelmap map) {  		list<assistitodto> assistiti = //data db  		list<temp> autocomplete = new arraylist<temp>();  		for(assistitodto assistito : assistiti)  		{  			temp asstemp = new temp();  			asstemp.codicefiscale = assistito.getanagrafica().getcodicefiscale();  			asstemp.nome = assistito.getanagrafica().getnome();  			asstemp.cognome = assistito.getanagrafica().getcognome();  			asstemp.datanascita = assistito.getanagrafica().getdatanascita().getday() + "/" +  								  assistito.getanagrafica().getdatanascita().getmonth() + "/" +  								  assistito.getanagrafica().getdatanascita().getyear();  			autocomplete.add(asstemp);  		}		  		system.out.println("la string json è: " + new gson().tojson(autocomplete));  		return autocomplete;  	}  	  	private class temp  	{  		public string codicefiscale;  		public string nome;  		public string cognome;  		public string datanascita;  	}

and works this.


Comments

Post a Comment

Popular posts from this blog

javascript - Google App Script ContentService downloadAsFile not working -

i have web app developed using google app script htmlservice , html form, populating excel sheet in google drive using spreadsheetapp . , 1 section calling contentservice download data excel file. function doget(e) { // read excel sheet //getappfile(); // render application html template return htmlservice.createtemplatefromfile('index').evaluate() .settitle('go smart') .setsandboxmode(htmlservice.sandboxmode.iframe); } function downloaddoublequatecsvfile() { var sheetid = propertiesservice.getscriptproperties().getproperty('sheetid'); var ss = spreadsheetapp.openbyid(sheetid).getactivesheet(); //var ss = spreadsheetapp.getactivespreadsheet().getactivesheet(); var maxcolumn = ss.getlastcolumn(); var maxrow = ss.getlastrow(); var data = ss.getrange(1, 1, maxrow, maxcolumn).getvalues(); if (data.length > 1) { var csv = ""; (var row = 0; row < data.length; row++) { (var c...
Read more

javascript - Function overwritting -

is there way overwrite function or event handling in function? using addeventlistener, can have many event handlers on element want var test=document.getelementbyid("div"); test.addeventlistener("click",function(){alert("im first");},false); test.addeventlistener("click",function(){alert("im second");},false); // alerts "im first" , after "im second" but if want overwrite function/event example based on client width example this function one() { alert("first"); } function two() { alert("second"); } window.onresize = function() { var test = document.getelementbyid("div"); if (window.innerwidth > 500) { test.onclick = 1 } else { test.onclick = two; } } is possible in javascript? in case use effective little known approach. addeventlistener can accept object property handleevent event handler. in case it's easy overwr...
Read more

php - Find a regex to take part of Email -

i have following emails need extract part from: bestellnummer xxx: 1 von xxx, 1er pack ------------- anfang der nachricht ------------- foo bar baz foo bar baz // <<<<< need text here ------------- ende der nachricht ------------- ------------- anfang der nachricht ------------- foo bar baz foo bar baz ------------- ende der nachricht ------------- there 0 unlimited occurences of ------------- anfang der nachricht ------------- ------------- ende der nachricht ------------- and i'm able extract first part regex: $re = "/------------- .*? -------------.?(.*?).?------------- .*? -------------/s"; but, i'm quite new on learning regex, i'm pretty sure there must better regex extract part (foo bar baz foo bar baz) of text between ------------- anfang der nachricht ------------- ------------- ende der nachricht ------------- as can in different languages, i'm using .? to match between hyphens. i...
Read more