ビューの描画

全てのコントローラーのアクションはビューとの関連付けの為に、renderメソッドを呼んでいるでしょう。例えばusersコントローラーのindexアクションはapp/views/users/index.ejsファイルをビューとして描画します。

ビューは、コントローラーで指定されたレイアウトで描画されます。標準のレイアウト名はこの場合、コントローラー名と同じapp/views/layouts/users_layout.ejsとなります。このレイアウトファイルが存在しない場合には、applicationレイアウトが使用されます。

レイアウト無しでビューを描画したい場合には、コントローラー内で、layout(false)を呼び出せば、レイアウトの描画はスキップされるでしょう。

標準のヘルパー

railwayはいくつか標準でヘルパーを使用することができます。

link_to

link_to('Users index', '/users');
// <a href="/users">Users index</a>
link_to('Users index', '/users', {class: 'menu-item'});
// <a href="/users" class="menu-item">Users index</a>
link_to('Users index', '/users', {remote: true});
// <a href="/users" data-remote="true">Users index</a>
  • 最初の引数はリンク名です
  • 二つ目の引数はリンクパスです
  • 三つ目の引数はリンクプロパティオブジェクトです。
    下記例では、三つ目の引数は{remote: true}となっており、 a タグのアトリビュートにdata-remote="true"が追加されます。このリンクをクリックすると/usersにajaxのGETリクエストを送信するjavascriptが実行されます。
    下記では、レスポンスを処理するためのjsonpパラメータも指定しています。
  • link_to('Users index', '/users', {remote: true, jsonp: 'renderUsers'});
    // <a href="/users" data-remote="true" data-jsonp="renderUsers">Users index</a>

    サーバーからjson {users: [{},{},{}]}が送られ、renderUsers関数に引数として渡されます。

    renderUsers({users: [{},{},{}]});

    jsonpパラメータには無名関数も指定できます。

    {jsonp: '(function (url) {location.href = url;})'}

    サーバーから"http://google.com"のコンテンツを送りたい時にはjavascriptは下記のように評価されます

    (function (url) {location.href = url;})("http://google.com");

    この為無名関数を括弧で囲む必要があるのです。

    form_for

    <% form_for(user, path_to.users, function (form) { %>
       <p>
           <%- form.label('name', 'Username') %>
           <%- form.input('name') %>
       </p>
       <p>
           <%- form.submit('Save') %>
       </p>
    <% }); %>

    下記が生成されます。

    <form action="/users/1" method="POST">
        <input type="hidden" name="_method" value="PUT" />
        <input type="hidden" name="authencity_token" value="qwertyuiop1234567890!@#$%^&*()" />
       <p>
           <label for="name">Username</label>
           <input id="name" name="name" value="anatoliy" />
       </p>
       <p>
           <input type="submit" value="Save" />
       </p>        
    </form>

    stylesheet_link_tag

    <%- stylesheet_link_tag('reset', 'style', 'mobile') %>

    これは下記が生成されます。

    <link media="screen" rel="stylesheet" type="text/css" href="/stylesheets/reset.css?1306993455523" /> 
    <link media="screen" rel="stylesheet" type="text/css" href="/stylesheets/style.css?1306993455523" />

    javascript_include_tag

    <%- javascript_include_tag(
      'https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js',
      'rails', 'application') %>

    これは下記が生成されます。

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
    <script type="text/javascript" src="/javascripts/rails.js?1306993455524"></script> 
    <script type="text/javascript" src="/javascripts/application.js?1306993455524"></script>