jquery.mention Default Text

Question

I am trying to implement jquery.mentions for sugesting users in the system when entering the @ sign.

All is working well, with an Ajax query being used to populate the list.

However, for editing existing comments I am struggling.

I have set the default text to a valid value that was generated previously, but it does not display correctly.

The value rendered is

@[Peter Jones](contact:200)

which displays as Peter Jones

If I set this to the default text, it is displayed as @Peter Jones (showing the @ sign)

Is this a bug? Does anybody have a fix?

My code is as follows

$(function () {

    $('textarea.mention').mentionsInput({
        defaultValue  : '@[Peter Jones](contact:200)',
        onDataRequest:function (mode, query, callback) {
            $.getJSON('Ajax/GetUserTags.php', function(responseData) {
            responseData = _.filter(responseData, function(item) { return item.name.toLowerCase().indexOf(query.toLowerCase()) > -1 });
            callback.call(this, responseData);
            });
        }
    });

    $('.get-syntax-text').click(function() {
      $('textarea.mention').mentionsInput('val', function(text) {
        alert(text);
      });
    });

    $('.get-mentions').click(function() {
      $('textarea.mention').mentionsInput('getMentions', function(data) {
        alert(JSON.stringify(data));
      });
    }) ;


  });

score 3 · Accepted Answer · answered Jul 03 '17 at 22:22

I looked in the jquery.mentionsinput and adjusted the resetInput function.

When setting the newMentionText, I have removed the Match[1] element which is the @ sign.

    function resetInput(currentVal) {
        mentionsCollection = [];
        var mentionText = utils.htmlEncode(currentVal);
        var regex = new RegExp("(" + settings.triggerChar + ")\\[(.*?)\\]\\((.*?):(.*?)\\)", "gi");
        var match, newMentionText = mentionText;
        while ((match = regex.exec(mentionText)) != null) {
            //alert(match[0] + "\n" + match[1] + "\n" + match[2]);
            //newMentionText = newMentionText.replace(match[0], match[1] + match[2]);
            newMentionText = newMentionText.replace(match[0], match[2]);
            mentionsCollection.push({ 'id': match[4], 'type': match[3], 'value': match[2], 'trigger': match[1] });
        }
        elmInputBox.val(newMentionText);
        updateValues();
    }

Tested with multiple tags and all works OK.

jquery.mention Default Text

1 Answers1