使用Rails的jQuery标签：替换标签内容

Question

I have a tab with a page rendered inside it. Everything is good. Then the user clicks a button. I want the output of doing that to show up inside the tab. Currently it takes the user off the tabs view entirely.

Here's the tab html in the .html.erb file:

<div id="tabs">
  <ul>

    <li><a href="urls">Manage URLs</a></li>
    ...other tabs...
  </ul>

  <div id="urls-tab">
    <p>
    </p>
  </div>
  ...other tabs...
</div>

I have a new button on a form as such:

<%= form_tag('urls/someaction_not_new', :method => :post, :id = "top-form") do %>
  ...content...
  <input type="button" id="New" value="New" onclick="someJavascript()">

<% end %>

Finally, the javascript:

$("#tabs").tabs();

function someJavascript() {
  document.location = "urls/new"
}

I know that the javascript doesn't work, and I never expected it to. What I need to know is how to build that function such that it loads the 'urls/new' output to the tab rather than redirecting to a new view w/o the tabs.

Any help would be deeply appreciated!

Answer 1

use this :

function someJavascript() {
  $('#tabs').load('urls/new')
}

It will load your page 'urls/new' in #tabs

Answer 2

The reason why it is doing that, is because it is a html request, and it refreshes the page which causes your tabs to disappear.

Looks like you should trigger an AJAX request when your form is submitted. If you do that, you could render a javascript response in your view, and render the html appropriately inside the tab.