codemirror hint on every key

<script></p> <p> $(function () {<br /> initSqlEditor();<br /> initAutoComplete();<br /> });</p> <p> // init sql editor<br /> function initSqlEditor() {</p> <p> var editor = CodeMirror.fromTextArea(document.getElementById(‘code’), {<br /> autofocus: true,<br /> extraKeys: {<br /> “Tab”: “autocomplete”<br /> },<br /> hint: CodeMirror.hint.sql,<br /> lineNumbers: true,<br /> mode: ‘text/x-hive’,<br /> lineWrapping: true,<br /> theme: ‘material’,<br /> });</p> <p> editor.on(‘keyup’, function(editor, event){<br /> // type code and show autocomplete hint in the meanwhile<br /> CodeMirror.commands.autocomplete(editor);<br /> });<br /> }</p> <p> /**<br /> * Init autocomplete for table name and column names in table.<br /> */<br /> function initAutoComplete() {</p> <p> CodeMirror.commands.autocomplete = function (cmeditor) {</p> <p> CodeMirror.showHint(cmeditor, CodeMirror.hint.sql, {</p> <p> // “completeSingle: false” prevents case when you are typing some word<br /> // and in the middle it is automatically completed and you continue typing by reflex.<br /> // So user will always need to select the intended string<br /> // from popup (even if it’s single option). (copy from @Oleksandr Pshenychnyy)<br /> completeSingle: false,</p> <p> // there are 2 ways to autocomplete field name:<br /> // (1) table_name.field_name (2) field_name<br /> // Put field name in table names to autocomplete directly<br /> // no need to type table name first.<br /> tables: {<br /> “table1”: [“col_A”, “col_B”, “col_C”],<br /> “table2”: [“other_columns1”, “other_columns2”],<br /> “col_A”: [],<br /> “col_B”: [],<br /> “col_C”: [],<br /> “other_columns1”: [],<br /> “other_columns2”: [],<br /> }<br /> });<br /> }<br /> }</p> <p></script>