rails应用ajax之二:使用rails自身支持
2015-01-12 10:13
344 查看
考虑另一种情况:
1. 页面上半部分显示当前的所有用户,页面下半部分是输入新用户的界面;
2. 每当输入新用户时,页面上半部分会动态更新新加用户的内容;
我们还是用ajax实现,不过这次用rails内部对ajax的支持,其中在服务器端返回一个js脚本,然后在客户端执行。
新建user数据结构 rails g scaffold User name:string age:integer
接着应用数据库视图 rake db:migrate
修改index.html.erb的内容:
同时新建一个局部模板_users.html.erb:
接下来增加服务器端对js的支持,很简单:
别忘了还要写服务器端的js脚本哦。在view下的users目录中新建一个create.js.erb文件:
基本完成鸟。整个流程大体如下:
首先用户访问users/index页面,当输入name和age点击提交后会进入create Action,其中的format.js一句提供了ajax支持,它会在浏览器端执行create.js.erb的内容:把新建用户信息异步动态插入页面上半部分。
1. 页面上半部分显示当前的所有用户,页面下半部分是输入新用户的界面;
2. 每当输入新用户时,页面上半部分会动态更新新加用户的内容;
我们还是用ajax实现,不过这次用rails内部对ajax的支持,其中在服务器端返回一个js脚本,然后在客户端执行。
新建user数据结构 rails g scaffold User name:string age:integer
接着应用数据库视图 rake db:migrate
修改index.html.erb的内容:
<h1>Listing Users</h1> <ul id="users"> <%= render @users%> </ul> <br /> <%= form_for(@user,remote:true) do |f|%> <%= f.label :name %><br \> <%= f.text_field :name %> <%= f.label :age %><br \> <%= f.text_field :age%> <%= f.submit %> <% end %>
同时新建一个局部模板_users.html.erb:
<li><%= user.name%></li> <li><%= user.age%></li>
接下来增加服务器端对js的支持,很简单:
def index @users = User.all @user = User.new #puts "******* #{render @user} **********" end # POST /users # POST /users.json def create @user = User.new(user_params) respond_to do |format| if @user.save format.html { redirect_to @user, notice: 'User was successfully created.' } format.js {} #增加这一句 format.json { render :show, status: :created, location: @user } else format.html { render :new } format.json { render json: @user.errors, status: :unprocessable_entity } end end end
别忘了还要写服务器端的js脚本哦。在view下的users目录中新建一个create.js.erb文件:
$("<%= escape_javascript(render @user)%>").appendTo("#users"); <!--$("#users").append("<p>love</p>");-->
基本完成鸟。整个流程大体如下:
首先用户访问users/index页面,当输入name和age点击提交后会进入create Action,其中的format.js一句提供了ajax支持,它会在浏览器端执行create.js.erb的内容:把新建用户信息异步动态插入页面上半部分。
相关文章推荐
- rails应用ajax之二:使用rails自身支持
- rails应用ajax之二:使用rails自身支持
- rails应用ajax之一:使用纯js方法
- rails应用ajax之一:使用纯js方法
- rails应用ajax之一:使用纯js方法
- 使用 SpiderMonkey 使 C++应用支持 JavaScript 脚本引擎
- rails插件ajax_scaffold的使用
- 通过 Rails 在 Web 应用程序中使用 Ajax
- asp.net(vb)中应用ajaxpro.dll的笔记,之二(.net 1.1)。
- 使用AJAX控件来实现Ajax操作(支持服务器事件)
- 支持AJAX应用的测试工具WebKing 6.0
- AJAX技术与asp.net 2.0的完美结合之Timer的web应用 及使用AJAX控件时的“Sys 未定义”错误解决办法
- AJAX开发的性能冲击:使用AJAX提高WEB应用的带宽使用率
- 支持AJAX应用的测试工具WebKing 6.0
- 在struts 2中使用json ajax支持
- 使用AJAX 异步提高Web应用交互能力(徐承禹)
- 在ASP.NET AJAX中使用应用程序服务和本地化(6):创建支持多语言的ASP.NET AJAX站点、小结
- 在Struts应用中使用AJAX
- Ajax应用中使用Json的补充说明
- 使用GWT 与 NetBeans 开发 AJAX 应用(序)