0

我一直在努力将表单提交到动态选项卡中。它似乎所做的只是打破我的标签并最终显示更新页面。

长期领先。我在索引页面上创建了 2 个选项卡,我的搜索是内部的,第二个调用我的大型表单页面:

 <div id="tabs">
   <ul>
     <li><a href="create.cfm"><span>Create</span></a></li>
     <li><a href="#searchtab"><span>Search</span></a></li>
   </ul>
   <div id="searchtab">
     [search page stuff]
   </div>
 </div>

两个页面都很好,创建选项卡允许我填写新表格并提交。当它提交时,它会验证然后在创建选项卡中显示“谢谢”。

这是提交代码的片段:

 $(document).ready(function(){                     
   $("#saCreate").validate({
        [validation stuff]
    },
    submitHandler: function(form) {
        if (confirm("Are you sure you want to submit?")) {
    form.submit();
        }

这可以按需要工作。

搜索页面显示所有“打开”表单的列表,允许您选择一个,它将在新的动态选项卡中打开其详细信息。

例如:

 gridSelect = function(satrk) {
 var checkName = satrk;
 var tabExists = false;
   $('#tabs ul li a').each(function(i) {
   if($(this).text() == checkName) {
    tabExists = true;
}
});

// React to existance:
if(!tabExists){
$("#tabs").tabs("add","details.cfm?satrk="+satrk,satrk);
$("#tabs").tabs("select", satrk); // select tab by index
}else{
$("#tabs").tabs("select", satrk); // select tab by index
}

基本上,如果选项卡打开,只需选择它,但如果没有,则创建一个新选项卡,使用传递给 gridSelect 的“id”作为名称。这个 id 实际上就是 db id。

这也很好用。我现在正在查看一个带有旧表单详细信息的新动态选项卡。它只不过是创建时使用的旧表格,但表格框是从数据库中填写的。

如果我需要做出改变,我会做出改变,然后点击“更新”按钮。它执行与以前相同的验证,如果良好则提交。

这就是一切都变成废话的地方。此表单不会提交并在我漂亮的动态选项卡中显示感谢。此表单提交并在覆盖旧表单界面的新 URL 中显示感谢。例如,blah,blah,blah/update.cfm

我对 jQuery 很陌生,我已经做了很多测试和搜索,尝试和修补以达到我现在的位置,但我担心我已经达到了我的基本能力。

我希望我的更新页面通过我的更新确认来简单地刷新我的动态选项卡。

帮助!

4

1 回答 1

0

一个标准的 POST 请求确实会指示浏览器呈现一个新页面。您正在寻找的是 ajax 提交。您可以根据需要使用成功回调根据结果操作 DOM。

至于表单变量,您可以使用$('form').serialize()将所有表单字段转换为json对象进行提交。有关更多信息,请参阅http://api.jquery.com/serialize/

于 2012-11-12T18:57:51.563 回答