我正在以通常的方式使用nested_form_for,但我想为嵌套的子项添加动态选择菜单。
我有以下咖啡脚本(改编自'dynamic-select-menus' railscast)
jQuery ->
$( ".controls-row" ).each ->
$(this).bind "change", ->
type = $('#expense_type :selected').text()
if (type == "miles")
$('#amount_currency').hide()
$('#km_traveled').show()
else
$('#amount_currency').show()
$('#km_traveled').hide()
此代码的问题在于它只能与第一个嵌套元素一起使用。我尝试为每个元素添加唯一ID,但这仅适用于现有元素。新元素是'blueprint'元素的所有克隆,并且都具有相同的ID。
有没有人有更好的方法在嵌套表单中实现动态选择菜单?
答案 0 :(得分:0)
只需使用正则表达式即可更改'蓝图' id到独特的东西。
例如,如果您要加载部分内容,则可以使用Javascript的替换来更改默认ID。
答案 1 :(得分:0)
我用这段代码推了出来:
jQuery ->
$(document).on "nested:fieldAdded", (event) ->
$( ".controls-row" ).each ->
$(this).find('#expense_type').bind "change", ->
type = $(this).parent().find('#expense_type :selected').text()
if (type == "km")
$(this).parent().find('#payment_method').addClass('hidden').hide()
$(this).parent().find('#amount_in_currency').addClass('hidden').hide()
$(this).parent().find('#amount_currency').addClass('hidden').hide()
$(this).parent().find('#km_traveled').removeClass('hidden').show()
else
$(this).parent().find('#payment_method').removeClass('hidden').show()
$(this).parent().find('#amount_currency').removeClass('hidden').show()
$(this).parent().find('#amount_in_currency').removeClass('hidden').show()
$(this).parent().find('#km_traveled').addClass('hidden').hide()
$(this).find('#expense_type').trigger('change')
$(document).trigger("nested:fieldAdded")