1

是否有人对如何在 Rails 中创建可以使用引导程序“折叠”或 Jqueries“手风琴”功能的表单有任何想法/资源?

基本上,我有一个包含许多嵌套属性的巨大表单,我想折叠它们,以便用户只需打开他或她想要编辑的部分。我必须相信肯定有这样的东西,但我所看到的只是人们试图将 bootstrap 或 jquery 与 formtastic 或 form_for 集成的未回答的问题。

基本上,我正在寻找可以与 Rails 集成的东西,看起来类似于:http ://www.alpacajs.org/examples/forms/customer-profile/edit-form.html

更新:

抱歉,我刚刚意识到我的原始帖子可能有点含糊。我正在尝试使用 Formtastic(或 rails form_for)DSL,并将其与折叠功能集成。我真的没有在网络上看到人们成功地将这些放在一起的任何地方。

4

2 回答 2

1

如果您想保持简单并更好地控制您在应用程序中包含的内容,您可以使用几行 javascript 轻松实现所需的效果。

我在这里举了一个例子:http: //jsfiddle.net/iKindred/pYgLY/2/

这是JS:

jQuery(document).ready(function($){
    $('.collapsable-section').each(function(i){
        var $label = $(this).find('.label').filter(':first');
        var $fields = $(this).find('.fields').filter(':first');
        $label.click(function(e){
            $fields.slideToggle(200);
        });
    });
});

随意根据您的需要定制它,或者如果您需要帮助,请告诉我:)

于 2013-03-31T07:03:46.740 回答
0

我使用引导 sass gem。在 Gemfile

group :assets do
  # ...
  gem 'bootstrap-sass'
  # ...
end

您必须添加到application.js.coffee以下行

#= require bootstrap-collapse

在包含表单的视图中(例如_form.html.erb,您只需封装要折叠的表单标签,如下所示:

<div class="collapse">
  <%= label_tag(:q, "Search for:") %>
  <%= text_field_tag(:q) %>
</div>
于 2013-03-30T17:30:43.353 回答