This is a migrated thread and some comments may be shown as answers.

Adding dynamic menu to editor

2 Answers 204 Views
Editor
This is a migrated thread and some comments may be shown as answers.
Patrick
Top achievements
Rank 1
Patrick asked on 18 Sep 2018, 09:05 PM

I am trying to add a menu to the Editor tools that populates based on a AJAX get call. The menu will add html to the editor.

<code>

$('#OptionTextReport').kendoEditor({
tools: [
"bold",
"italic",
"underline",
"strikethrough",
{
name: "insertFeature",
template: '<ul id="featureTool"></ul>'
}
],
resizable: {
content: true,
toolbar: true
}
});
var editor = $('#OptionTextReport').data("kendoEditor");

var updateFeatureList = function (featureList) {
var list = [];
$.each(featureList, function(index, value) {
list.push({
text: value.FeatureDescription,
attr:{ featureid: value.FeatureId, description: value.FeatureDescription },
select: function (e) {
var id = $(e.target).parent().attr("featureid");
var description = $(e.target).parent().attr("description");
var html = '<span class="feature" featureid="' + id + '">[' + description + ']</span>';
editor.exec("insertHtml", { value: html });
$('.k-animation-container').hide();
featureMenu.close();
}
});
});
var result = {
text: 'Insert Feature',
cssClass: "insert-feature",
items: list
}
featureMenu.remove(".insert-feature");
featureMenu.append([result]);
}

$.get(window.pulse.Category.Url.GetOptionFeatures + '?optionId=' + optionId, function (data) {
updateFeatureList(data.Data);
}, 'json');

</code>

The menu populates correctly but when selecting an item from the list the menu stops working. the style changes and clicking on the menu does nothing.

I am using Kendo version 2018.2.620 and JQuery version 3.31 and testing using chrome 69.0.3497.81.

2 Answers, 1 is accepted

Sort by
0
Ivan Danchev
Telerik team
answered on 20 Sep 2018, 03:58 PM
Hello Patrick,

We have tested this scenario and found out that the Menu is stripped of Kendo UI classes after the Editor is focused. The Editor might be focused manually by clicking within its content area or in the case of selecting the Menu items it is focused automatically by the insertHtml command: editor.exec("insertHtml"...

We logged this behavior for further evaluation in our Github repo, see the following issue. We would need more time to determine whether we would support nesting a Menu as a custom tool within the Editor, in which case the issue will be transformed into a bug and will be subsequently fixed, or whether there is a limitation in the Editor that prevents using the Menu as a custom tool. If we accept the latter we will declare this scenario as a limitation. This evaluation should not take long so we would suggest tracking the linked issue, where we will follow up with further details.

Regards,
Ivan Danchev
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Ivan Danchev
Telerik team
answered on 21 Sep 2018, 06:09 AM
Hello Patrick,

As a quick follow up, after the evaluation the issue is now considered a bug and we will try to include the fix in the next service pack release.

I updated your Telerik points for reporting this issue.

Regards,
Ivan Danchev
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
Editor
Asked by
Patrick
Top achievements
Rank 1
Answers by
Ivan Danchev
Telerik team
Share this question
or