全面支持 Twitter Bootstrap 3 的 Rails 4 表单构建器 [英] Rails 4 form builder with comprehensive support for Twitter Bootstrap 3

问题描述

是否有任何与 Rails 4 兼容的表单构建器 gem(s) 为 Twitter Bootstrap 3.0.0 表单提供全面支持?

Is there any Rails 4 compatible form builder gem(s) that provide comprehensive support for Twitter Bootstrap 3.0.0 forms?

以下是我认为全面"支持的基准:

Here's a benchmark for what I'd consider 'comprehensive' support:

• 支持所有 3 种布局(基本、水平、内联)
• 支持基本输入类型(输入、文本区域、选择等)
• 同时支持堆叠和内嵌复选框/单选按钮
• 支持所有输入状态(焦点、禁用、验证)
• 支持帮助文本/错误消息
• 支持输入附加/前置(现在在 TWBS3 中称为输入组).
• 支持处理 Rails 的特定表单元素"，例如date_select(内联选择框)

请参阅 TWBS3 文档 和 WIP github 问题 有关 TWBS3 表单的详细信息.

See the TWBS3 docs and WIP github issue for details on TWBS3 forms.

我已经查看了 simple_form 和 twitter_bootstrap_form_for 虽然两者都在取得进展，但目前似乎都没有提供足够的解决方案.

I've had a look at both simple_form and twitter_bootstrap_form_for and whilst both are making progress neither appear to offer a sufficient solution at the moment.

简单形式

似乎有基本布局的解决方案，但是由于 TWBS3 需要额外的网格标记，从我所看到的水平形式目前是不可能的.

Appears to have a solution for the basic layout, however from what I can see horizontal forms are not currently possible due to the additional grid markup required by TWBS3.

https://github.com/plataformatec/simple_form/pull/864https://github.com/plataformatec/simple_form/issues/857

Twitter 引导表单

这个拉取请求看起来很有希望，但我可以看到所使用的标记和类中存在一些不准确之处.

This pull request looks promising, but I can see some inaccuracies in the markup and classes being used.

https://github.com/stouset/twitter_bootstrap_form_for/pull/84

推荐答案

根据我自己使用 Bootstrap 和 simple_form/form_builder 方法的经验，simple_form 不值得麻烦.有太多的事情简单的表单无法解决布局和控制明智的问题，一些关键的黑点是包装标签上的类，带有 html 属性的选择，或者做一些简单的事情，比如模仿切换/单选按钮的引导按钮组.simple_form 中的 i18n 支持也是一个挑战，需要大量重复.

In my own experience with Bootstrap and simple_form / form_builder approach is that simple_form is not worth the trouble. There are just too many things that simple form has no answer for layout and control wise, some key black spots being classes on wrapper tags, selects with html attributes, or doing something simple like bootstrap button groups that mimic toggle/radio buttons. The i18n support in simple_form has also been a challenge, requiring a lot of duplication.

还要考虑服务器端渲染是否是现代应用程序的正确方法.我正在从传统的 Rails/服务器端渲染过渡到 SPA(单页应用程序)模型.为此，我使用了backbone.js 和带有生态模板和coffeescript 的marionette.

Also consider if server side rendering is the right approach for a modern application. I am transitioning from traditional rails/server-side rendering to a SPA (Single Page Application) model. To do this I'm using backbone.js and marionette with eco templates and coffeescript.

从架构上讲，simple_form/rails 表单构建器方法似乎有点缺陷，其中包含大量复杂的代码，用于构建 html 字符串片段.

Architecturally the simple_form / rails form builder approach seems kind of flawed and within it has a lot of convoluted code for essentially building a html string fragment.

好吧，我说这就是视图模板的用途！

Well I say that is what view templates are for!

归根结底，一个视图是由许多不同的子视图模板(例如部分)组成的，我认为它应该直接归结为控制/字段组件.相比之下，构建器方法总是因缺乏对不同 jquery 组件的支持而陷入困境，并且不够敏捷，无法跟上步伐.

At the end of the day a view is composed from many different sub-view templates (eg partials), and I think it should go right down to control/field components. In contrast, the builder approach is always caught out with lack of support for different jquery components and is not really agile enough to keep pace.

我建议使用参数化视图模板/部分来编写应用程序中每种类型的控件/组件或视图构造所需的标记，然后简单地组合它们以获得所需的布局.如果你在做这个服务器端，你可以用一些帮助器来包装所有的渲染部分调用以获得语法上的甜蜜.如果您使用生态模板进行客户端操作，请查看主页，您将看到定义和调用表单的示例在那里构建模板.

I'd suggest using parameterised view templates/partials that codify the markup you want for each type of control/component or view construct in your app and simply compose them to get the layout you want. If you're doing this server side, you could wrap up all the render partial calls with some helpers for syntactical sweetness. If you're doing it client side with say eco templates, check the main page, you will see an example of defining and calling form building templates there.

不要局限于表单构建器的功能，使用 boostrap 文档示例作为模板的起点，只需调用它们即可！

Don't lock yourself into the capabilities of a form builder, use the boostrap documentation examples as the starting point for your templates and simply call them!

这篇关于全面支持 Twitter Bootstrap 3 的 Rails 4 表单构建器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！