Question

I have a page that has two modes: view and edit. When I click the edit button I’m using jQuery to load the form into the body of the page. What I would like to do is move the title and category fields to the heading of the page where they normally appear in “view” mode. The problem is that the form tag is still in the body. What would be a good way to expand the scope of the form tag to include the heading? I’ve successfully moved the title and category fields to the heading, but they are now outside the scope of the form.

Answer 1

I solved this using unwrap and wrap:

var form = $("#my_form");
form.children().unwrap();
$('#full_page').wrap(form);