# Eigener Tag inkl. Javascript - Skript nur einmal importieren



## Reeny (1. Feb 2008)

Hi,

ich habe einen eigenen Tag gebastelt (mit "*<ui:composition>*"), der eine Checkbox "simulieren" soll. Dazu benötige ich aber auch Funktionen in Javascript, die ich einfach mit *<script></script>* in das Tag einbinde.

Wenn ich nun das Tag in einer XHTML-Seite benutzen will, werden zu jeder "PseudoCheckbox" auch die zugehörigen Scripts generiert. Das heißt, zu jeder "PseudoCheckbox" gibt es einen neuen "<script>" Abschnitt. 

Pseudocode:

```
<html ...>
...

<body>
    <h:form>
        <xyz:InputCheckbox id="chbx_1" />
        <xyz:InputCheckbox id="chbx_2" />
        <xyz:InputCheckbox id="chbx_3" />
    </h:form>
</body>
</html>
```

wird zu:

```
<html ...>
...

<body>
    <form ...>
        <script type="text/javascript">
            // Code zur PseudoCheckbox
        </script>
        <input type="hidden" id="form:chbx_1" ... />
        [img][/img]

        <script type="text/javascript">
            // Code zur PseudoCheckbox
        </script>
        <input type="hidden" id="form:chbx_2" ... />
        [img][/img]


        <script type="text/javascript">
            // Code zur PseudoCheckbox
        </script>
        <input type="hidden" id="form:chbx_3" ... />
        [img][/img]

    </form>
</body>
</html>
```

Diese Scripts sind aber immer gleich, und es würde reichen, wenn ein solches Script nur einmal pro XHTML-Seite implementiert werden würde.

Kann man das irgendwie hinbekommen?


-= reeny =-


----------



## Ralf Ueberfuhr (5. Feb 2008)

2 Möglichkeiten: Entweder du benennst deine Javascript-Funktionen jedesmal anders, z.B. durch Mitgabe eines ID-Attributs im Tag (ist bei Portlets z.B. geläufige Praxis) oder du verwendest folgenden Code (JS in externe Datei ausgelagert, aber nur einmalig eingebunden und damit ausgeführt):


```
<script type="text/javascript">
  var scripts = document.getElementsByTagName('script');
  var insertScript = true;
  for (var i = 0; i < scripts.length; i++) {
    scriptNode = scripts[i];
    if(scriptNode.src && scriptNode.src.indexOf('meinJS.js')==0) {
      insertScript=false;
      break;
    };
  };
  if(insertScript) {
    // Insert Script
    var newScriptNode = document.createElement('script');
    newScriptNode.setAttribute('type','text/javascript');
    newScriptNode .setAttribute('src','meinJS.js');
    document.getElementsByTagName('head')[0].appendChild(newScriptNode );
  };
</script>
```


----------



## Reeny (5. Feb 2008)

Jaaaaa, prinzipiell ne gute Idee (sogar irgendwie das, wonach ich gesucht habe!), aaaaber  :roll: :

Wenn ich deine zweite Möglichkeit verwende und nun dieses Script-Fragment wie unten stehend in die PseudoCheckbox-Komponente einfüge, würde doch genau das selbe passieren: dieses Fragment würde jedesmal über die verwendete *PseudoCheckbox* auftauchen (es gibt Web-Seiten, bei denen ich 64! solcher Checkbox-Objekte darstelle).

Oder nicht ... ? ???:L 


```
<ui:composition>
	
	<script type="text/javascript">
		var scripts = document.getElementsByTagName('script');
		var insertScript = true;
		for (var i = 0; i < scripts.length; i++) {
			scriptNode = scripts[i];
			if(scriptNode.src && scriptNode.src.indexOf('meinJS.js')==0) {
				insertScript=false;
				break;
			};
		};

		if(insertScript) {
			// Insert Script
			var newScriptNode = document.createElement('script');
			newScriptNode.setAttribute('type','text/javascript');
			newScriptNode .setAttribute('src','meinJS.js');
			document.getElementsByTagName('head')[0].appendChild(newScriptNode );
		};
	</script>

	

</ui:composition>
```


_BTW_: Deine erste Möglichkeit, dass die Javascript-Funktion jedesmal eine andere Bezeichnung bekommt, ist in diesem Fall nicht sinnvoll. Die Funktionen sind ja jedesmal gleich. Wozu also den selben Code unnötig oft in der generierten HTML-Seite wiederholen ... ?


----------



## Ralf Ueberfuhr (5. Feb 2008)

Das ist durchaus ein angewandtes Mittel, wenn es um Erzeugung von HTML in Schleifen oder Tags geht. Es ist nicht schlimm, wenn derselbe Code 64 mal im Ergebnis auftaucht. Es bringt auch den Browser oder das Netzwerk nicht an seine Grenzen. Wichtig ist nur, dass du als Programmierer den Quelltext nur einmal stehen hast. Und selbstverständlich ist auch, dass das Ganze funktioniert. Deshalb die Sache mit den IDs (bei Portlets: NameSpace), um doppelte Bezeichner zu vermeiden.

Anders funktioniert es leider nicht.


----------



## Reeny (6. Feb 2008)

Na gut, dann mach ich das erstmal so ...

Danke für die Antwort!


----------

