Wydanie YUI 3 TabView - javascript, css, jsp, yui

Chciałbym utworzyć dwie karty na stronie Jsp za pomocą YUI 3 (Yahoo UI3).

Na przykład: Tab1 Tab2

Tab1: Jestem w stanie utworzyć Tab1 używając poniższego skryptu 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);
});
}

Teraz chcę dodać Tab2 z tekstem statycznymetykieta: „Tab2”, treść: „test”. Próbowałem z createCustomTabSafari („Tab2”, „test”), ale jest tworzona karta w innej lokalizacji zamiast tworzenia oprócz Tab1.

Jak użyć metody addChilld () / add (), aby dodać drugą kartę jako dziecko zamiast nowej karty.

Przeszedłem przez interfejs API YUI i mogłem zobaczyć metodę addChild (dziecko, indeks), ale nie wiem, jak użyć tej metody w tej scenieenter code hereRio.

Ponadto, jak czytać utworzone zakładki, jeśli wiem, że kliknięto tab1, wyświetlę coś i jeśli klikniesz Tab2, wyświetlę coś innego.

Byłoby pomocne, gdybym dowiedział się czegoś o dodaniu drugiej karty obok Tab1.

Z góry dziękuję.

Odpowiedzi:

Przykłady na stronie YUI naprawdę dobrze pokazują, jak korzystać z Tabview. Możesz zobaczyć ten przykład, który ma wiele kart: 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);
});

A do dodawania i usuwania zakładek, dość złożony przykład: http://yuilibrary.com/yui/docs/tabview/tabview-add-remove.html