We are trying to use the autocompletition. But the search as you type doesnt work.
When we type ‘<’ the hint window opens but the ‘<’ is not in the text, same problem when pressing ‘/’ ’ ’ and ‘=’. for example if we write ‘<Form’ and press space the hint window with the ‘<Form’ Tag is shown but it doenst wirte the ’ ‘. the specific extra keays doenst work inside the editor, nothing appears.
what could be the problem?
Code:
(function ($) {
$.widget(“ui.codeeditor”, {
options: {
mode: ‘xml’ //xml|lambda|html|css|x-sql(oder x-mysqlx-mariadb/x-cassandra/x-plsql/x-mssql/x-hive/x-pgsql/x-gql/x-gpsql/x-esper)
},
_create: function () {
var self = this,
$self = $(this.element),
options = self.options,
editor = null,
availableModes = [{
type: “xml”,
options: {
extraKeys: {
“Ctrl-Q”: function (cm) { cm.foldCode(cm.getCursor()); },
"’<’": function (c, p) { self.completeAfter(self, c, p); },
“’/’”: function © { self.completeIfAfterLt(self, c); },
“’ '”: function © { self.completeIfInTag(self, c); },
“’=’”: function © { self.completeIfInTag(self, c); },
“Ctrl-Space”: “autocomplete”
},
autoCloseTags: true,
smartIndent: true,
indentWithTabs: true,
hintOptions: {
schemaInfo: {
“!top”: [“Form”],
“Form”: {
“attrs”: {
“autogenerate”: [‘true’, ‘false’],
“masterPageId”: null,
“visible”: [‘true’, ‘false’],
“enabled”: [‘true’, ‘false’],
“id”: null
},
“children”: [
“Caption”,
“CaptionExpression”,
“Docks”,
“CommandBar”,
“AccessRights”,
“Html”,
“Widget”,
“DataBinderSetting”,
“Footer”,
“Tabs”,
“Row”,
“Rows”,
“Content”
]
},
“Caption”: { “children”: [] },
“CaptionExpression”: { “children”: [] },
“Docks”: {
“attrs”: {
“visible”: [‘true’, ‘false’],
“enabled”: [‘true’, ‘false’],
“id”: null
},
“children”: [
“Caption”,
“CaptionExpression”,
“DockElement”,
“CommandBar”,
“AccessRights”,
“Html”,
“Widget”,
“DataBinderSetting”,
“Footer”,
“Tabs”,
“Row”,
“Rows”,
“Content”
]
},
“DockElement”: {
“attrs”: {
“visible”: [‘true’, ‘false’],
“enabled”: [‘true’, ‘false’],
“id”: null
},
“children”: [
“Caption”,
“CaptionExpression”,
“Width”,
“ElementAlignment”,
“Pinable”,
“Accordion”
]
},
“Width”: { “children”: [] },
“ElementAlignment”: { “children”: [] },
“Pinable”: { “children”: [] },
“Accordion”: {
“attrs”: {
“visible”: [‘true’, ‘false’],
“enabled”: [‘true’, ‘false’],
“id”: null
},
“children”: [
“Caption”,
“CaptionExpression”,
“Docks”,
“CommandBar”,
“AccessRights”,
“Html”,
“Widget”,
“DataBinderSetting”,
“Footer”,
“Tabs”,
“Row”,
“Rows”,
“Content”
]
},
“CommandBar”: {
“attrs”: {
“visible”: [‘true’, ‘false’],
“enabled”: [‘true’, ‘false’],
“id”: null
},
“children”: [
“Caption”,
“CaptionExpression”,
“Command”
]
},
“Command”: {
“attrs”: {
“type”: null,
“actionRef”: null
},
“children”: [
“AccessRights”,
“Actions”
]
},
“AccessRights”: {
“children”: [
“AccessRights”
]
},
“AccessRight”: {
“attrs”: {
“necessary”: null,
“name”: null,
“command”: null
}
},
“Actions”: {
“children”: [
“Actions”
]
},
“Action”: {
“attrs”: {
“validRequired”: null
},
“children”: [
“AccessRights”
]
},
“Html”: {
“attrs”: {
“visible”: [‘true’, ‘false’],
“enabled”: [‘true’, ‘false’],
“id”: null
},
“children”: [
“Caption”,
“CaptionExpression”,
“CssClass”,
“Expression”
]
},
“CssClass”: { “children”: [] },
“Expression”: { “children”: [] },
“Widget”: {
“attrs”: {
“required”: [‘true’, ‘false’],
“type”: null,
“visible”: [‘true’, ‘false’],
“enabled”: [‘true’, ‘false’],
“id”: null
},
“children”: [
“Caption”,
“CaptionExpression”,
“MaxLength”,
“MinLength”,
“SourceValidator”,
“Source”,
“DataBindings”
]
},
“MaxLength”: { “children”: [] },
“MinLength”: { “children”: [] },
“SourceValidator”: {
“children”: [
“AssembyName”,
“TypeName”
]
},
“AssembyName”: { “children”: [] },
“TypeName”: { “children”: [] },
“Source”: {
“attrs”: {
“sourceType”: null,
“typeName”: null
},
“children”: [
“Key”,
“SourceMethod”
]
},
“Key”: {
“attrs”: {
“property”: null,
“typeName”: null
}
},
“SourceMethod”: {
“attrs”: {
“cacheable”: null
},
“children”: [
“AssembyName”,
“TypeName”,
“MethodName”,
“Arguments”
]
},
“MethodName”: { “children”: [] },
“Argument”: {
“attrs”: {
“typeName”: null,
“assemblyName”: null
}
},
“ArgumentMapping”: {
“attrs”: {
“argumentName”: null,
“propertyName”: null
}
},
“DataBindings”: {
“children”: [
“DataBinding”
]
},
“DataBinding”: {
“attrs”: {
“propertyRef”: null,
“direction”: [‘In’, ‘Out’, ‘In|Out’],
“type”: null
}
},
“DataBinderSetting”: {
“attrs”: {
“isSingleton”: [‘true’, ‘false’],
“generateProxy”: [‘true’, ‘false’],
“singeltonField”: null,
“visible”: [‘true’, ‘false’],
“enabled”: [‘true’, ‘false’],
“id”: null
},
“children”: [
“Caption”,
“CaptionExpression”,
“Proxy”,
“AssemblyName”,
“TypeName”
]
},
“Proxy”: {
“children”: [
“AssemblyName”,
“TypeName”,
“MethodName”,
“Arguments”
]
},
“AssemblyName”: { “children”: [] },
“Arguments”: {
“attrs”: {
“type”: null,
“actionRef”: null
},
“children”: [
“Argment”,
“ArgumentMapping”
]
},
“Footer”: {
“attrs”: {
“visible”: [‘true’, ‘false’],
“enabled”: [‘true’, ‘false’],
“id”: null
},
“children”: [
“Caption”,
“CaptionExpression”
]
},
“Tabs”: {
“attrs”: {
“visible”: [‘true’, ‘false’],
“enabled”: [‘true’, ‘false’],
“id”: null
},
“children”: [
“Caption”,
“CaptionExpression”,
“Tab”
]
},
“Tab”: {
“attrs”: {
“visible”: [‘true’, ‘false’],
“enabled”: [‘true’, ‘false’],
“id”: null
},
“children”: [
“Caption”,
“CaptionExpression”,
“Selected”,
“Docks”,
“CommandBar”,
“AccessRights”,
“Html”,
“Widget”,
“DataBinderSetting”,
“Footer”,
“Tabs”,
“Row”,
“Rows”,
“Content”
]
},
“Selected”: { “children”: [] },
“Rows”: {
“attrs”: {
“visible”: [‘true’, ‘false’],
“enabled”: [‘true’, ‘false’],
“id”: null
},
“children”: [
“Caption”,
“CaptionExpression”,
“Docks”,
“CommandBar”,
“AccessRights”,
“Html”,
“Widget”,
“DataBinderSetting”,
“Footer”,
“Tabs”,
“Row”,
“Rows”,
“Content”
]
},
“Row”: {
“attrs”: {
“visible”: [‘true’, ‘false’],
“enabled”: [‘true’, ‘false’],
“id”: null
},
“children”: [
“Caption”,
“CaptionExpression”,
“Docks”,
“CommandBar”,
“AccessRights”,
“Html”,
“Widget”,
“DataBinderSetting”,
“Footer”,
“Tabs”,
“Row”,
“Rows”,
“Content”
]
},
“Content”: {
“attrs”: {
“visible”: [‘true’, ‘false’],
“enabled”: [‘true’, ‘false’],
“id”: null
},
“children”: [
“Caption”,
“CaptionExpression”,
“Docks”,
“CommandBar”,
“AccessRights”,
“Html”,
“Widget”,
“DataBinderSetting”,
“Footer”,
“Tabs”,
“Row”,
“Rows”,
“Content”
]
}
}
}
},
init: function (callback) {
require([
“codemirror/mode/xml/xml”,
“codemirror/addon/fold/xml-fold”,
“codemirror/addon/hint/xml-hint”
], callback);
}
}],
init = function (cm) {
$.extend(self, { CodeMirror: cm });
var mode = $.grep(availableModes, function (m) { return m.type === self.options.mode; })[0];
mode.init(function () {
editor = cm.fromTextArea($self[0], $.extend({
mode: 'text/' + (options.mode || 'xml'),
lineNumbers: true,
lineWrapping: true,
foldGutter: true,
autoCloseBrackets: true,
gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"]
//matchBrackets: true
}, mode.options));
$self.data('editor', editor);
setTimeout(function () { editor.refresh(); }, 20);
});
};
$.extend(this, {
_tags: {
div: '<div />'
},
_css: {
container: options.css && options.css.container ? options.css.container : 'ui-texteditor',
editor: options.css && options.css.editor ? options.css.editor : 'codeeditor'
}
});
require(['codemirror',
"codemirror/addon/hint/show-hint",
"codemirror/addon/fold/foldcode",
"codemirror/addon/fold/foldgutter",
"codemirror/addon/edit/closetag",
"codemirror/addon/edit/closebrackets",
"codemirror/addon/mode/loadmode"
], function (cm) {
init(cm);
});
},
completeAfter: function (s, cm, pred) {
var cur = cm.getCursor();
if (!pred || pred()) {
setTimeout(function () {
if (!cm.state.completionActive) {
cm.showHint({ completeSingle: false });
}
}, 100);
}
return s.CodeMirror.Pass;
},
completeIfAfterLt: function (s, cm) {
return s.completeAfter(s, cm, function () {
var cur = cm.getCursor();
return cm.getRange(s.CodeMirror.Pos(cur.line, cur.ch - 1), cur) === "<";
});
},
completeIfInTag: function (s, cm) {
return s.completeAfter(s, cm, function () {
var tok = cm.getTokenAt(cm.getCursor());
if (tok.type === "string" && (!/['"]/.test(tok.string.charAt(tok.string.length - 1)) || tok.string.length === 1)) { return false; }
var inner = s.CodeMirror.innerMode(cm.getMode(), tok.state).state;
return inner.tagName;
});
}
});
})(jQuery);