# Menü per Js ein bzw ausblenden



## Speedrider (26. Februar 2005)

Hi

 Ich möchte mein Menü im Acp per Js aus und einblenden können. Also das ich einzelne Kategorien ein udn ausbelden kann.

 Standardt mäßig sollen alle ausgeblendet sein.


 Also wenn man auf die Seite kommt das sie zugekllapt sind.

 Das ganze soll auch in cookies gespeichert werden. So das man denn Browser bzw Seite verlassen kann udn man wieder drauf geht die Kategroien so sind wie man es verlassen hat.

 Also wen man Cat Test einblendet und man verlässt die seite. Udn man geht z.b. nach einer Stunde wieder drauf das sie dann imemr noch ausgeblendet ist. Also imer so wie man die seite verlassen hat.

 Nun es gibt ja auch Leute die kein Js haben. Nun möchte ich dort folgendes, wenn kein Js aktiviert ist oder verwendet werden kann. Das dann alle Kategorien eingeblendet sind.

 Hoffe mir kann jemand helfen ich habe kA von Js.

 Es sollte so sein wie im VBulletin. Nur statt eingeblendet gleich ausgeblendet wenn js aktiv und wen deaktiv eingeblendet.

 Gruß Alex


----------



## con-f-use (27. Februar 2005)

Ehrlich gesagt, wenn du keine Ahnung von JavaScript hast, wie du sagst, ist dir bei diesem Problem nicht zu helfen bzw. wird dir niemand helfen. Wir machen hier nämlich im allgemeinen weder JavaScript-Kurse noch fertige Scripts. Sowas ist zeitaufwendig und gibts meistens nur nach Bezahlung. Und bitte denk in Zukunft auch daran, dass wir nicht Gedanken lesen können und den Aufbau deiner Seite nur erahnen solange du keine URL postest.

 Ich würde dir empfehlen jedem auszublenden Bereich eine id zu geben. Per JS machst du dann mit document.getElementByID("id").style.visibility="none" innerhalb einer Schleife alle Bereich unsichtbar für die kein Cookie-Eintrag existiert. Damit löst du dein "Nur statt eingeblendet gleich ausgeblendet wenn js aktiv und wen deaktiv eingeblendet"-Problem, denn wenn JS nicht eingeschaltet wäre, wird nichts ausgeblendet.

 Mit dem Befehl document.getElementByID("id").style.visibility="none" kannst du die Bereiche wieder einblenden. Jetzt brauchst du eine Funktion, die einen ausgeblendeten Bereich wieder einblendet und einen eingeblendeten ausblendet - siehe dazu auch z.B. diesen Thread. Sie muss aber zursätlich noch den Zustand des Bereiches als Cookie speichern. Womit wir bei der schwierigkeit wären:

 Bei der Sache mit den Cookies kann ich dir relativ wenig helfen. Ich für meinen Teil benutze nie Cookies. Das Problem dabei ist, dass du nicht wirklich Variablen speichern kannst sondern nur einen fließenden Text, den du dann per JS wieder mühsam in deine ganzen Variablen auseinander friemeln musst. Hier kann ich dir nur die üblichen Funktionen mit denen man cookies liest und setzt geben:

```
<script type="text/javascript"><!--
 function setCookie(name,value,days) {
 	if (days) {
 		var date = new Date();
 		date.setTime(date.getTime()+(days*24*60*60*1000));
 		var expires = "; expires="+date.toGMTString();
 	}
 	else var expires = "";
 	document.cookie = name+"="+value+expires+"; path=/";
 }
 
 function getCookie(name) {
 	var nameEQ = name + "=";
 	var ca = document.cookie.split(';');
 	for(var i=0;i < ca.length;i++) {
 		var c = ca[i];
 		while (c.charAt(0)==' ') c = c.substring(1,c.length);
 		if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
 	}
 	return null;
 }
 
 function delCookie(name) {
 	setCookie(name,"",-1);
 }
```
 Mit setCookie('bspcookie','bspwert','5') legst du einen Cookie an der den Namen bspcookie hat, den Wert bspwert und in 5 Tagen abläuft. Mit getCookie('bspcookie') gibt dir die Funktion den Wert des Cookies also bspwert zurück.

 Mehr kann ich leider nicht für dich tun. Bleiben noch zwei Hoffnungen: Google (sowas in der Art gibts vielleicht schon als Fertigsuppe) oder andere hier im Forum( *hüstelSVEN* *hüstelMintel* - schon schlimm wenn man den Forsch im Hals hat  ).


----------



## Sven Mintel (27. Februar 2005)

Da stellt sich mir als Erstes die Frage, was das für ein Menu ist (falls ich gemeint war )


----------



## Speedrider (27. Februar 2005)

So wie das hier auf der Seite auch ist so sieht das menü vom aufbau aus. Es sollte haltnur auf und zu klapptbar sein.


----------



## Sven Mintel (27. Februar 2005)

In der Tutorials-Sektion findest du ein "Basic-DHTML-Menu"...damit kann man einblenden und ausblenden.

Wie du Cookies setzen und auslesen kannst, steht im Beitrag von con-f-use.

Verschaffe dir Ahnung in JS und verbinde beide Sachen zu Einem... fertitsch


----------



## Speedrider (1. März 2005)

Ok danke

 nun noch 2 Fragen.

 Wie kann ich machen das wenn js aktiv ist das es ausgebeldendet ist wenn man reihnkommt udn wen deaktiv es auf ist. 


 Und leider hab ich das mit denn cokkies nicht hinbekommen.

 hier mal mein Js Code


```
<script type="text/javascript"><!--
 		 function swap(id) {
 			 NewsObj = document.getElementById("News" + id);
 			 if (NewsObj.style.display == "none") {
 				 NewsObj.style.display = "block";
 			 } else {
 				 NewsObj.style.display = "none";
 			 }
 		 }
 	  
 	  
 	 //--></script>
```
 

 Hoffe ihr könnt mir helfen.


----------



## con-f-use (1. März 2005)

Also das ein- und ausblenden klappt schonmal so, wie du es dir vorstellst?

  Wenn ja musst du jetzt JavaScript dazu brigen, dass es sich per Cookie merkt ob ein Bereich geöffnet ist oder geschlossen. Dazu setzt du jedesmal ein Cookie wenn der Bereich offen ist und löscht es wieder, wenn er geschlossen wird.

      Die Funktion sieht dann so aus: 
	
	
	



```
function swap(id) {
       NewsObj = document.getElementById("News" + id);
       if (NewsObj.style.display == "none") {
        NewsObj.style.display = "block";
 delCookie('News'+id);
  } else {
        NewsObj.style.display = "none";
 setCookie('News'+id,'1','10')
       }
      }
```
 


> Wie kann ich machen das wenn js aktiv ist das es ausgebeldendet ist wenn man reihnkommt udn wen deaktiv es auf ist.


  Alle Bereiche müssen standartmäßig eingeblendet sein. Dann kannst du eine Funktion verwenden, die alle Bereiche innerhalb einer Schleife anspricht und sie ausblendet, sofern kein Cookie für sie vorhanden ist. Diese Funktion führst du dann beim Laden aus. Die Funktion könnte so ähnlich aussehen (lustig, ich hatte vor kurzem ein ganz ähnliches Problem: 
	
	
	



```
function forbereiche() {
       for(n=0;n<[anzahDerBereiche];n++) {
        Cookie = getCookie('News'+n);
        if (Cookie == null) {
         document.getElementById('News'+n).style.display = 'none';
        }
       }
      }
      
      window.onload=fornbereiche;
```


----------



## Speedrider (1. März 2005)

Ok


 Nur das mit der letzten funktion hab ich noch nicht ganz verstanden.


 Muss bei denn Cookies noch was gemacht werden?

 Weil derzeit liest er sie ja nicht aus oder?

 Hoffe du kannst mir da nochmal Helfen.


----------



## con-f-use (1. März 2005)

Ich hatte auch vorhin einen kleinen fehler gemacht. Hab's nämlich genau verdreht: Die Funktionen die ich gepostet hatte gingen davon aus, dass alle Bereich AUSgeblendet waren und haben dann die für die ein Cookie existierte eingeblendet. Du willst aber alls standartmäßig EINgeblendet haben und nur die, für die ein Cookie existiert ausgeblendet. Diesen Fehler meinerseits hab ich schonmal in meinem alten Post berichtigt. 

      So jetzt zu deiner Frage:

      Die letzte Funktion liest die Cookies aus. Das siehst du an diesen 3 Zeilen:

     1: *for(n=0;n<[anzahDerBereiche];n++) {* <--- Hier wird eine Schleife gestartet in der n jeweil um ein erhöht wird, bis es keine Bereiche mehr gibt (musst halt den richtigen Wert für die Anzahl der Bereiche eingeben. Die Schleife ist übrigens so gebaut, dass du hier auch gerne ne größere Zahl an Bereichen eingeben kannst, als tatsächlich existieren ohne, dass es Fehlermeldungen gibt.

      2: *Cookie = getCookie('News'+n);* <--- Hier wird das Cookie für den Bereich mit der Nummer n ausgelsenen 

      3: *if (Cookie == null) {* <--- Hier wird geprüft, ob das Cookie existiert


 P.S.
     Kann es sein, dass du deine JavaScript Hausaufgaben nicht gemacht hast?


----------



## Speedrider (1. März 2005)

Euhm nö eiegtnlcih hat es doch gestimmt. Weil Standardtmäßig sollen ja alle ausgeblendet sein, also nicht sichtbar. Dies aber nur wenn Js aktiviert ist.

  Und die Berescihe werden per Datenbank erstellt. also dort steht auch die id drin.

  Kann ich dann bei Anzahl an bereischen die variable reihn machen für die zählung von den Datansätzden der db also menü cats?



 Was ich aber noch nicht ganz verstehe wie wird des gemacht das er vom Cokkie her weiß ob nun ausgeklappt oder eingeklappt. Er müsste doch eigentlich mit einer if abfrage überprüfen obn ein cookie vorhandne ist mit ausgeklappt oder?

  Sry für diese vielen Fragen. 

  aber wie gesagt ich kenn mich nicht so gut aus.

  War froh das ich das schonmal soweit geschafft habe.

  PS:

 Der Link wird per javascript aufgerufen. Also so

  javascript:swap('id der Kategorie')


----------



## con-f-use (2. März 2005)

Okay, der letzte Versuch meinerseits. Hier der Link zu einem leicht abgewandelten Projekt von mir, das jetzt im Prinzip genau das macht, was du willst. Mehr werde ich dir nicht helfen. Ich empfele dir einfach mal soviel JavaScript zu lernen, dass du jedes Zeile Verstehst (inklusive derer in der cookie.js und der countElement.js). Nur so kannst du das Script an deine Bedurfnisse anpassen. Das meiste an Erklärung hab ich sowieso schon früher oder später in diesem Thread gebracht. Soviel von meiner Seite dazu.


----------



## Speedrider (4. März 2005)

Hi

   also habe das nun eingebaut deien Code so wie es bei dir ist.

 Nur leider wird bei dir ein # hintendran gemacht udn da ich denn link ja per javascript aufrufe wird dies ja nciht hinten dran gesetzt. Nun funktioniert das ganze mit denn cookies nicht aber wenn ich von hand die # hinmache udn dann einklappe usw. geht es. Nur leider wenn ich dan die seite mit f5 aktualisiere ist es wieder weg, aber wen ich bei der adressleiset enterdrücke bleibt es.


  Edit1:
 Hi habe eben deinen Kompletten code bei mir eingefügt mit den .js dateien. Das erste was mir auffält ist das drotz aktiviertem js des was normal ausgeblendet sein soll eingeblendet ist. Kann es vielleicht drann liegen das ich xhtml 1.0 tradionell verwende?


----------



## con-f-use (5. März 2005)

Ich kann nur sagen bei mir funktioniert es in allen gängigen Browsern (IE, Netscape, Opera, Mozilla/Thunderbird) perfekt. Der Fehler muss also an deinem Ende zu finden sein.
 Den Doctype "xhtml 1.0 traditionell" gibt es nicht du meinst "xhtml 1.0 transitional".

   Egal, versuchs alternativ mal mit 
	
	
	



```
<a href="javascript:swap('2')" id="Link2"></a>
```
   statt mit  
	
	
	



```
<a href="#" onClick="swap('2')" id="Link2"></a>
```


----------



## Thomas Lindner (5. März 2005)

Vielleicht könnten wir im Forum einen Patch/Hack einbauen, das das Telefon bei 





> *hüstelSVEN* *hüstelMintel*


 klingelt wenn im JS Forum ein Beitrag veröffentlicht wurde...   

Ich bräuchte dazu ganz dringend mal die Telefonnummer - den Rest bekommen wir schon hingebogen!

*Und jetzt stell ich mich in die Ecke und schäme mich für dieses Offtopic...*


----------



## con-f-use (5. März 2005)

²

  Da könnten wir auch gleich noch den patentierten *Sven-Ein-Bier-Ausgeb-O-Mat* dranstöpseln, 
   damit er für seine Arbeit auch ordentlich entlohnt wird.... 

   ....obowhl, dann würd er dauerbreit bei sich zu Hause rumhocken und käm bald 
   nicht mehr zum Arbeiten weil eigene *Brauerei *usw.


----------



## Sven Mintel (5. März 2005)

Nicht notwendig.... beim letzten Borg-Angriff hab ich ein Implantat bekommen, welches mir Elektroschocks verabreicht, wenn hier jemand in meiner Abwesenheit postet :suspekt:

Wobei... das mit dem Bier wäre eine Überlegung wert.

*[edit by Mintel]User Sven, bitte kein  ;-][/edit]*


----------



## Speedrider (5. März 2005)

Habe ich gemacht hilft aber nichts, ich poste mal meinen Kompletten code hier mal her.


```
<script type="text/javascript" src="cookie.js"></script>
<script type="text/javascript" src="countElement.js"></script>
     <script type="text/javascript"><!--
function swap(id) {
     catObj = document.getElementById("cat" + id);
     if (catObj.style.display == "none") {
      catObj.style.display = "block";
      setCookie('News'+id,'1',10);
     } else {
      catObj.style.display = "none";
      delCookie('News'+id);
     }
    }
    
function forcat() {
	for(n=0;n<countElement('id','p',/^cat\d+\b/);n++) {
		Cookie = getCookie('cat'+n);
		if (Cookie == null) {
			document.getElementById('cat'+n).style.display = 'none';
		} else {
    document.getElementById('cat'+n).style.display = 'block';
		}
	}
}

window.onload=forcat;         
     //--></script>
```
 

```
<table cellspacing="0" cellpadding="0" class="menue">
        <tr>
          <td width="100%" class="menueo"><a href="javascript:swap('1')">Einstellungen</a></td>
        </tr>
        <tr>
           <td width="100%">
<ul class="menuelist" id="cat1">
<li>Globale Einstellungen</li>
<li>Newseinstellungen</li>
</ul>
</td>
        </tr>
         <tr>
          <td width="100%"><img src="./images/menue_end.gif" /></td>
        </tr>
       </table>
```
 

 Die beiden js dateien sehen genauso aus wie deine.
 Hoffe du findest denn fehler.

 Gruß Alex


----------



## con-f-use (5. März 2005)

Schau dir mal in der Funktion swap('id') die Zeilen getCookie und delCookie an. Wenn du News in cat umbenennst must du das schon überall machen.

   In der for-Schleife_for(n=0;n<countElement('id','p',/^cat\d+\b/);n++)_​musst das 'p' durch den Tag-Namen ersetzten den deine Bereiche dann wirklich haben. In deinem Beispiel 'ul'. Sie müssen alle den gleichen Tag-Namen haben.

   Wie gesagt Fehler bei dir...


----------



## Speedrider (5. März 2005)

syr das htte ich übersehen.

  Habe es nun geändert auch das mit dem p in der for Schleife habe ich nun ul hingemacht so wie du es sagtest.

 Hatt aber leider immer noch nichts geholfen. Die Blöcke sind weiterhin mit aktivem js sichtbar, dabei sollen sie ja so wie in deinem Bsp. sein.

 Gruß Alex


----------



## con-f-use (5. März 2005)

Okay, also der Fehler kann jetzt nur noch in der for-Schleife liegen. Versuch mal die Zahl der Bereiche von Hand einzutragen. 

     Also z.B._for (n=0;n<22;n++)_​statt_for(n=0;n<countElement('id','p',/^cat\d+\b/);n++)
_​Außerdem musst wenn du bei der Zählung der Bereiche mit 1 anfängst auch bei der Schleife mit eins anfangen: _for (n=1;n<22;n++) _
   Oder was noch eleganter ist, du nimmst diese for-Schleife her:
	
	
	



```
function forcat() {
   	for(n=0;n<countElement('id','ul',/^cat\d+\b/);n++) {
   		Cookie = getCookie('cat'+n);
 		if (Cookie == null) if (document.getElementById('cat'+n)) document.getElementById('cat'+n).style.display = 'none';
   	}
   }
```


----------



## Speedrider (5. März 2005)

Ok danke nun funktiorniert es einwandfrei.

 Ich bedanke mich mal an dieser stelle für deine Geduld mit mir.

 Der fehler lag daran das ich tatsächlich mit 0 angefangen habe. Dann hat er aber nur eine zugeklappt. Danach hab ich einfach noch in der .js date c=0 in c=1 geändert.

 Gruß Alex


----------



## con-f-use (5. März 2005)

Schwere Geburt. Ich muss sagen ich war zwischendrin doch fast soweit mit dir die Geduld zu verlieren. Sorry, deswegen. Schön, dass es jetzt klappt.

 Würd ganz gerne mal die fertige Seite beäugen...


----------



## Speedrider (5. März 2005)

Wenn sie fertig ist gerne.

 Da das menü in einem Cms ist dauert es noch etwas.

 Ich werde dir dann das Teil zukommen lassen.


----------

