Question

JS是否有可能从一个页面加载表单并在另一个页面中显示它？例如，点击＆＃39; / note / index＆＃39;上的按钮。页面，它会显示在＆＃39; / note / new＆＃39;中找到的表单。但我仍然在＆＃39; / note / index＆＃39;页。

我知道我可以通过将所有html放在索引页面中来实现这一点。

进一步的问题：建议按我要求做什么？

我目前用于/notes/index.html.erb的HTML

<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

使用AJAX可以实现，如果您使用jquery代码可能是：

$.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
});

我可以从其他页面加载表单吗？

1 个答案: