I have two requests-for-functionality for the TabContainer layout.
1) An automatic 'add new tab' tab, similar to the way tabbed browsing works in IE7. When clicked, it opens up a new tab and populates it with some developer-specified default content.
2) The ability to embed a toolbar in the empty space to the right of the tabs (like IE7).
sounds reasonable
Sounds like a reasonable idea for dojox, although you'll need to find someone to volunteer to write that code. :-)
Agreed. I'd write it
Agreed. I'd write it myself, but I'm still fuzzy on some of the finer points of Dojo. I may attempt it though.
Found a solution...sort of...
I found a programmatic solution for adding a "new tab" icon to the tab list...
First, I get the reference to the div tag that contains the tabs (tab container name + "_tablist")...
var buttonDiv = wu.createElement(tabDiv, "div"); // Create a div tag for the button.
dojo.addClass(buttonDiv, "newTabButton");
dojo.connect(buttonDiv, 'onclick',
function(evt) {
dijit.byId("newTabDialog").show();
}
);
background: transparent url(../icons/addTab.png) no-repeat scroll top;
width:14px; height:14px;
margin:6px;
position:absolute;
right:0px;
}
And then I have this dialog box defined...
<table>
<tr>
<td><label for="name">Name of new tab: </label></td>
<td><input dojoType="dijit.form.TextBox" type="text" trim="true" required="true" name="tabName" value="New tab"></td>
</tr>
<tr>
<td><label for="name">Description: </label></td>
<td><input dojoType="dijit.form.TextBox" type="text" trim="true" required="true" name="tabDescription" value="This is a new tab"></td>
</tr>
</table>
</div>
<script>
addTab = function(fields) {
var tc = dijit.byId("idOfTabContainer_");
var cp = new dijit.layout.ContentPane({ title: fields.tabName, closable: true});
cp.domNode.innerHTML = fields.tabDescription;
tc.addChild(cp);
}
</script>
However, it would still be nice if the tab container itself could make it easier to embed an actual toolbar in the tab div, and I don't see an easy way to do that.
What is "wu"?
I'm also trying to add a "New Tab" button to TabContainer for my own application.
Can you please tell me what the variable wu references, on which you're invoking createElement?