YUI 3 Издание TabView - javascript, css, jsp, yui

Бих искал да създам два раздела в JSP страница, използвайки YUI 3 (Yahoo UI3).

Например: Tab1 Tab2

tAB1: Аз съм в състояние да създаде Tab1 използвайки по-долу Java скрипт.

createCustomTabSafari = function(lblTxt,eId){

YUI().use("tabview", function(Y) {
var tabview = new Y.TabView({
children: [{
label: lblTxt,
content: document.getElementById(eId)
}]
});
tabview.render("#demo");
tabview.selectChild(0);
});
}

Сега искам да добавя Tab2 с някои статични текст катоетикет: "Tab2", съдържание: "тест". Аз се опитах с createCustomTabSafari ("Tab2", "тест"), но тя е създадена раздела на друго място, вместо да се създава освен Tab1.

Как да използвате метода addChilld () / add (), за да добавите втория раздел като дете вместо на нов раздел.

Прегледах YUI API и видях метода addChild (дете, индекс), но не съм сигурен как да използвам този метод в тази сценаenter code hereРио.

Също така, как да прочетете разделите, които са създадени, ако знам, че е натиснат tab1, ще покажа нещо и ако се натисне Tab2, ще покажа нещо различно.

Би било полезно, ако науча нещо за добавянето на втори раздел до Tab1.

Благодаря предварително.

Отговори:

Примерите на уебсайта на YUI правят много добра работа за показване как да използвате Tabview. Можете да видите този пример с няколко раздела: http://yuilibrary.com/yui/docs/tabview/tabview-fromjs.html

YUI().use("tabview", function(Y) {
var tabview = new Y.TabView({
children: [{
label: "foo",
content: "<p>foo content</p>"
}, {
label: "bar",
content: "<p>bar content</p>"
}, {
label: "baz",
content: "<p>baz content</p>"
}]
});

tabview.render("#demo");
tabview.selectChild(2);
});

И за добавяне и премахване на раздели, доста сложен пример: http://yuilibrary.com/yui/docs/tabview/tabview-add-remove.html