jquery Tabs with ajaxOptions

Question

抓住我的頭。使用jQuery選項卡我試圖在加載之前使用ajaxOptions將數據發佈到頁面。

所以我有一個窗體在我的標籤之前有一些輸入字段的頁面。即，

<form id="myform" method="post"> 
<!-- inputs etc --> 
</form> 

然後我的標籤

<div id="tabs"> 
    <ul> 
    <li><a href="#tabs-1">Preloaded</a></li> 
    <li><a href="ajax/content1.html">Tab 1</a></li> 
    </ul> 

    <div id="tabs-1"> 
    <p>Initital content</p> 
    </div> 
</div> 

好了，所以現在我應該能夠連載自己的狀態，所以當點擊它應該是一個post請求，即一個標籤，

$("#tabs").tabs({ 
    ajaxOptions: { 
     type: 'post', 
     data: $("#myform").serialize(), 
     error: function(xhr, status, index, anchor) { 
      $(anchor.hash).html(
      "Couldn't load this tab. We'll try to fix this as soon as possible. " + 
      "If this wouldn't be a demo."); 
     } 
    } 
}); 

它確實執行發佈請求，但表單數據始終爲空。

任何想法爲什麼？

感謝

李

Answer 1

由於此運行時首先要創建標籤：

data: $("#myform").serialize(), 

的數據是不管它是什麼然後，它永遠不會更新。這裏最簡單的辦法就是來更新數據時，它的需要，通過使用該標籤的select event，就像這樣：

$("#tabs").tabs({ 
    select: function() { 
    $(this).tabs("option", { ajaxOptions: { data: $("#myform").serialize() } }); 
    }, 
    ajaxOptions: { 
    type: 'post', 
    error: function(xhr, status, index, anchor) { 
     $(anchor.hash).html(
     "Couldn't load this tab. We'll try to fix this as soon as possible. " + 
     "If this wouldn't be a demo."); 
    } 
    } 
}); 

You can test it out here，只是看螢火蟲等，查看窗體數據被更新，並與各派出標籤AJAX請求。