select2が上手く動いてくれなくて辛かったので備忘録

select2が上手く動いてくれなくて辛かったので備忘録

どうも、最近フラれたmasayukiです♪

当分、プログラミングとランニングだけに専念しなさいという神のお告げだと紳士に受け止めプログラミング力工場に勤めたいと思います。

select2がgoogle chrome環境だと上手く日本語入力できない

タイトルの通りなのですが、select2が上手く動いてくれませんでした。

railsのライブラリー出ない本家select2のCDNを利用して↓こんなコードで試してもも見たのですが、やはり同じ状態。サファリでは上手く動くのでおそらくselect2の問題じゃないかと。

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title></title>

    <script src="https://code.jquery.com/jquery-3.3.1.js"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.7/css/select2.min.css" rel="stylesheet" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.7/js/select2.min.js"></script>
    <style>
select {
  width: 100%;
}
    </style>


  </head>
  <body>
    <select class="js-example-tokenizer" multiple="multiple" style=>
      <option selected="selected">orange</option>
      <option>white</option>
      <option selected="selected">purple</option>
    </select>

    <script>
      $(".js-example-tokenizer").select2({
        tags: true,
        tokenSeparators: [',', ' ']
      })
    </script>
  </body>
</html>

select2のissueでもこんなの↓があるので、これが原因ではないかと。(詳しく調査できてませんが。)

https://github.com/select2/select2/issues/5516

とりあえず手っ取り早く使えるようにしたかった

あまり褒められた解決法ではないですが、select2-railsのバージョンを指定してbundle updateし直したところ問題なく動きました。

gem 'select2-rails', '4.0.1.1'

結構時間溶かしてしまったので、備忘録。

日本語入力っていろいろ辛いですね。