2

単純な html ファイルで動作するように、このタグ マネージャーの簡単な実装を誰かに見せてもらえますか?

http://welldonethings.com/tags/manager

以下に示すように自分で実装しようとしましたが、機能させることができません。

<html>
<head>
     <title>tags example</title>
     <script type="text/javascript" src="assets/js/bootstrap-tagmanager.js"></script>
     <script type="text/javascript" src="assets/css/bootstrap-tagmanager.css"></script>
     <script src="assets/js/jquery-1.9.0.min.js" type="text/javascript"></script>
 </head>
 <body>

 <input type="text" name="tags" placeholder="Tags" class="tagsManager"/>

 <script src="assets/js/angular/angular.min.js"></script>
 <script src="assets/js/angular/angular-resource.min.js"></script>
 <script src="assets/js/app.js"></script>
 <script src="assets/js/controllers.js"></script>
 <script src="assets/js/jquery-ui-1.10.0.custom.min.js" type="text/javascript">                    </script>
 <script src="assets/js/bootstrap.min.js" type="text/javascript"></script>

 <script type="text/javascript">
     jQuery(".tagManager").tagsManager({
         prefilled: ["Pisa", "Rome"],
         CapitalizeFirstLetter: true,
         preventSubmitOnEnter: true,
         typeahead: true,
         typeaheadAjaxSource: null,
         typeaheadSource: ["Pisa", "Rome", "Milan", "Florence", "New York", "Paris",      "Berlin", "London", "Madrid"],
         delimeters: [44, 188, 13],
         backspace: [8],
         blinkBGColor_1: '#FFFF9C',
         blinkBGColor_2: '#CDE69C',
         hiddenTagListName: 'hiddenTagListA'
     });
 </script>

 </body>
 </html>
4

1 に答える 1

3

このFIDDLEをチェックしてください。隠しフィールドhiddenTagListAも追加していません

これからコードを変更します

 <script type="text/javascript" src="assets/js/bootstrap-tagmanager.js"></script>
 <script type="text/javascript" src="assets/css/bootstrap-tagmanager.css"></script>
 <script src="assets/js/jquery-1.9.0.min.js" type="text/javascript"></script>

 <script type="text/javascript">
 jQuery(".tagManager").tagsManager({
     prefilled: ["Pisa", "Rome"],
     CapitalizeFirstLetter: true,
     preventSubmitOnEnter: true,
     typeahead: true,
     typeaheadAjaxSource: null,
     typeaheadSource: ["Pisa", "Rome", "Milan", "Florence", "New York", "Paris",      "Berlin", "London", "Madrid"],
     delimeters: [44, 188, 13],
     backspace: [8],
     blinkBGColor_1: '#FFFF9C',
     blinkBGColor_2: '#CDE69C',
     hiddenTagListName: 'hiddenTagListA'
 });
</script>

これに

 <link href="assets/css/bootstrap-tagmanager.css" rel="stylesheet" type="text/css" />
 <script src="assets/js/jquery-1.9.0.min.js" type="text/javascript"></script>
 <script type="text/javascript" src="assets/js/bootstrap-tagmanager.js"></script>

 <script type="text/javascript">
  $(function () {
    $(".tagsManager").tagsManager({
     prefilled: ["Pisa", "Rome"],
     CapitalizeFirstLetter: true,
     preventSubmitOnEnter: true,
     typeahead: true,
     typeaheadAjaxSource: null,
     typeaheadSource: ["Pisa", "Rome", "Milan", "Florence", "New York", "Paris",      "Berlin", "London", "Madrid"],
     delimeters: [44, 188, 13],
     backspace: [8],
     blinkBGColor_1: '#FFFF9C',
     blinkBGColor_2: '#CDE69C',
     hiddenTagListName: 'hiddenTagListA'
  });
});
 </script>
于 2013-03-02T06:34:16.983 に答える