tab form但共用一個submit button

0 0

tab form但共用一個submit button5

請教各位,如何用dojo去建立數個tab,但共用同一個submit button的表格呢?

问题补充：嗯,不是這個意思,beneo的意思是在每個tab內相同的位置,分別放置一個submit button,讓人看來像只有一個submit button,對嗎?

但我希望是在三個tab form之下放置一個submit button,
例如
tab 1是[店舖資料],tab 2[此店舖營業時間], tab 3是[店舖假期]
填好後user按一個submit button即可,而不需要逐頁提交

JavaScript Dojo

2010年12月31日 15:52

vtsuper
0
0 0 0

2个答案按时间排序按投票排序

0 0

采纳的答案

我，页面小白的做法是

数个tab的样式是一样的（这样看上去submit button只有一个），数个submit button调用一个私有的方法来处理。。。

2010年12月31日 15:54

beneo
1705
0 0 0

添加评论

0 0

其实在一个div里面做tab，在另外的div里面做button就好了

然后tab里面的内容用变量缓存，最后传输到button就ok

我花了2个小是给你拼凑出来一个dojo，因为我是页面白，我相信你一定能搞定其它部分

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<!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>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
    <style type="text/css">
        @import "http://ajax.googleapis.com/ajax/libs/dojo/1.5/dojo/resources/dojo.css";
        @import "http://ajax.googleapis.com/ajax/libs/dojo/1.5/dijit/themes/tundra/tundra.css";
    </style>
    <title>Sample</title>
    <script type="text/javascript"
            djConfig="isDebug: true, parseOnLoad: true"
            src="https://ajax.googleapis.com/ajax/libs/dojo/1.5/dojo/dojo.xd.js"></script>
    <script type="text/javascript">
        dojo.require("dojo.parser");
        dojo.require("dijit.layout.ContentPane");
        dojo.require("dijit.layout.TabContainer");
        dojo.require("dijit.form.Button");
        dojo.require("dijit.InlineEditBox");
        dojo.require("dijit.form.TextBox");


        var tabs = dojo.byId("mainTabContainer");

        var content;

        dojo.subscribe("mainTabContainer-selectChild", function(child) {
            if(child != undefined && child != null)
            conent = child.get("content");
        });

        Commands = {
            sayHello: function() {
                var status = "Button Clicked at time: " + (new Date());
                dojo.byId("output").innerHTML = status + " -- " + content;
                console.debug(status);
            }
        }

        dojo.addOnLoad(function() {
            dojo.connect(dojo.byId("testButton"), "onclick", Commands, "sayHello");
            new dijit.InlineEditBox({onChange:myHandler, autoSave:false},
                    dojo.byId("id"));
        });
    </script>


    <script type="text/javascript">
        function foo() {
            console.debug("click foo");
        }
        function myHandler(idOfBox, value) {
            console.debug("Edited value from " + idOfBox + " is now " + value);
        }

    </script>


</head>
<body class="tundra">
<h1>Sample Dojo 1.0.0 xdomain page</h1>

<div id="mainTabContainer" dojoType="dijit.layout.TabContainer"
     style="width:500px;height:100px">
    <div id="tab1" dojoType="dijit.layout.ContentPane"
         title="First Tab" selected="true" closable="false">
        第一个 Tab
    </div>
    <div id="tab2" dojoType="dijit.layout.ContentPane"
         title="Second Tab" selected="false" closable="true">
        第二个 Tab
    </div>
    <div id="tab3" dojoType="dijit.layout.ContentPane"
         title="Third Tab" closable="true">
        第三个 Tab
    </div>
</div>


<p>
    <button id="testButton">Click Me</button>
</p>
<p id="output">
</p>

<h3 id="editable" autosave="false"
    dojoType="dijit.InlineEditBox" title="h3 example"
    onChange="myHandler(this.id,arguments[0])">
    Edit me - I trigger the onChange callback
</h3>
<span id="id">programatic InlineEditBox</span>


</body>
</html>

2011年1月01日 10:01

beneo
1705
0 0 0

添加评论

已解决问题

未解决问题

排行榜

查看全部排名>>