Button Bewerten in der Detailansicht öffnet falschen Tab

Das ein oder andere Plugin fügt weitere Tabs in der Detailansicht hinzu. Wie z.B. das Plugin Nährwerte und Produktdetails für die LMIV.

FriedmNutritionalValue_03

Es wurde hier ein Tab zwischen "Beschreibung" und "Bewertungen" angelegt. Das Problem dabei ist, dass dadurch der Button "Bewerten" nicht mehr das richte Tab öffnet.

button_bewerten

Bei Klick auf "Bewerten" wird in diesem Fall "Nährwerte und Produktdetails" geöffnet, da dieser die Position von "Bewertungen" eingenommen hat. Guckt man sich das JavaScript an, das dafür zuständig ist, findet man heraus, dass ein statischer Wert für die Position eingetragen wurde.

jquery.jump-to-tab.js

onJumpToTab: function (event) {
	event.preventDefault();
	this.jumpToTab(1);
	$.publish('plugin/swJumpToTab/onClick', [this, event]);
},

Der Methode jumpToTab() wird einfach die Position 1 übergeben, was falsch ist, da der Tab nun an Postion 2 ist. Ein Korrektur könnte so aussehen:

$.subscribe("plugin/swJumpToTab/onClick", function(event, me) {
	me.jumpToTab(2);
});

Damit hätten wir das Problem gelöst.

Was passiert, wenn aber weitere Tabs hinzu oder entfernt werden? Richtig, die Position stimmt nicht und es muss angepasst werden. Diesen Aufwand wollen wir uns sparen. Also muss herausgefunden werden, an welcher Position Tab "Bewertungen" ist.

Das könnte z.B. so aussehen:

var tab = 0;
$(".tab--navigation .tab--link").each(function (i, el) {
	if ($(el).find('.product--rating-count').length) {
		tab = i;
	}                            
});
me.jumpToTab(tab);

Wir suchen also in der Tab-Leiste ein Element indem das Element mit der Klasse "product--rating-count" vorhanden ist. Das ist im Normalfall unser gesuchter Tab. Die gefundene Position können wir dann jumpToTab() übergeben. Das gesamt Script wäre folgender:

$.subscribe("plugin/swJumpToTab/onClick", function(event, me) {
	var tab = 0;
	$(".tab--navigation .tab--link").each(function (i, el) {
		if ($(el).find('.product--rating-count').length) {
			tab = i;
		}                            
	});
	me.jumpToTab(tab);
});

Das ist schon alles. Wir können also nun weitere Tabs in der Detailansicht hinzufügen und wir öffnen immer Tab "Bewertungen", wenn wir den Button "Bewerten" anklicken.

Wer nicht weiß wie mit $.subscribe() gearbeitet wird oder wie er das nun in sein Template/Theme hinzufügt, sollte sich diesen Beitrag mal ansehen.

// edit

Ich hab ein kostenloses Plugin im Store eingestellt:
http://store.shopware.com/fried10721954868/tab-bewertungen-oeffnen.html

Das Plugin basiert auf dieses Tutorial und berücksichtigt zusätzlich die Abgabe einer Bewertung.

« Zurück