selectboxに検索機能を追加できる「Select2」

• Tweet

リストからアイテムを選択させることはよくあります。そんな時、例えば100件ともなると、そこから探して選ぶのは大変ですよね。そこで便利なのが「Select2」。こいつを入れると一気にリッチになります。

select2はどんなもの？

まずはDemoをみてもらうのが早いです。

こんな感じで検索でselectboxの中から、選択ができるようになります。これは使いどころが多い。

選択したアイテムをタグ風に追加するパターンもあり。オプションも豊富でカスタマイズしやすいかも。

select2の使い方

<link href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.min.css" rel="stylesheet" />
<script src="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.min.js"></script>

CSSとJSを読み込んで、起動させるだけ。

<script type="text/javascript">
  $('select').select2();
</script>

かんたんです。これだけで基本使えるようになります。

Select2

フリーランスエンジニアの稼ぎ方

フリーランスエンジニアの稼ぎ方。ぶっちゃけ…開発以外のことを頑張ったほうが結果がでます。

• Tweet

PROFILE

プロフィール

入江 慎吾
サービスで世界をよりよくするために挑戦中。個をエンパワーメントするプロダクトをつくっています。個人開発コミュニティ「入江開発室」を運営（約300名） / MENTAなど20個以上のプロダクトを開発。
（詳しいプロフィール）

PRODUCT

イリテクで開発したプロダクト