Currently, I am in the process of developing an external template manager using ASP.net for my company.
This template manager allows users to perform all CRUD actions, including create, read, update, and delete.
Various departments within the organization utilize these templates, so I have incorporated a category field in the template manager to facilitate filtering.
My goal is to enhance the template plugin by modifying the plugin.js file to include a dynamic listbox category feature.
This way, when a user attempts to add a template in the editor, they can select their department [category], and only relevant templates will be displayed in the listbox [template].
All template definitions [title, content, description, category] are retrieved from an MS SQL DB using an ASP repeater Control.
The result generated by the repeater provides the necessary template plugin definition:
templates:
[
{"title": "Some title 1", "description": "Some desc 1", "content": "My
content", "category": "support"},
]
I made an attempt (though not proficient in JS and Object-oriented programming) :
win = editor.windowManager.open({
title: 'Insert template',
layout: 'flex',
direction: 'column',
align: 'stretch',
padding: 15,
spacing: 10,
items: [
{
type: 'form', flex: 0, padding: 0, items: [
{
type: 'container', label: 'Templates', items: {
type: 'listbox', label: 'Templates', name: 'template',
values: values, onselect: onSelectTemplate
},
//Added BY ME
type: 'container', label: 'Category', items: {
type: 'listbox', label: 'Category', name: 'category',
values: valuesCategory, onselect: onSelectCategory
}
}
]
},
{ type: 'label', name: 'description', label: 'Description', text:
'\u00a0' },
{ type: 'iframe', flex: 1, border: 1 }
],
onsubmit: function () {
insertTemplate(false, templateHtml);
},
minWidth: Math.min(DOMUtils.DOM.getViewPort().w,
editor.getParam('template_popup_width', 600)),
minHeight: Math.min(DOMUtils.DOM.getViewPort().h,
editor.getParam('template_popup_height', 500))
});
win.find('listbox')[0].fire('select');
win.find('listbox')[0].fire('select');
I have defined valuesCategory & onSelectCategory elsewhere in the code.
However, the list box does not appear in the dialog. I have searched online for similar solutions with TinyMCE but have not found anything relevant. Can someone assist me in implementing this functionality?
Thank you for your input!
Wishing you a great day ahead!