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请求。