[英]How can I do AJAX-y conditional show/hide form fields in Rails?
I'd like to show or hide a few fields in a form in Rails, depending on the state of a select field in the form. 我想在Rails中显示或隐藏表单中的一些字段,具体取决于表单中选择字段的状态。 I don't (currently) need a second database lookup for the fields, so I'm trying to keep it all confined to the view. 我(目前)不需要对字段进行第二次数据库查找,因此我试图将其全部限制在视图中。 I have the outline sketched out, but I'm having some trouble with the implementation details. 我已勾画出轮廓,但我在实现细节方面遇到了一些麻烦。
My initial thought was to use observe_field
and call Element.show etc. etc., but then I'd have to write a Javascript conditional. 我最初的想法是使用observe_field
并调用Element.show等,但后来我必须写一个Javascript条件。 This will probably have to work, but I want to avoid it if I can. 这可能需要工作,但如果可以,我想避免它。
Another approach would be to use observe_field
to request a RJS template, and replace_html
to insert the fields. 另一种方法是使用observe_field
来请求RJS模板,并使用replace_html
来插入字段。 Not bad, but since I'm using a form_for
block I'd either have to pass the form instance all the way through the RJS template to do it right. 不错,但由于我使用的是form_for
块,我要么必须通过RJS模板一直传递表单实例才能正确执行。
I could also update the record on each pass, and display the form under the new conditions, but that's what I'm trying to avoid. 我还可以更新每个传递的记录,并在新条件下显示表单,但这就是我想要避免的。 It'd be so much simpler to just do this all in the view. 在视图中完成所有这一切要简单得多。
What am I missing here? 我在这里错过了什么? What's the accepted practice for conditional show/hide forms in Rails? Rails中有条件的显示/隐藏表单的公认惯例是什么?
As a rails developer, I suggest adhering to the principles of unobtrusive javascript. 作为rails开发者,我建议坚持不引人注目的javascript原则。 When it comes to rails, what this usually means is that you shouldn't just write one big view to handle all your functionality. 当涉及到rails时,这通常意味着你不应该只写一个大视图来处理你的所有功能。 This makes your HTML view easier to develop and maintain, it makes your behavior easier to maintain, and it usually leads to a better understanding of exactly what your application is doing. 这使您的HTML视图更易于开发和维护,它使您的行为更易于维护,并且通常可以更好地了解您的应用程序正在执行的操作。 To that extent, I avoid rails javascript helpers at all costs. 在这种程度上,我不惜一切代价避免使用rails javascript助手。
What I would do is split off your behaviour into a javascript file that you code yourself. 我要做的就是将你的行为分成你自己编写的javascript文件。 Using a library such as jquery (my favorite for this sort of thing is lowpro, but I'll be the first to admit to being a bit set in my ways), it's pretty easy to attach an event handler to specific elements (or to a whole class of elements at once). 使用像jquery这样的库(我最喜欢这种东西是lowpro,但我会是第一个承认我的方式有点设置),将事件处理程序附加到特定元素(或者是一次完整的元素)。
For a select box, an onChange handler will get fired when the user changes the selection. 对于选择框,当用户更改选择时,将触发onChange处理程序。 the selectedIndex
property on the element will tell you which option is selected, and the options
array will let you look up the associated option. 元素上的selectedIndex
属性将告诉您选择了哪个选项, options
数组将允许您查找关联选项。 So, in your handler you could do something like the following (using prototype): 因此,在您的处理程序中,您可以执行以下操作(使用原型):
function(e) {
var element = Event.element(e)
var index = element.selectedIndex
var option = element.options[index]
if(option.value == "Show fields")
$('hidden-fields').show()
else
$('hidden-fields').hide()
}
I handle the same thing a few different ways: 我用几种不同的方式处理同样的事情:
<%= link_to_function( check_box_tag "model[attribute_name]" ) do |page|
page.toggle :model_attribute_name
end-%>
<span style="display:none;" id="model_attribute_name">
<%= f.text_area :other_conditional_attribute -%>
</span>
or 要么
<%= link_to_function "Conditional Item", :class => "your-style-class" do |page|
page.insert_html :bottom, :other_conditional_attribute, :partial => 'conditional_attribute_partial', :object => Object.new, :locals => {:local_variable => local_variable}
end-%>
The rjs stuff/prototype helpers are awesome. rjs的东西/原型助手很棒。
Rails API: PrototypeHelpers Rails API:PrototypeHelpers
Rails API: JavascriptHelpers Rails API:JavascriptHelpers
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.