0

Ruby on Railsでjavascriptを実行して、ユーザーがリンクをクリックしたときにフォームをページに動的に挿入しています。

それは機能していませんが、1つの特定のバグが私のヤギを取得します:それは私のフォームがデバッグコンソールでform.childrenUNDEFINEDを返すことです。

これが(Railsの)フォームです:

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

そして、これがapplication.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を実装しようとしていますが、これは大惨事です。

- 編集 - -

これが、field要素を構築する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_fieldhtmlがあります:

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

1 に答える 1

2

要素は兄弟でもある子を持つことができないため、明らかにこれは機能しません。

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

あなたのコードは、 の兄弟の 1 人の前に子として配置する必要formがありますが、これは不可能です。link link

挿入先の.insertBeforeから呼び出す必要があることに注意してください。したがって、の前に挿入するには、 の親から を呼び出す必要があります。formlink.insertBeforelink


したがって、代わりに使用するつもりだったのかもしれませんlink.parentNode

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

formこれは、 の 2 つ前の兄弟の前に挿入されlinkます。

于 2012-12-09T23:52:00.257 に答える