File tree Expand file tree Collapse file tree 2 files changed +11
-9
lines changed
Expand file tree Collapse file tree 2 files changed +11
-9
lines changed Original file line number Diff line number Diff line change @@ -220,6 +220,7 @@ Collection object shown with defaults:
220220 closeOnScroll: true ,
221221
222222 // Set maximum number of items added to the input for the specific Collection, if no limit, set to null.
223+ // can only be used with a element in contenteditable mode
223224 maxDisplayItems: null ,
224225
225226 // Block specific collection, so it can be triggered or not
@@ -390,7 +391,9 @@ if (tribute.isActive) {
390391
391392If you want to embed a link in your ` selectTemplate ` then you need to make sure that the
392393anchor is wrapped in an element with ` contenteditable="false" ` . This makes the anchor
393- clickable _ and_ fixes issues with matches being modifiable.
394+ clickable _ and_ fixes issues with matches being modifiable. We also recomend adding the ` data-tribute-trigger="" `
395+ attribute to the anchor so that Tribute can check for the maxDisplayItems limit.
396+
394397
395398``` js
396399var tribute = new Tribute ({
@@ -408,11 +411,11 @@ var tribute = new Tribute({
408411 ],
409412 selectTemplate : function (item ) {
410413 return (
411- ' <span contenteditable="false"><a href="http://zurb.com" target="_blank" title=" ' +
412- item .original .email +
413- ' "> ' +
414- item . original . value +
415- " </a></ span>"
414+ ' <span contenteditable="false">' +
415+ ' <a href="http://zurb.com" target="_blank" data-tribute-trigger="@" title=" ' + item .original .email + ' "> ' +
416+ item . original . value +
417+ ' </a> ' +
418+ ' </ span>'
416419 );
417420 }
418421});
Original file line number Diff line number Diff line change @@ -208,9 +208,8 @@ class Tribute {
208208 return `${ this . current . collection . trigger } ${ this . current . mentionText } ` ;
209209 if ( this . range . isContentEditable ( this . current . element ) ) {
210210 return (
211- '<span class="tribute-mention">' +
212- ( this . current . collection . trigger +
213- item . original [ this . current . collection . fillAttr ] ) +
211+ '<span class="tribute-mention" data-tribute-trigger="' + this . current . collection . trigger + '">' +
212+ ( this . current . collection . trigger + item . original [ this . current . collection . fillAttr ] ) +
214213 "</span>"
215214 ) ;
216215 }
You can’t perform that action at this time.
0 commit comments