Hi,

I am writing a Drupal plugin to incorporate your textcomplete plugin. https://www.drupal.org/sandbox/adammitchell/2291661

However I am having issues with the integration. CKEditor puts it's contenteditable inside an iframe so I had to slightly alter the plugin to use this.el.ownerDocument.getSelection().getRangeAt(0); instead of window.getSelection().getRangeAt(0);. After doing this I now get issues with CKEditor as I type. I wonder if you could help?

The issue is IndexSizeError: Index or size is negative or greater than the allowed amount on line 371 of ckeditor.js

Any insight into the issue would be greatly appreciated.

How about having replace function to return something like this

replace: function (word) { return '<span style="background: #BBBBBB;color: #FFFFFF;">' + word + '</span>' }

It currently inserts as code and not as html element into content editable.

I have implemented jquery-textcomplete plugin in my project but couldn't able to control the height of Suggestion dropdown. I want that the dropdown height should be adjusted according to its content and if content length exceeds the page height a scrollbar gets added automatically.

Kindly have a look on below snapshot

Textcomplete only seems to work if I require the library after the DOM loads. Note in both cases I'm calling $('textarea').textcomplete() after the DOM is loaded.

Obviously the workaround is to just put the script before the closing body tag, but since I am a rails user, that makes using the asset pipeline a pain.

works: https://gist.github.com/91639dc03efb09128197 doesn't work: https://gist.github.com/9b87f2121b7ea965299d

When I load it at in the head I get lots of errors like:

Uncaught TypeError: Cannot read property 'top' of undefined // because $activeEl is empty
Uncaught TypeError: Cannot read property 'value' of undefined

Shouldn't this work either way? Why is it dependent on the DOM being loaded on initialize.

This is an issue only with the example, and my regex is so bad I don't see the fix.

If the sample textarea is empty, the Words (tech companies) will not match the regex and the dropdown will not fire. Adding a single space and then typing a company works correctly.

I'm sure there's some regex for "starts with space OR text is blank", but I'm afraid I don't know it.

Thanks to anyone who knows it, and fixes the demo.

I tried to integrate jquery-textcomplete with ckeditor, then I got this error. TypeError: CKEDITOR.instances.issue_notes is undefined Can you guise give me a little help to accomplish this. I will put the code sample bellow. You can quickly look at this. Thanks.

This is jsfiddle : https://jsfiddle.net/btjapqkp/

The active <li> gets class="textcomplete-item active", but the .active class conflicts with Bootstrap styling. It should be changed to .textcomplete-item-active or something

Currently i can type @ and it display my list of values which then highlight using the overlay when selected. What you cannot do is have a space in a value so "@My value" would only highlight "@my". I would like the whole value to highight and recognise the spaces.

Does anyone know if this is possible?

Hello ,

Hope you are doing great,

Your plugin is great but there is still one issue in your plugin

your latest js is not working perfectly for ContentEditable example.

So I have tried your old js for my requirement

but it also create some issue.

Example :

in my editable div before searching using @ I have to write any one character then I also have to give space then search is working perfectly.

but if I try directly start with @ then its not working perfectly.

Please check it in ie9 and latest version of firefox.

Please help me

Thanks

For https://github.com/yuku/textcomplete/issues/346

• Added a method to SearchResult class to provide replacement data.
• Using the above method, replace only needed range in CodeMirror.
• In order not to change the interface of the SearchResult#replace, the information needed for replacement can be obtained with getReplacementData, which is used in SearchResult#replace and @textcomplete/codemirror.

Prevent memory leaks in single page application environment, when multiple CKEditor instances are initialized an destroyed one after another (As if posting several comments using CKEditor in a popup screen).

Because the dropdown's height is calculated as this.items.length * cursorOffset.lineHeight (https://github.com/yuku/textcomplete/blob/main/packages/textcomplete-core/src/Dropdown.ts#L227) when a max-height is set on the dropdown element, it's height is incorrectly calculated. This means the dropdown will be placed offscreen in certain circumstances, especially when there are a lot of items.

Could this.el.clientHeight be used instead?

This dropdown can show up to 100 items:

When I narrow the list down, it correctly displays on screen:

Hey!

Wanted to ask about potential bug and possible solution. It occurs when a search result that is being selected from textcomplete suggestions contains $0, $1 or any other number in similar pattern (which I guess represents regex substitution). Basically, what is happening, these substitution patterns are being replaced with empty strings or what is worse, with undefined string, probably because of the lines https://github.com/yuku/textcomplete/blob/main/packages/textcomplete-core/src/SearchResult.ts#L4 and https://github.com/yuku/textcomplete/blob/main/packages/textcomplete-core/src/SearchResult.ts#L24. I wonder what is the use case for that (like, how we can actually provide replacement groups, for example when search result that looks like fun$1() or VALUE$10). We could potentially try to escape these values somehow, but not sure if there's any callback that we can attach to to unescape them once they are parsed. Any suggestions highly appreciated!

TLDR: Selecting a suggestion from a textcomplete that contains regex substitution returns oddly - like ab$5ab -> abundefinedab.

Hi !

I switched from jquery-textcomplete to the new version but I can no longer paste html content in my contenteditable div, it is automatically escaped.

How can I solve my problem ?

I guess the problem is in the ContenteditableEditor file (applySearchResult method) with insertText

this.el.ownerDocument.execCommand(
    "insertText",
     false,
     replace[0] + replace[1]
)

How can I use textcomplete on a text area from the browser by just including the JSS/CSS? I found the JS on a CDN, but only for the textcomplete JS, not for the code.