ivirabyan / jquery-mentions

Adds mentioning support to your text fields.
http://ivirabyan.github.io/jquery-mentions/
MIT License
114 stars 49 forks source link

Can't get the valu to make ajax request on my databse. #62

Closed omar-rivero closed 7 years ago

omar-rivero commented 7 years ago

Hi, Can you please suggest me how can I get the input value to make a request on my database using Ajax.

Like this code:

$('textarea.mentions').mentionsInput({
     onDataRequest:function (mode, query, callback) {
       searchVal = query;
       $.ajax({
   type: "GET",
   dataType: "json",
   url: rootPath()+"user/tagFriends/"+searchVal,
   success: function(data){
    data = _.filter(data, function(item) { return item.name.toLowerCase().indexOf(query.toLowerCase()) > - 1 });
         callback.call(this, data);
   }

   });
     }
   });

Waiting for your reply.

Thanks,

omar-rivero commented 7 years ago

Hello ivirabyan, Yes it is question lol. Please help me to figure out the problem.

thanks

ivirabyan commented 7 years ago

You can use source option:

    $('textarea.mentions').mentionsInput({
        source: function( request, response ) {
            $.ajax({
                url: rootPath() + "user/tagFriends/" + request.term,
                ... // other options
            });
        }
    });
omar-rivero commented 7 years ago

Thanks for reply. I am testing now and I will let you know.

omar-rivero commented 7 years ago

Hi, thanks again. this code is working.

$('textarea.mentions').mentionsInput({ source: function( request, response ) {

        $.ajax({
            url: rootPath() + "user/tagFriends/" + request.term,
            type: "GET",
            dataType: "json",

            success: function(data){

            }
        });
    },
    showAtCaret: true

});

and success repose following: [{"value":"Alan Farago","uid":"115"}, {"value":"Gala Scibelli","uid":"220"}, {"value":"Joe Valandra","uid":"301"}, {"value":"Linda Purdy","uid":"563"}]

But not showing in Autocomplete. Please tell me how to show in autocomplete list. how can I set my response data as like your listing?
source: [ {value: 'alex', uid: 'user:1'}, {value: 'andrew', uid: 'user:2'}, {value: 'angry birds', uid: 'game:5'}, {value: 'assault', uid: 'game:3'} ], showAtCaret: true

Please help me.

ivirabyan commented 7 years ago

You should call response callback with the given data:

            success: function(data){
                  response(data)
            }

Or even easier: success: response

Here is a complete example of query like yours: https://jqueryui.com/autocomplete/#remote-jsonp

omar-rivero commented 7 years ago

Thank you so much. It is working.