javascript - jQuery Typeahead - Uncaught TypeError: Cannot read property 'name' of undefined - Stack Overflow

admin管理员组

文章数量:1328014

I am using the Bootstrap-3 Typeahead plugin as well as the Bootstrap Tag Input plugin. I use it like this:

<input type="text" id="name" name="test" data-provide="typeahead">

And the jQuery:

$.get('/design/assets/advertisements/countries.json', function(data) {
    $("#name").typeahead({
        source: data
    });
    $('#name').tagsinput({
        typeahead: {
            source: data
        }
    });
}, 'json');

However, the typeahead and tags works to some point. Whenever I enter some words, i get suggestions, but whenever I've selected a suggestion, whatever I was writing will be added after the tag input.

Example: If I write "Bah" and select "Bahamas", it looks like this: (Where I would believe that it would delete the "Bah")

I get this error - I don't know if that's the reason:

Uncaught TypeError: Cannot read property 'name' of undefined

The error is called to this file: bootstrap3-typeahead.js

I am using the Bootstrap-3 Typeahead plugin as well as the Bootstrap Tag Input plugin. I use it like this:

<input type="text" id="name" name="test" data-provide="typeahead">

And the jQuery:

$.get('/design/assets/advertisements/countries.json', function(data) {
    $("#name").typeahead({
        source: data
    });
    $('#name').tagsinput({
        typeahead: {
            source: data
        }
    });
}, 'json');

However, the typeahead and tags works to some point. Whenever I enter some words, i get suggestions, but whenever I've selected a suggestion, whatever I was writing will be added after the tag input.

Example: If I write "Bah" and select "Bahamas", it looks like this: (Where I would believe that it would delete the "Bah")

I get this error - I don't know if that's the reason:

Uncaught TypeError: Cannot read property 'name' of undefined

The error is called to this file: bootstrap3-typeahead.js

• javascript
• jquery
• html
• twitter-bootstrap
• typeahead.js

Share Improve this question Follow asked Jun 29, 2015 at 14:53 oliverbjoliverbj 6,0623030 gold badges9696 silver badges198198 bronze badges 1

• check this stackoverflow./questions/29360584/… – Dhiraj Commented Jun 30, 2015 at 2:46

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 6

I've downloaded non-min version of bootstrap-3 typeahead plugin and changed this:

displayText: function(item) {
  return item.name || item;
},

to this

displayText: function(item) {
  if (typeof item == 'undefined') {
    return '';
  }
  return item.name || item;
},

It solved the problem.

Actually I don't know whether it's a bootstrap-3 typeahead plugin bug or some kind of it's inpatibility with bootstrap tags input plugin which I use.

I did the following change for Bootstrap 3 - typeahead in line number 312

Old Code:

displayText: function (item) {
      return typeof item !== 'undefined' && typeof item.name != 'undefined' && item.name || item;
},

Updated Code:

displayText: function (item) {
        if(item){
                if(item.name){
                    return item.name;
                }
                return item;
        }
        else{
            return '';
        }
    },

本文标签： javascriptjQuery TypeaheadUncaught TypeError Cannot read property 39name39 of undefinedStack Overflow