Rails:利用ajax轻松实现二级级联
以下使用JQuery,ajax,实现rails的二级级联选择框
我根据访问的流程来实现这个功能
基本原理:两个并列的选择框,当第一个选择框中的选项被选中时,触发js方法,并把省份的id传给该方法,然后,在js与controller交互,也就是将省份的id传给controller,经过处理,将返回该省份下的所有城市到该js方法,将城市列表赋值到第二个选择框中。
一、视图部分
<div>省、市:</div>
<%= select_tag "province", options_for_select(["----请选择----"] + Register::Province.all.collect{|e| [e.name,e.id]}), :onchange => "get_options(this.value)" %>
<%= select_tag "city", "<option value=\"0\">--请选择上级--</option>"%>
上面给出了两个选择框
第一个框中从数据库中读出省份,第二个选择框初始值为一个选项 --请选择上级--
当第一个选择框中的选项被选中时,触发get_options方法,并将选项的值,也就是省份的id传给此方法
二、js部分
<script type="text/javascript">
function get_options(value){
$.ajax({
type: "POST",
url:'/friend/friend_state/get_options?id='+value,
data:'text',
success: function(data){
$("#city").html(data);
}
}
)
}
</script>
其中, url为与该方法交互的controller中的方法路径,并将省份id保存到标量id中,传到controller
返回值类型为文本,并将值赋给第二个选择框
三、controller部分
#省市,二级级联
def get_options
options = ""
city = Register::Province.find_by_id(params[:id]).city
city.each do |s|
options << "<option value=#{s.id}>#{s.name}</option>"
end
render :text => options
end
返回值即是第二个选择框的option值
分享到:
相关推荐
ruby on rails轻松使用
Ruby on Rails轻松使用,掌握最新最热门的技术
Knock - 为Rails API实现无缝JWT身份验证
基于ruby on rails框架实现的音乐推荐网站项目源码.zip基于ruby on rails框架实现的音乐推荐网站项目源码.zip基于ruby on rails框架实现的音乐推荐网站项目源码.zip基于ruby on rails框架实现的音乐推荐网站项目源码...
字体配制文件 博文链接:https://babo.iteye.com/blog/72298
Ubuntu系统ruby on rails安装 Ubuntu系统ruby on rails安装 Ubuntu系统ruby on rails安装 Ubuntu系统ruby on rails安装 Ubuntu系统ruby on rails安装 Ubuntu系统ruby on rails安装 Ubuntu系统ruby on rails安装 ...
rakismet, 轻松实现 Rails 和TypePad反垃圾邮件集成 Rakismet是一个协作的垃圾邮件过滤服务。 Rakismet 易于与 Rails 和 rack 应用集成。 支持typepad服务和通用Akismet端点的反垃圾邮件。兼容性Rakismet> = 1.0.0 ...
Simple Form - 轻松处理Rails表单
充当租户 Ruby on Rails应用程序的行级多租户。 该宝石是出于我们对故障安全和偏僻方式的需求而诞生的,该方式通过共享数据库策略(与Rails无缝集成(近))为我们的Rails应用添加多租户。 actions_as_tenant为租户...
backbone-rails, 在 Rails 3.1中轻松使用 backbone.js 主干 rails 轻松设置并使用 Rails 3.1和更高版本的backbone.js ( 1.2.2 )##Version#####Github 主 branch###gem 版本:1.2.2Backbone 版本:1.
rails 2.3.2离线安装rails 2.3.2离线安装rails 2.3.2离线安装rails 2.3.2离线安装rails 2.3.2离线安装rails 2.3.2离线安装rails 2.3.2离线安装rails 2.3.2离线安装rails 2.3.2离线安装rails 2.3.2离线安装rails ...
入门rails的第一个demo
用rails实现的简单的简历系统,其中包括图片上传、验证码生成、数据查询、分页、日历、sort、邮件发送
[Pragmatic Bookshelf] Crafting Rails Applications Expert Practices for Everyday Rails Development (E-Book) ☆ 图书概要:☆ Rails 3 is a huge step forward. You can now easily extend the framework, ...
《Rails之道》按照Rails的各个子系统进行组织编排,分别介绍了Rails的环境、初始过程、配置和日志记录,Rails的分配器、控制器、页面生成和路由,REST、资源和Rails,ActiveRecord的基础、关联、验证和高级技巧,...
adminlte-rails, AdminLTE Rails gem 将AdminLTE主题与 Rails 资产管道集成 AdminLTE Rails gem AdminLTE 是后端的高级 Bootstrap 主题。英镑 AdminLTE Rails gem 与 Rails 资产管道集成了英镑AdminLTE主题。安装将...