Question

我正在Ruby on Rails上运行javascript，以便在用户点击链接时动态地将表单插入到页面中。

它没有用，但是一个特殊的bug让我的山羊：我的表单在调试控制台中返回form.children UNDEFINED。

这是表单（在Rails中）：

<div class="field">
<%= f.label :name, 'Tag:' %>
<%= f.text_field :name %>   
</div>

这是app.js中的javascript;

function add_fields(link, association, form) {
console.log(form);
console.log(form.children);
link.insertBefore(form, link.previousSibling.previousSibling);
}

我已经测试了应用程序是否通过输出文本等实际调用了javascript并且它有效。我的表格显然存在问题。

最后，控制台输出：

<div class="field">
<label for="post_tags_attributes_4_name">Tag:</label>
<input id="post_tags_attributes_4_name" name="post[tags_attributes][4][name]" size="30" type="text" />  
</div> application.js:21
undefined application.js:22
Uncaught Error: NOT_FOUND_ERR: DOM Exception 8

顺便说一句，我正在尝试在动态插入的嵌套表单上实现railscast＃197，这是一场灾难！

- EDIT ---

以下是我如何调用构建字段元素的add_fields函数：

红宝石功能：

module TagsHelper
    def link_to_add_fields(name, post_form, association)
        new_object = post_form.object.class.reflect_on_association(association).klass.new
        tag_field = post_form.fields_for :tags, new_object do|tag_form|
            render("tag_field", :f=>tag_form)
        end
        #debugger
        link_to_function(name, "add_fields(this, \"#{association}\", \"#{escape_javascript(tag_field)}\")")
    end
end

这是tag_field html：

<div class="field">
    <%= f.label :name, 'Tag:' %>
    <%= f.text_field :name %>   
</div>

Answer 1

显然，这不会起作用，因为一个元素不能生孩子也是兄弟姐妹。

link.insertBefore(form, link.previousSibling.previousSibling);

您的代码希望将form作为link 和的孩子放在link的兄弟姐妹之前，是不可能的。

请记住，.insertBefore必须从父中调用它才会被插入。因此，要在form之前插入link，必须从.insertBefore的父级调用link。

所以也许你打算改用link.parentNode。

link.parentNode.insertBefore(form, link.previousSibling.previousSibling);

这将在form的第二个兄弟姐妹之前插入link。

为什么我的object.children未定义？

1 个答案: