KarolDawidziuk
commented
2 years ago Hello, @vscheideck and thank you for the report.
I see that there is a problem with the received data structure.
When we use a hardcoded data in the array, such as ['Anna, 'Geralt'] the createArrayFeed() function changes the input structure from the mentioned above to:
[
{
id: 1,
name: 'Anna'
},
{
id: 2,
name: 'Geralt'
}
] But, when we want to fetch data from an external source like in your case, this data does not adjust to the appropriate structure.
Also, your configuration with CKEDITOR.config.mentions = [ { feed: '/ajax_mention.php' } ]; may be incorrect, because in that case you are fetching the entire feed on every single call. So, even if you type Ger, Anna still will be visible.
In this case, use a special query encodedQuery which will pass information about the searched patterns to the backend. But still you need to handle filtering on the backend.
More information about mention plugin: https://ckeditor.com/docs/ckeditor4/latest/features/mentions.html#asynchronous-backend-url
For now, I see two possibilities 🤔 It's more like a workaround. You can fetch feed data before initialization of mention plugin and pass received data like:
var feedData = <fetched parsed data via async call>
...
CKEDITOR.config.mentions = [ { feed: feedData } ];Or you can adjust data on the backend side to the structure as I mentioned at the beginning of my comment, and handle filtering with encoedeQuery.
vscheideck
Type of report
Bug
Provide detailed reproduction steps (if any)
Hello everyone,
I have a javascript error using CKEDITOR 4 and the Mentions Plugin.
I can't solve this problem for 2 days, I'm stuck.
I've used the online builder to get CKEDITOR + Mentions plugin.
See my build here: https://ckeditor.com/cke4/builder/fbe187b32ec7c025e28e01a537c72c62
With the following configuration it works fine: I see the drop down list with the names : Anna, Thomas, John
CKEDITOR.config.mentions = [{feed: ['Anna', 'Thomas', 'John']}];
However, when doing an ajax call to get the data, I got a javascript error:
The script /ajax_mention.php
displays
["Anna", "Thomas", "John"]
with the following configuration :
CKEDITOR.config.mentions = [{feed: '/ajax_mention.php'}];
when I type in the editor "@Anna", the names do not display
the /ajax_mention.php script is launched and displays the correct data (when I look at the "network" tab on Chrome. see screenshot)
["Anna", "Thomas", "John"]
However, this triggers a javascript error (looking at the Chrome console tab. see screenshot)
ckeditor.js?1645882460:916 Uncaught TypeError: Cannot read properties of null (reading 'addClass') at g.selectItem (ckeditor.js?1645882460:916:473) at d.onSelectedItemId (ckeditor.js?1645882460:912:276) at f.q (ckeditor.js?1645882460:10:246) at f.fire (ckeditor.js?1645882460:12:91) at f.select (ckeditor.js?1645882460:920:294) at f.selectFirst (ckeditor.js?1645882460:920:371) at d.open (ckeditor.js?1645882460:910:503) at d.modelChangeListener (ckeditor.js?1645882460:911:234) at f.q (ckeditor.js?1645882460:10:246) at f.fire (ckeditor.js?1645882460:12:91)
See screen copy: https://polyglotclub.com/bug_ckeditor_mentions.jpg