title: Jquery tabs: change ajax data on tab click
body: <p>I have used jquery tabs for loading data with ajax, but I need to add some parameters to the url when the user clicks in a tab. I don't know the parameters in advance because they come from a form which has been filled by the user. So I've tried something like the following code, but  I don't get it working:</p>
  
  <pre><code>&lt;div id="tabs"&gt;
      &lt;ul&gt;
          &lt;li&gt;&lt;a href="${tab1_url}"&gt;Tab 1&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="${tab2_url}"&gt;Tab 2&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="${tab3_url}"&gt;Tab 3&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and I serialize the form in an array and join the array to the array containing the satic data. </p>
  
  <pre><code>var staticData = [{name:'id',value:'${myId}'}];
  $("#tabs").tabs({
      var $tabs = $("#tabs").tabs({
          ajaxOptions: { data: staticData},
          select: function(event, ui) {
              var dynamicData = $("#common_form").serializeArray();
              var dataToSend = staticData.concat(dynamicData);
              $("#tabs").tabs("option", "ajaxOptions", { 'data': dataToSend });
               return true;
          }
      });
  });
  </code></pre>
  
  <p>but this doesn't update the ajax data after the tabs are created (I'm seeing the request sent with Firebug and it only includes the initial params).</p>
  
  <p>How can I change the ajax data when the user clicks the tab?</p>
  
  <p>Thanks</p>
  
  <p><strong>EDITED: now with this code works</strong></p>