X-editable + bootstrap 3 + typeahead.js twitter not working

Question

I tried integrating Bootstrap3 with awesome x-editable and typeahead.js, but I couldn't get it working:

I tried the following

• check item with data type = 'typeaheadjs'
• add type = 'typeaheadjs' to $ (). editable ()
• move all parameters to data- * attributes
• move all parameters to $ () arguments. editable ()

but no luck.

HTML code:

<div style="margin: 150px"> <a href="#" id="username">Rome</a> </div> 

JS Code:

 $('#username').editable({ mode: 'inline', showbuttons: false, type: 'text', url: '/post', pk: 1, title: 'Enter an Italian city', typeahead: { local: ['Rome', 'Milan', 'Venice', 'Florence'] } }); 

fiddle here: http://jsfiddle.net/Ggxbm/3/

even the provided example in http://vitalets.imtqy.com/x-editable/docs.html#typeaheadjs does not work for me

What am I doing wrong?

Answer 1

You need to enable typeahead.min.js and typeaheadjs.js

as you can see in this script http://jsfiddle.net/9q7Jd/1/ adding

 http://cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/inputs-ext/typeaheadjs/typeaheadjs.js 

fixes the problem.

you can find typeaheadjs.js in the zip archive in the input-ext / typeaheadjs directory: https://github.com/vitalets/x-editable/tree/master/src/inputs-ext/typeaheadjs