目的:tagEditorとAutocompleteを両立したものを作りたいのですが、↓のリンク先のものを使ってくださいと言うことだったのですが、なかなか上手く行かず困っています。
tagEditorのリンク
Autocompleteのリンク
行ったこと:
①
jquery-ui.theme.css
jquery.tag-editor.css
jquery-ui.css
jquery-ui.structure.css
bower.json
jquery.caret.min.js
jquery.tag-editor.min.js
jquery-3.2.1.min.js
jquery-ui.min.js
tag-editor.jquery.json
これらは入っていて、リンクされています!
②
jquery.tag-editor.js
jquery-ui.js
という新しいファイルを作りそこで、jquery.tag-editor.jsに↓の様に書きいたところちゃんと動きました。
$('#autocomplete').tagEditor({ initialTags: ['Hello', 'World', 'Example', 'Tags'], delimiter: ', ', /* space and comma */ placeholder: 'Enter tags ...' });
jquery-ui.jsには↓の様に書き、こちらもちゃんと動きました。
$( function() { var availableTags = [ "ActionScript", "AppleScript", "Asp", "BASIC", "C", "C++", "Clojure", "COBOL", "ColdFusion", "Erlang", "Fortran", "Groovy", "Haskell", "Java", "JavaScript", "Lisp", "Perl", "PHP", "Python", "Ruby", "Scala", "Scheme" ]; $( "#autocomplete" ).autocomplete({ source: availableTags }); } );
しかし、jquery.tag-editor.jsに↓のように書くと、どっちも効果がなくなります。
$('#autocomplete').tagEditor({ autocomplete: { delay: 0, // show suggestions immediately position: { collision: 'flip' }, // automatic menu position up/down source: ['ActionScript', 'AppleScript', 'Asp', ... 'Python', 'Ruby'] }, forceLowercase: false, placeholder: 'Programming languages ...' });
試したこと:
forceLowercase: false,をはずすと、tagEditorの効果だけは表れます。
よろしくお願いします
回答1件
あなたの回答
tips
プレビュー