Tab wird nicht selected

[mikethet]

Hallo,

Habe einen jQuery Tab implementiert.
Hierbei soll beim Anklicken eines bestimmten Tabs, der Fokus auf das erste input-Element fallen.

Hier der Code:

  
$(init);  
		var tab;  
		function init() {  
		tab = $("#tabmenue");  
		tab.tabs({selected : 1});  
		$("#accordion").accordion({collapsible : true});  
		$("body").delegate("input", "focus blur", focusme);  
		tab.bind("tabsselect", firstfocus);  
		}  
.  
.  
.  
.  
function firstfocus(){  
			$("#text").html(tab.tabs("option", "selected"));  
			if(tab.tabs("option", "selected") == 1){  
				alert("Works");  
			}  

Doch soweit mit dem Fokus komme ich nicht mal.
Im #text gebe ich den Index des Selected-Tabs aus. Dadurch bemerke ich, dass er den Index des Tabs immer erst dann setzte, wenn ich auf das nächste Tab klicke. Also zB.: Anmelden = Tab-Index 1, Benutzerkonto Tab-Index 2.
Starte ich die Seite setzt er mal gar keinen Tab-Index, d.h. #text bleibt leer. Auch wenn ich auf Anmelden klicke # text bleibt leer. Klicke ich allerdings von Anmelden auf Benutzerkonto, setzt er den Tab-Index auf 1. Und gibt auch die Message "Works" aus.

Weiß jemand wie ich den Tab-index des Tabs setze wenn ich auf ihn klicke, und nicht erst, wenn ein neuer Tab aktiviert ist?

LG und danke im voraus MIKE

[1UnitedPower]

tab.tabs({selected : 1});

Woher hast du "selected"?
active sollte deine Probleme lösen.

[mikethet]

Woher hast du "selected"?

Hallo United,

ist von docs.jquery.com, eine option des Tab-Plugins.

Select

Damit sage ich dem Browser, er soll beim erstmaligen Laden der Homepage, das erste (beginnend bei 0) Tab auswählen. Das macht er auch einwandfrei.

Grundsätzlich habe ich sowieso Probleme zu unterscheiden, was jetzt genau ein Tab und was ein Panel ist.

Hab mir das so vorgestellt, das Tab ist der Reiter das Panel der Content vom Reiter sozusagen. Lieg ich da richtig?

LG Mike

[mikethet]

Damit sage ich dem Browser, er soll beim erstmaligen Laden der Homepage, das erste (beginnend bei 0) Tab auswählen. Das macht er auch einwandfrei.

Mein Fehler, das Erste ist falsch. Das tab mit dem Index Nummer 1 ist richtig. :)

LG

[1UnitedPower]

ist von docs.jquery.com, eine option des Tab-Plugins.

Select

Interessant, die API scheint sich beim jQuery-UI-Versionswechsel 1.8 auf 1.9 geändert zu haben. Hast du Gründe dafür eine alte Version zu benutzen? Sonst probier doch mal aus, ob das Problem in der neuen Version mit "active" weiterbesteht.

Generell würde ich für jQuery-UI die Dokumentation der eigenen Projektseite bevorzugen.

Hab mir das so vorgestellt, das Tab ist der Reiter das Panel der Content vom Reiter sozusagen. Lieg ich da richtig?

Hm, die Dokumentation scheint hier selbst inkonsistent zu sein. Grundsätzlich halte ich dein Verständnis für das logisch richtige.

[mikethet]

> Generell würde ich für jQuery-UI die Dokumentation der eigenen Projektseite bevorzugen.

Hallo, bin gerade dabei das zu "studieren".

Kannst du mir vielleicht erklären, für was der Übergabeparameter "ui" zuständig sein soll. Den event-Übergabeparameter, gedenke ich zu verstehen. Hier erzuegt er ein Event-Objekt mit dem Namen Event welches Eigenschaften hat mit denen ich weiterarbeiten kann.(Korrigier mich bitte wenn ich falsch liege).

Aber was macht der ui-Übergabeparameter. Erzeugt dieser ein Ui-Objekt welches verschiedene Methoden hat wie zB in dem Beispiel: ui.newTab bzw. ui.oldTab. Und wie kann ich dieses Objekt überhaupt nutzen, versteh das leider nicht so. Vll kannst du mir helfen.

LG Mike

[1UnitedPower]

Entweder habe ich deine Frage oder du jQuery-UI mißverstanden.
jQuery-UI ist eine Erweiterung von jQuery. UI steht für User-Interface. Diese Erweiterung stellt beliebte Widgets, wie zum Beispiel das Tab-Widget zur Verfügung. jQuery allein eignet sich nur zum traversieren und manipulieren über den DOM-Baum, außerdem bietet es einige Extras, wie eine Ajax-API. Aber komplexe Interface-Komponenten sind standardmäßig nicht enthalten, deswegen gibt es jQuery-UI. Die Projekte sind eng verwandt, weswegen du auch auf der normalen jQuery-Seite eine Dokumentation zu der UI-Erweiterung findest, die eigene Dokumentation ist aber meiner Meinung nach aktueller und besser verständlich.

[mikethet]

active sollte deine Probleme lösen.

Hallo United,

habe ein Update für dich falls es dich interessiert.

Innteressanterweise funktioniert es mit active, hier der Code:

  
<script type = "text/javascript">  
        	  
        	$(init);  
        	var tab;  
        	function init() {  
        		tab = $("#tabs");  
        		tab.tabs({active : 1});  
        		tab.tabs("option", "active", 2);  
        		tab.on("tabsactivate", checkme);  
        	}  
        	  
        	function checkme(event) {  
        		if(tab.tabs("option", "active") == 1)  
        		alert("Works");  
        	}  
        	  

was mich allerdings verwundert ist

tab.tabs({active : 1});

Also die Initialisierung der des Active-Events auf das Tab.
Dabei ist es ihm völlig egal ob die Zahl 1, 5, 27 oder 100 ist. Warum habe ich noch nicht herausgefunden. Vll weißt ja auch du hier genaueres. :)

LG Mike

[1UnitedPower]

Dabei ist es ihm völlig egal ob die Zahl 1, 5, 27 oder 100 ist. Warum habe ich noch nicht herausgefunden. Vll weißt ja auch du hier genaueres. :)

Vielleicht, weil direkt nach Initialisierung "tab.tabs("option", "active", 2);" ausfürhst.