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