简体   繁体   中英

Bootstrap Typeahead and Tagsinput doesn't live together

i made this script and works perfectly:

$('.js_tags').typeahead({
            minLength: 3,
            source: function (query, process) {
                return $.ajax ({
                    url: '/app/route',
                    type: 'POST',
                    data: 'query='+query,
                    dataType: "json",
                    async: true,
                    success: function (data){
                        process(data);
                    },
                    error: function (request, status, error) {
                        console.log(request.responseText);
                    }
                })
            }
        });

how can i implement my script in a tagsinput?

I tried with this, but without success:

$('.js_tags').tagsinput({
        typeahead:{
            minLength: 3,
            source: function (query, process) {
            return $.ajax ({
                url: '/app/route',
                type: 'POST',
                data: 'query='+query,
                dataType: "json",
                async: true,
                success: function (data){
                    process(data);
                },
                error: function (request, status, error) {
                    console.log(request.responseText);
                }
            })
        },
});

i get a:

  Uncaught TypeError: process is not a function

What can i do?

I tried some stuff but none of them works...i don't want to use other components..

Thank you

$('.typeahead').typeahead({
    source: function (query, process) {
        return $.get('/typeahead', { query: query }, function (data) {
            return process(data.options);
        });
    }
});

To consume JSON data like this:

{
    "options": [
        "Option 1",
        "Option 2",
        "Option 3",
        "Option 4",
        "Option 5"
    ]
}

For Tagsinputs

$('.tagsInput').tagsinput({
      minLength: 3,
      typeahead: {                  
          source: function(query) {
            return $.get('/app/route').done(function(data){
              /*if you have add `content-type: application/json` in 
                server response then no need to parse JSON otherwise,
                you will need to parse response into JSON.*/
              return $.parseJSON(data);
            })
          }
      }
 });

Note: data return only in JSON

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM