LoginSignup
0

More than 3 years have passed since last update.

MaterializeのChipsでつまづいた

Posted at

はじめに

ポートフォリオ作成中に使い慣れたbootstrapからmaterializeに挑戦中なのですがjqueryのプラグインの導入の際につまづいたので備忘録として残します。

やりたいこと

image.png
エンターキーを押したら画像のようにタグを出現させたい

つまづきポイント

公式のリファレンスにはscriptを書いてクラス名にchipsとつけるくらいしか書かれていない。見様見真似でやってみると中々フォームが出てきてくれませんでした。

つまづいていた時のコードがこちらです。
image.png

chipsの中でformに書きたかったのでformをchipsで囲んでいました。
jqueryの読み込む順番からscriptの書き方など見直していましたが思い通り動きませんでした。

解決法

公式ページでchipsの動きを見ているとchipsの中でchipが生成されており、タグを打つたびにchipができていました。
image.png
余計なものを入れるなってことですかね。これで動きました。

地道に検証モードで見ていくとエラーが分解されていきました。

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0