BackEnd

RailsでAjax処理で画面を更新する

投稿日:

はじめに

RailsでAjax処理で画面を更新する方法を簡単に紹介します。

View(遷移元)の設定

link_toやform_forなどで remote: true を指定します。
(下記の例ではusers_controller.rbのupdateアクションが実行されます)

Controllerの実装

コントローラーでは特別な処理はありません。
通常通りの更新処理を書きます。

View(遷移先)の実装

update.js.erbファイルにJavaScriptの処理を書いていきます。
.attrなどで個別に要素を変更するだけでなく、下記のようにpartialとして切り出したテンプレートを指定して画面を更新することもできます。

このようにすると、id=”user_status”の子要素としてレンダリングしてくれます。
partialとして切り出したテンプレート内のidを指定してしまうと、Ajax遷移するたびにどんどんネストされていくので注意が必要です。

また、上記のようにAjaxで遷移した場合redirect_toでリダイレクトできません。
更新失敗などの時にリダイレクトしてたい場合は、下記のようにするとできます。

参考

http://qiita.com/mm36/items/684f36f22e79d0a27ae9
http://qiita.com/geshi/items/536956b8bed7c2126187

さいごに

RailsでAjax処理で画面を更新する方法を簡単に紹介しました。

blog-page_footer_336




blog-page_footer_336




-BackEnd
-

執筆者:


comment

メールアドレスが公開されることはありません。

CAPTCHA


関連記事

laravel logo

[Laravel]データベースの暗号化について考えてみる

1 はじめに2 環境3 Laravelでの暗号化4 暗号化されたカラムは、そのままではLIKE検索ができない4.1 問題点4.2 解決案1:全件取得してPHP側でがんばって検索する4.3 解決案2:暗 ...

Go言語

Go言語の基礎〜Go 1.11 開発環境構築とパッケージバージョン管理〜

1 はじめに2 Go言語(Golang)とは2.1 シンプルな構文2.2 コンパイル言語2.3 並行処理2.4 その他の特徴3 Go開発環境の構築3.1 Goのインストール3.1.1 1. homeb ...

WebアプリからLINEのメッセージを送る方法

1 はじめに2 Messaging APIとは2.1 Messaging APIの仕組み2.2 Webhookイベント2.3 メッセージオブジェクトの種類2.4 料金形態3 LINE Develope ...

rails

form_withでフォームの送信前に処理を行う方法

1 はじめに2 form_with3 サンプル4 さいごに5 参考 はじめに フォームを送信する前に処理を行いたいケース(Google Analyticsのイベントのトラッキングなど)があると思います ...

laravel logo

LaravelのDI

1 はじめに2 DIに関する機能2.1 DIとは2.2 サービスコンテナ2.3 サービスプロバイダ3 サービスコンテナ3.1 バインド3.2 bind3.3 bindIf3.4 singletonメソ ...

フォロー

blog-page_side_responsive

2018年1月
 123456
78910111213
14151617181920
21222324252627
28293031  

アプリ情報

私たちは無料アプリもリリースしています、ぜひご覧ください。 下記のアイコンから無料でダウンロードできます。