`
clark1231
  • 浏览: 256640 次
  • 性别: Icon_minigender_1
  • 来自: 苏州
社区版块
存档分类
最新评论

二级下拉选择框option_groups_from_collection_for_select

阅读更多

class Group < ActiveRecord::Base
  has_and_belongs_to_many :users
  # attribs: id, name
end

class User < ActiveRecord::Base
  has_and_belongs_to_many :groups
  # attribs: id, name
end

class Delivery < ActiveRecord::Base
  belongs_to :recipient, :class_name => "User", :foreign_key => :recipient_id
  # attribs: id, name, recipient_id
end
 

option_groups_from_collection_for_select(Group.all, :users, :name, :id, :name, @delivery.recipient_id)

 

效果:

金工组-------------------group_name

   用户1------------------user_name

铆焊组

   用户2

   用户3

 

api说明:

option_groups_from_collection_for_select(collection, group_method, group_label_method, option_key_method, option_value_method, selected_key = nil)

Returns a string of <option> tags, like options_from_collection_for_select, but groups them by <optgroup> tags based on the object relationships of the arguments.

Parameters:

  • collection - An array of objects representing the <optgroup> tags.

  • group_method - The name of a method which, when called on a member of collection, returns an array of child objects representing the <option>tags.

  • group_label_method+ - The name of a method which, when called on a member of collection, returns a string to be used as the label attribute for its <optgroup> tag.

  • option_key_method - The name of a method which, when called on a child object of a member of collection, returns a value to be used as thevalue attribute for its <option> tag.

  • option_value_method - The name of a method which, when called on a child object of a member of collection, returns a value to be used as the contents of its <option> tag.

  • selected_key - A value equal to the value attribute for one of the <option> tags, which will have the selected attribute set. Corresponds to the return value of one of the calls to option_key_method. If nil, no selection is made. Can also be a hash if disabled values are to be specified.

Example object structure for use with this method:

class Continent < ActiveRecord::Base
  has_many :countries
  # attribs: id, name
end
class Country < ActiveRecord::Base
  belongs_to :continent
  # attribs: id, name, continent_id
end

Sample usage:

option_groups_from_collection_for_select(@continents, :countries, :name, :id, :name, 3)

Possible output:

<optgroup label="Africa">
  <option value="1">Egypt</option>
  <option value="4">Rwanda</option>
  ...
</optgroup>
<optgroup label="Asia">
  <option value="3" selected="selected">China</option>
  <option value="12">India</option>
  <option value="5">Japan</option>
  ...
</optgroup>

Note: Only the <optgroup> and <option> tags are returned, so you still have to wrap the output in an appropriate <select> tag.


分享到:
评论

相关推荐

    自定义下拉选择框_winform_下拉选择框_

    在Windows Forms(WinForm)开发中,自定义下拉选择框是一种常见的需求,尤其是在构建用户界面时需要提供更丰富的交互体验。本主题将深入探讨如何使用C#来创建一个具有智能提示功能的自定义下拉选择框(ComboBox)。...

    下拉列表框操作_finished.rar

    在Uibot自动化任务中,下拉列表框(Dropdown)是一种常见的交互元素,它允许用户从预设的选项中选择一个或多个值。本实践题着重于如何有效地操作这种控件,以完成特定的任务。根据标题和描述,我们可以推测这是一个...

    最好的下拉选择框

    在网页设计和开发中,"下拉选择框"(Dropdown Select)是一种常见的用户界面元素,它允许用户在一组预设的选项中进行选择。这种组件在各种表单、搜索过滤和配置界面中广泛使用,因为它可以节省空间并提供清晰的交互...

    最简单js代码实现select二级联动下拉菜单

    本文实例为大家分享了js实现select二级联动下拉菜单,供大家参考,具体内容如下 &lt;&#37;@ page language="java" import="java.util.*" pageEncoding="UTF-8"%&gt; &lt;&#37; String path = request.getContextPath()...

    二级下拉列表联动 select 网页 html5

    二级下拉列表联动 select 网页 html5 学院、专业 选择的下拉列表 下载可用!!!

    jquery省市区三级联动下拉菜单_select三级联动下拉菜单

    jquery省市区三级联动下拉菜单_select三级联动下拉菜单 jquery省市区三级联动下拉菜单_select三级联动下拉菜单 jquery省市区三级联动下拉菜单_select三级联动下拉菜单 jquery省市区三级联动下拉菜单_select三级联动...

    HTML二级联动下拉列表框的实现,如选择 省,市.zip

    HTML二级联动下拉列表框是一种常见的网页交互设计,它允许用户在两个或多个下拉菜单之间建立关联,以便根据用户在第一个下拉框中的选择动态更新第二个下拉框的内容。这种设计常见于区域选择,例如选择省份后,城市...

    jquery实现select带模糊搜索下拉选择框

    本教程将详细讲解如何使用 `jQuery` 实现一个具有模糊搜索功能的下拉选择框,以提升用户在交互时的体验。 首先,我们需要了解 `select` 元素在HTML中的基本用法。`&lt;select&gt;` 标签用于创建一个下拉列表,用户可以...

    jquery搜索栏select下拉选择框

    7. ** Accessibility**:确保下拉选择框符合无障碍标准,比如为`&lt;select&gt;`和`&lt;option&gt;`添加合适的`aria-*`属性,以及确保键盘导航功能正常。 以上就是关于“jquery搜索栏select下拉选择框”的主要技术要点。通过...

    AngularJS实现三级级联下拉选择框

    在本文中,我们将深入探讨如何使用AngularJS实现三级级联下拉选择框。AngularJS,一个由Google维护的JavaScript框架,被广泛用于构建单页应用(SPA),它提供了丰富的功能来处理复杂的前端交互,包括数据绑定、依赖...

    select下拉列表显示图片内容

    在网页设计中,`&lt;select&gt;`元素通常用于创建下拉列表,它允许用户从一组预定义的选项中进行选择。然而,传统的`&lt;select&gt;`标签并不支持直接在选项中显示图片,只支持纯文本内容。但随着现代Web技术的发展,我们可以...

    下拉列表二级联动

    而“下拉列表二级联动”则是在此基础上的一种高级应用,它允许用户在选择第一个下拉列表的某个选项时,自动更新第二个下拉列表的选项,从而实现更加动态和智能的用户界面。这种技术广泛应用于各种场景,如地区选择...

    CSS自定义select下拉选择框的样式(不用其他标签模拟)

    在网页设计中,`&lt;select&gt;`元素用于创建下拉选择框,它提供了用户从一系列预设选项中进行选择的功能。然而,浏览器默认的`&lt;select&gt;`样式通常不符合设计师的美观需求,因此,如何自定义select下拉选择框的样式成为了一...

    select2好用的 下拉选择框

    select2好用的 下拉选择框 select2好用的 下拉选择框 select2好用的 下拉选择框 select2好用的 下拉选择框 select2好用的 下拉选择框 select2好用的 下拉选择框

    三级下拉列表 select 网页 html5

    在网页设计中,三级下拉列表是一个常见的交互元素,它用于提供多级分类的选择,比如在模拟地区选择时,我们可能会看到省-市-区这样的三层结构。在HTML5中,这种复杂的下拉列表通常结合`&lt;select&gt;`标签、JavaScript...

    组态王下拉式组合框.zip_areax8y_spokenimj_下拉式组合框_组态王_组态王tagname.db

    组态王下拉式组合框使用样例,包含了使用的说明,以及控件存放位置,可以直接运行

    bootstrap-select下拉选择搜索框,可以多选和单选

    总之,Bootstrap Select是一个强大的下拉选择组件,它结合了Bootstrap的风格和实用功能,适用于创建具有搜索、多选功能的下拉列表,对于提高用户在网页上的操作效率具有显著作用。通过以上介绍,你应该已经对如何...

    jQuery下拉选择框美化插件select-mania

    select-mania是一款jQuery下拉选择框美化插件。该插件可以将普通的select下拉选择框转换漂亮的下拉选择框,并且转换后的下拉选择框带搜索功能,可通过AJAX获取数据,带多种主题,还可以自定义主题等。

    jsp实现下拉选择框多种源码

    ### JSP 实现下拉选择框的多种源码解析 #### 概述 在Web开发中,下拉选择框(Dropdown List)是非常常见的一个UI组件,用于为用户提供多个选项进行选择。本文档将通过两个具体示例来详细介绍如何在JSP页面中实现...

Global site tag (gtag.js) - Google Analytics