Can't get multiple delimeters to work.

[PieEatingChamp]

I have tried the example at the link below, but the "#" symbol never triggers the lookup.

Issue # 2

When I added a break point on the 1st getJSON call, it only hits it when I type a "@".

Thoughts?

[StevenDevooght]

Hi,

Can you show me your tinyMCE config file? Which browser and what version of the plugin are you using?

[PieEatingChamp]

I have attached my project below. I'm running it via localhost on my home PC. It's using TinyMCE 4.3.12.

Here are the issues I'm having:

1. The 2nd delimiter "#" isn't working in IE11, Chrome, or Firefox.
2. The 1st delimiter "@" is only working in IE11. In Chrome and Firefox it just shows the popup, but never populates the list.
3. The "insert" and "render" functions aren't triggering.

Let me know if you have questions or need anything else.

TinyMCEDemo.zip

[StevenDevooght]

The delimiter configuration setting has to be declared inside the mention configuration. Your config should look lik this:

tinymce.init({
            mode: "exact",
            selector: '#ReqEditor',
            plugins: 'code mention',
            mentions: {
                delimiter: ['@', '#'],
                source: function (data, process, delimiter) {
                    // Do your ajax call
                    // When using multiple delimiters you can alter the query depending on the delimiter used
                    if (delimiter === '@') {
                        $.getJSON('/data/users.json', function (data) {
                            //call process to show the result
                            process(data)
                        });
                    } else {
                        $.getJSON('/data/requirements.json', function (data) {
                            //call process to show the result
                            process(data)
                        });
                    }
                }
            },
            insert: function(item) {
                return '[[U' + item.name + ']';
            },
            render: function (item) {
                return '<li><a href="javascript:;"><span>' + item.name + '</span></a></li>';
            }
        });

[PieEatingChamp]

Thanks! It's always something simple. :) Turns out that was also the issue with my "insert" and "render" settings.

I think I read on this site that I can perform different "insert" and "render" for each delimiter, right? I just need to check which delimiter was used inside those functions?

[StevenDevooght]

Indeed. You can find what you want here.