JQuery-ui/AJAX/POST question

JQuery-ui/AJAX/POST question

I'm sure someone has answered this before, but I have been searching for several hours and haven't come up with the right search terms.

I have a page that is using the JQuery-UI tabs.  The issue is there are 10 tabs and several of them have complex dynamic content and forms, so I don't want to be loading all the content of all the tabs every time a user submits a form.  So I switched to using the AJAX Mode method described http://ui-dev.jquery.com/demos/tabs/#Ajax_mode 

I have two issues that crept up when I switched to this.

1) On one tab, there is a dashboard with items listed, each item has a button that is a small POST form so when clicked should take you to another tab and have that item already selected and its details pulled up.  Since implementing the ajax mode, clicking on the buttons doesn't do anything.

2) On other tabs, there are POST forms that since switching, when you click Submit, it is switching back to the first tab instead of staying on tab that had the original form.


index.php
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
      <head>
        <title>Device Dashboard</title>
        <link rel="stylesheet" type="text/css" href="./jquery-ui-1.10.2.custom/css/start/jquery-ui-1.10.2.custom.min.css" />
        <script type="text/javascript" src="./jquery-ui-1.10.2.custom/js/jquery-1.9.1.js"></script>
        <script type="text/javascript" src="./jquery-ui-1.10.2.custom/js/jquery-ui-1.10.2.custom.min.js"></script>
      </head>
      <body>

    <div id="tabs">
    <ul class="tabs">
        <li><a href="./templates/dashboard.tpl.php"><span>Dashboard</span></a></li>
        <li><a href="./templates/mtConfig.tpl.php"><span>Device Config</span></a></li>
        <li><a href="./templates/groupConfig.tpl.php"><span>Group Config</span></a></li>
        <li><a href="./templates/modelConfig.tpl.php"><span>Model Config</span></a></li>
        <li><a href="./templates/crlConfig.tpl.php"><span>CRL Config</span></a></li>
        <li><a href="./templates/compConfig.tpl.php"><span>Component Config</span></a></li>
        <li><a href="./templates/audit.tpl.php"><span>Device Audit</span></a></li>
    </ul>
    </div>
    <script>
    $("#tabs").tabs()
    </script>
    </body>
    </html>