return jsonpath in getOptions and editor instance.
This commit is contained in:
parent
f9d8a039e2
commit
d423a70a5d
10
docs/api.md
10
docs/api.md
|
@ -157,15 +157,15 @@ Constructs a new JSONEditor.
|
||||||
|
|
||||||
Indicate the KeyCodes for trigger confirm completion, by default those keys are: [39, 35, 9] which are the code for [right, end, tab]
|
Indicate the KeyCodes for trigger confirm completion, by default those keys are: [39, 35, 9] which are the code for [right, end, tab]
|
||||||
|
|
||||||
- `{Function} getOptions (text: string, path: string[], input: string)`
|
- `{Function} getOptions (editor: object, text: string, path: string, input: string)`
|
||||||
|
|
||||||
This function will return your possible options for create the autocomplete selection, you can control dynamically which options you want to display according to the current active editing node.
|
This function will return your possible options for create the autocomplete selection, you can control dynamically which options you want to display according to the current active editing node.
|
||||||
|
|
||||||
*Parameters:*
|
*Parameters:*
|
||||||
|
- `editor` : The editor instance object that the node belongs to.
|
||||||
- `text` : The text in the current node part. (basically the text that the user is editing)
|
- `text` : The text in the current node part. (basically the text that the user is editing)
|
||||||
- `path` : The document json object that is being edited.
|
- `path` : The json path of the node that is being edited.
|
||||||
- `input` : Can be "field" or "value" depending if the user is editing a field name or a value of a node.
|
- `input` : Can be "field" or "value" depending if the user is editing a field name or a value of a node.
|
||||||
|
|
||||||
*Returns:*
|
*Returns:*
|
||||||
|
|
||||||
|
|
|
@ -35,9 +35,9 @@
|
||||||
modes: ['text', 'tree'],
|
modes: ['text', 'tree'],
|
||||||
autocomplete: {
|
autocomplete: {
|
||||||
applyTo:['value'],
|
applyTo:['value'],
|
||||||
getOptions: function (text, path) {
|
getOptions: function (editor, text) {
|
||||||
return new Promise(function (resolve, reject) {
|
return new Promise(function (resolve, reject) {
|
||||||
var options = extractUniqueWords(path);
|
var options = extractUniqueWords(editor.get());
|
||||||
if (options.length > 0) resolve(options); else reject();
|
if (options.length > 0) resolve(options); else reject();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
<!DOCTYPE HTML>
|
<!DOCTYPE HTML>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<title>JSONEditor | Advanced Auto Complete</title>
|
<title>JSONEditor | Advanced Auto Complete</title>
|
||||||
|
@ -38,19 +38,20 @@
|
||||||
autocomplete: {
|
autocomplete: {
|
||||||
confirmKeys: [39, 35, 9, 190], // Confirm Autocomplete Keys: [right, end, tab, '.'] // By default are only [right, end, tab]
|
confirmKeys: [39, 35, 9, 190], // Confirm Autocomplete Keys: [right, end, tab, '.'] // By default are only [right, end, tab]
|
||||||
|
|
||||||
getOptions: function (text, path, input) {
|
getOptions: function (editor, text, path, input) {
|
||||||
if (!text.startsWith(activationChar) || input !== 'value') return [];
|
if (!text.startsWith(activationChar) || input !== 'value') return [];
|
||||||
var data = {};
|
var data = {};
|
||||||
var startFrom = 0;
|
var startFrom = 0;
|
||||||
var lastPoint = text.lastIndexOf('.');
|
var lastPoint = text.lastIndexOf('.');
|
||||||
|
var jsonObj = editor.get();
|
||||||
if ((lastPoint > 0) && (text.length > 1)) {
|
if ((lastPoint > 0) && (text.length > 1)) {
|
||||||
data = jsonpath.query(path, '$.' + text.substring(activationChar.length, lastPoint));
|
data = jsonpath.query(jsonObj, '$.' + text.substring(activationChar.length, lastPoint));
|
||||||
if (data.length > 0) data = data[0]; else data = {};
|
if (data.length > 0) data = data[0]; else data = {};
|
||||||
// Indicate that autocompletion should start after the . (ignoring the first part)
|
// Indicate that autocompletion should start after the . (ignoring the first part)
|
||||||
startFrom = text.lastIndexOf('.') + 1;
|
startFrom = text.lastIndexOf('.') + 1;
|
||||||
}
|
}
|
||||||
else
|
else
|
||||||
data = path;
|
data = jsonObj;
|
||||||
|
|
||||||
var optionsStr = YaskON.stringify(data, null, activationChar);
|
var optionsStr = YaskON.stringify(data, null, activationChar);
|
||||||
var options = optionsStr.split('\n');
|
var options = optionsStr.split('\n');
|
||||||
|
|
|
@ -374,12 +374,30 @@ Node.prototype.getLevel = function() {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Get path of the root node till the current node
|
* Get path of the root node till the current node
|
||||||
|
* @return {String} Returns a jsonpath of the current node in the form: node1.child1.child2, node1.array1[0].child, etc.
|
||||||
|
*/
|
||||||
|
Node.prototype.getNodeJsonPath = function () {
|
||||||
|
var path = this.parent ? this.parent.getNodePath() : [];
|
||||||
|
path.push(this);
|
||||||
|
var strPath = '';
|
||||||
|
path.forEach(function (node) {
|
||||||
|
strPath += !node.parent
|
||||||
|
? '$' // do not add an (optional) field name of the root node
|
||||||
|
: (node.parent.type != 'array')
|
||||||
|
? '.' + node.field
|
||||||
|
: '[' + node.index + ']';
|
||||||
|
});
|
||||||
|
return strPath;
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Get jsonpath of the current node
|
||||||
* @return {Node[]} Returns an array with nodes
|
* @return {Node[]} Returns an array with nodes
|
||||||
*/
|
*/
|
||||||
Node.prototype.getNodePath = function() {
|
Node.prototype.getNodePath = function () {
|
||||||
var path = this.parent ? this.parent.getNodePath() : [];
|
var path = this.parent ? this.parent.getNodePath() : [];
|
||||||
path.push(this);
|
path.push(this);
|
||||||
return path;
|
return path;
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
|
@ -1115,7 +1115,7 @@ treemode._onKeyDown = function (event) {
|
||||||
// Activate autocomplete
|
// Activate autocomplete
|
||||||
setTimeout(function (hnode, element) {
|
setTimeout(function (hnode, element) {
|
||||||
if (element.innerText.length > 0) {
|
if (element.innerText.length > 0) {
|
||||||
var result = this.options.autocomplete.getOptions(element.innerText, editor.get(), jsonElementType);
|
var result = this.options.autocomplete.getOptions(hnode.editor, element.innerText, hnode.getNodeJsonPath(), jsonElementType);
|
||||||
if (typeof result.then === 'function') {
|
if (typeof result.then === 'function') {
|
||||||
// probably a promise
|
// probably a promise
|
||||||
if (result.then(function (obj) {
|
if (result.then(function (obj) {
|
||||||
|
|
Loading…
Reference in New Issue