Open vscheideck opened 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
.
Hi, Thanks for your answer. awesome! I've just adjusted data on the backend side to the structure as you mentioned. The correct answer was impossible to find online. Please update https://ckeditor.com/docs/ckeditor4/latest/features/mentions.html#asynchronous-backend-url best,
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