別のページからフォームを読み込むことはできますか？

Question

JSがあるページからフォームを読み込んで別のページに表示する方法はありますか？たとえば、 '/ note/index'ページのボタンをクリックすると、 '/ note/new'にあるフォームが表示されますが、まだ '/ note/index'ページにあります。

インデックスページにすべてのhtmlを入れることでこれを行うことができます。

その他の質問：私が聞いたことをすることが推奨されていますか？あなたはjqueryのを使用している場合

/notes/index.html.erb

<script> 
    $(function() { 

    // contact form animations 
    $('#newNote').click(function() { 
    $('#newNoteForm').fadeToggle(); 
    }) 
    $(document).mouseup(function (e) { 
    var container = $("#newNoteForm"); 
    if (!container.is(e.target) // if the target of the click isn't the container... 
     && container.has(e.target).length === 0) // ... nor a descendant of the container 
    { 
     container.fadeOut(); 
    } 
    }); 

}); 
</script> 

<!--New Note--> 
<div class="row first-content-row"> 
    <div class="col-xs-3"> 
     <p><%= notice %></p> 
     <div class ="col-sm-offset-1 btn btn-lg btn-success"> 
     <div id = "newNote">New Note</div> 
     </div> 
    </div><!--End col--> 
</div><!--End row --> 

<!-- This is the note that will be appearing --> 
<div id="newNoteForm"> 
    <h1>Add a new Note</h1> 
    <%= form_for @session_note, url: {action: "create"}, html: {class: "nifty_form"} do |f| %> 
     <%= f.text_area :note, size: "60x12" %> 
     <%= number_field(:session_note, :session_id) %> 
     <%= f.submit "Save" %> 
    <% end %> 
</div> 

Answer 1

のための私の現在のHTMLそれはAJAXで可能ですが、コードは次のようになります。

$.get('/newpageurl/', function(data) { 
    var otherPage = $(data); //Get the other page dom as data 
    var otherPageForm = $(otherPage).find('form#myform'); // find the form 
    $('body').append('otherPageForm');// place the form in the current page 
});