bootstrap-tagsinput не работает

Я вижу хороший контроль

http://timschlechter.github.io/bootstrap-tagsinput/examples/

Но на основе этого я пробовал коды ниже, это не сработало, может ли кто-нибудь мне помочь

<script type="text/javascript" src="jquery-1.10.2.min.js" ></script>

<script src="http://timschlechter.github.io/bootstrap-tagsinput/examples/bower_components/angular/angular.min.js"></script>
<script src="http://timschlechter.github.io/bootstrap-tagsinput/examples/bower_components/google-code-prettify-lite/prettify.js"></script>
<script src="http://timschlechter.github.io/bootstrap-tagsinput/examples/bootstrap-2.3.2/js/bootstrap.min.js"></script>
<script src="http://timschlechter.github.io/bootstrap-tagsinput/dist/bootstrap-tagsinput.js"></script>
<script src="http://timschlechter.github.io/bootstrap-tagsinput/dist/bootstrap-tagsinput-angular.js"></script>

<body>
<br />
<input type="text" value="" data-role="tagsinput"  />
<br />
</body>
<script>
$('input').tagsinput({
  typeahead: {
    source: [{"value":1,"text":"Amsterdam"},
{"value":4,"text":"Washington"},
{"value":7,"text":"Sydney"},
{"value":10,"text":"Beijing"},
{"value":13,"text":"Cairo"}]
  }
});
</script>

twitter-bootstrap twitter-bootstrap-2
person Kuttan Sujith    schedule 28.10.2013    source источник
comment
Исправить путь к bootstrap.min.js   -  person SaudiD3mon    schedule 28.10.2013
comment
Это не проблема   -  person Kuttan Sujith    schedule 28.10.2013
comment
Я получаю TypeError: tagsinput[arg1] не является функцией   -  person Kuttan Sujith    schedule 28.10.2013
comment
Это не распознается как функция, потому что .js не включен правильно.   -  person SaudiD3mon    schedule 28.10.2013

Ответы (2)


arrow_upward
1
arrow_downward

Это связано с известной ошибкой: https://github.com/TimSchlechter/bootstrap-tagsinput/issues/42

Чтобы решить эту проблему, не используйте data-role="tagsinput" и $('input').tagsinput(...) вместе.

Tagsinput не является функцией, используя bootstrap 3 и плагин для ввода тегов

person crafter    schedule 19.03.2014

arrow_upward
0
arrow_downward

Я использую тот же плагин в проекте, проблема с источником typeahead, это должен быть json с простыми элементами без объектов.

Взгляните на эту скрипку, я уверен, что она поможет вам

Скрипка

$('input').tagsinput({
    typeahead: {
        source: function (query, process) {
            cities = [];
            map = {};

            var data = [{
                "value": 1,
                    "text": "Amsterdam"
            }, {
                "value": 4,
                    "text": "Washington"
            }, {
                "value": 7,
                    "text": "Sydney"
            }, {
                "value": 10,
                    "text": "Beijing"
            }, {
                "value": 13,
                    "text": "Cairo"
            }];

            $.each(data, function (i, city) {
                map[city.text] = city;
                cities.push(city.text);
            });

            return (cities);
        }
    }
});

Предварительно выбранный JSON

cities = [];
map = {};

var preFetchResult = function (query, callback) {
    $.get("/cities", {
        "data": query
    }, function (data) {
        $.each(data, function (i, city) {
            map[city.text] = city;
            cities.push(city.text);
        });
    });
};

preFetchResult.done(function (response) {
    $('input').tagsinput({
        typeahead: {
            source: function (query, process) {
                return (cities);
            }
        }
    });
});
person ppollono    schedule 20.11.2013
comment
Как я могу использовать предварительную выборку данных JSON в вашем примере? - person dcclassics; 04.04.2014
comment
Проверьте обновленный ответ, используйте get как обещание, дайте мне знать, если это сработает для вас =) - person ppollono; 09.07.2014