【Ember cookbook】表示した TextField にフォーカスをあてる

技評のEmber記事を3回くらいやって、そこから ember-rails で同じことをやってみた。

んで、そっから少しずつ理解できるようになって、会社のコードも少しずつ読めるようになった。

まずはメモから作ってみる

やっぱ自分で書かんとダメだな！って思って、とりあえずメモを作ってみた。

理由としては、自分でCRUDができるようになりたかったのと、formの入力系がたくさんあるとどれが影響して動かんのんか分からんなるけー1個にしたかった。

これは本当に勉強になった！

そのあと、試行錯誤がありcookbookへ

いろいろやってみたんじゃけど、イマイチ理解というか書けるようになっとる実感がなくて、一旦書くのをやめたんじゃけど・・・まーいろいろ思うところがあって再開！

んで、何かいい記事ないかな〜って探したら emberjs のサイトにcookbook発見！

できそうなやつをやっていくことにした！

Ember COOKBOOK

TextFieldのComponent を作って、フォーカスをあてる

ember はこんな感じ（エラーでまくっとるけどとりあえず動く）

FOCUSING A TEXTFIELD AFTER IT'S BEEN INSERTED

-------------------------------
Ember      : 1.13.5
Ember Data : 1.13.7
jQuery     : 1.11.2
-------------------------------

コードはサイトをみてもらうとして、変更した箇所だけ記述します。

テンプレート

{{focus-input value=body}}

focus-input.js

JsYattemita.FocusInputComponent = Ember.TextArea.extend({
  classNames: ['form-control'],
  placeholder: 'メモの内容を記入してください。',
  required: true,

  becomeFocused: function() {
    this.$().focus();
  }.on('didInsertElement')
});

この辺を参考にした。

INPUT HELPERS

何だかんだでやっぱ公式ページを見るのがいいっぽい。。。（日本語希望）

あと、この didInsertElement をちょいちょい見るけどイメージできてなかったんじゃけど、この例で理解できた！

Component を表示した後で、この中にあるイベント（？）を発火させとんじゃね！

ここでいうと、TextAreaを表示した後で focus をあてるって感じ！（たぶん。。）

didInsertElement 間違ってたらご指摘願います！！