[JS Prototype] *neues Prob*

[Goltergaul]

Hi, ich hoffe es kann mir wer von euch helfen. Ich verwende die prototype Lib.

Folgendes: Per Ajax.Request lade ich ein js script in ein DIV:

							new Ajax.Request('ajax_ui.php?type=menudata', {
								method: 'get',
								onSuccess: function(transport) 
								{
									$("vars").update(transport.responseText);
									build_menu(); // Array durchgehen und daraus menü bauen
									stopLoadingMsg();
								}
							});

Das script sieht in etwa so aus:

<script language="text/javascript">

var arr_gebaeude = new Array();

arr_gebaeude[0]=new Array(blahblah inhalt und so );
arr_gebaeude[1]=new Array(blahblah inhalt und so );
</script>

dan möchte ich in der function buil_menu() auf die variable arr_gebaeude zugreifen, was aber leider nicht funktioniert. Wie kann ich das machen?

 

[ice-breaker]

mit js reinladen funzt so ohne weiteres net, du musst den evalJavscript parameter auf true setzen, dann geht das

 

[tleilax]

Was genau hast Du denn da vor? Wird in #vars HTML per AJAX reingeladen, in dem auch noch Daten mittels Javascript vorhanden sind?

Ich würde die Daten in den JSON-Header packen, dadurch sind sie im Callback direkt als Objekt im zweiten Parameter verfügbar. Ist zum Einen strukturierter und Du umgehst das Problem, dass Du die Daten aus dem Responsetext in den Javascript-Kontext reinholen musst.

Als rudimentäres Beispiel:

// PHP
Header('X-JSON: {result: true, data: {foo: "bar"}}');

// JS
new Ajax.Request('ajax_ui.php?type=menudata', {
	method: 'get',
	onSuccess: function(transport, json)  {
		$("vars").update(transport.responseText);
		if (json && json.result) {
			build_menu(json.data);
		}
		stopLoadingMsg();
	}
});

Das Ganze bedingt natürlich, dass Du die build_menu()-Funktion umbauen musst, aber das dürfte recht simpel sein, immerhin ist Javascript ja nicht an Funktionsparameter gebunden:

function build_menu(data) {
	data = data || arr_gebaeude;
       // ..
}

Dadurch nimmt Javascript entweder den übergebenen Parameter data oder (wenn dieser nicht übergeben wurde) das globale Objekt arr_gebaeude.

 

[Goltergaul]

oha das ist mir auf anhieb zu komplex^^

Also das ganze is dazu da, dass eine javascript array in die seite geladen wird, das informationen über eine menüstruktur enthält, dass dann per build_menu() erstellt wird.

Dazu lade ich in #vars einen javascriptcode mit besagtem array hinein um dann per build_menu() darauf zuzugreifen. (vorher wird das div #vars geleert).

Was ist denn dieser JSON header? Das ist von jquery oder? Weiß jetzt nicht ganz wie ich mir das vorstellen muss, dass meine variable dann als objekt verfügbar ist?

edit: aha habe grade bei google einige infos darüber gefunden. werde mir das genauer ansehen, sieht sehr praktisch aus

 

[tleilax]

Nene, mit jQuery hat das nix zu tun.

Prototype unterstützt ab Version 1.6 (oder war's schon 1.5.1?) die Möglichkeit, einem AJAX-Request serverseitig mehr Daten als "nur" HTML mittels des JSON-Headers mitzugeben. Dazu bereitest Du die Daten serverseitig vorzugsweise in einem Array auf und übergibst der Antwort dann diese Daten über den besagten Header (wenn Du PHP verwendest, wird FastJSON Dir viel Arbeit ersparen).
Prototype prüft nun nach dem Request, ob dieser Header vorhanden und wird die Daten aus dem Header in ein Objekt umwandeln, sofern dies möglich ist. Dieses Objekt wird dem Callback als zweiter Parameter neben dem Transport-Objekt übergeben.

Meiner Meinung nach ist dies eine weitaus sinnvollere Art und Weise, die Daten zu übergeben als einen Hilfscontainer zu missbrauchen.

 

[Goltergaul]

ok danke für den hinweis, habe die nötigen infos bei google gefunden Sieht sehr praktisch aus und ich habe das auch schon versucht. Aber:


new Ajax.Request('ajax_ui.php?type=menudata', {
method: 'get',
onSuccess: function(transport,json)
{
alert('test');
alert(json.length);
//$("vars").update(transport.responseText);
build_menu(json); // Array durchgehen und daraus menü bauen
stopLoadingMsg();
}
});

es gibt leider nur ein alert-popup (test), und keinen error. Firebug sagt mir für den ajax request folgendes:
Response Headers
Date Wed, 06 Aug 2008 14:14:04 GMT
Server Apache/2.2.8 (Win32) DAV/2 mod_ssl/2.2.8 OpenSSL/0.9.8g mod_autoindex_color PHP/5.2.5
X-Powered-By PHP/5.2.5
Keep-Alive timeout=5, max=98
Connection Keep-Alive
Transfer-Encoding chunked
Content-Type application/x-json

und als Response [["geb","1",7,"Bauhof","Der .....

Sollte doch passen oder?


edit: auch das hat sich erledigt *g*

onSuccess: function(transport){
var json = transport.responseText.evalJSON(true);
....

hats gebracht
Danke dir für den Tipp!

 

[Goltergaul]

so ich habe jetzt ein weiteres problem mit prototype...

ich lade html gemixt mit javascript per ajax.request in ein div:

new Ajax.Request('ingame_bauhof.php', {
method: 'get',
onSuccess: function(transport){
$("world").update(transport.responseText);
...

dabei wird aber mein script anscheinend aus dem response text entfernt (nur html wir in #world geschrieben und nicht mein <script.... >. Wird das mit eval aufgerufen und dann rausgelöscht? Jedenfalls scheine ich dann nicht auf die Funktionen zugreifen zu können, die im Responsetext drin sind. Gibt aber auch keine Fehlermeldung, dass die Funktion nicht definiert wäre, deshalb bin ich jetzt etwas verwirrt....

 

[ice-breaker]

generell ist nachladen von JavaScript eine sehr doofe Idee, sorg lieber dafür dein Js richtig zu bündeln und extern einzubinden.

 

[Goltergaul]

hmmm mein js script ist schon 800 zeilen lang. nachladen wäre schon praktisch ^^

 

[ice-breaker]

was sind 800 Zeilen?
Gzip an und nen Expires-Header setzen und es stört dich net mehr.
Dein Prototype was die ganze Zeit geladen ist wird tausendmal größer sein.

Edit: Nachladen ist ne Frickel-Arbeit die gute Programmierung nicht zulässt.