✔ Form mit 3 verschienden unabhaengigen Zielen

L

LindaJS

Grünschnabel
Hallo,

ich bin neu hier und moechte mich deswegen kurz vorstellen. Ich bin Linda und studiere in Berlin. Zur Zeit arbeite ich an einem kleinen Projekt, dass mit der Google Maps API handtiert. Leider habe ich ein Problem bei dem ich seit Tagen nicht weiterkomme und weder Google noch meine Komillitionen koennen mir so recht helfen.. deswegen hoffe ich, dass jmd von euch Zeit findet.
Ich habe auf meiner Website ein Formular bei dem man verschieden Orte auswaehlen kann. Dabei gibt es 3 Moeglichkeiten:

1) ein Plot wird in einem neuen Popup geoffnet und angezeigt
2) Daten des Ortes werden in einem neuen Popup geoffnet und angezeigt
3) auf der SELBEN Seite werden weitere Informationen angezeigt

Das funktioniert auch alles soweit. Wichtig ist, dass bei 1 und 2 Popups geoffnet werden und die aktuelle Seite ohne Aenderung bestehen bleibt. Bei Punkt 3) soll die aktuelle Seite weiter auf einen andere Seite gehen und das im GLEICHEN Fenster.
Es funktioniert auch allerdings gibt es einen Haken. Wenn ich zuerst auf Punkt 3 klicke laed die gewuenschte Seite wie gewollt. Klickt man allerdings ZUVOR auf Punkt 1 oder 2 oeffnet sich auch die dritte Option in einem neuen Fenster [Popup ist ein komplett neues Fenster die andere Popups sind ja per height und width begrenzt]... ich bin ratlos :(

Wuerde mich super freuen wenn mir jmd weiterhelfen kann..und hoffe ihr versteht das Problem wenn nicht versuche ich es gerne nochmals anders zu erklaeren..habe die Seite leider nicht online, da sie lokal per web2py erstellt werden..

Linda

Hier der Code:

HTML: 
<script type="text/javascript">

// Stations Plot oder Data Abfrage bei Data und Plot popup oeffnen
function switchAction()
{
  if(document.pressed == 'data') //PUNKT 1
  {
   document.input.action ="agro_s_data.html?";
   document.input.target='window';
   window.open('about:blank', 'window', 'scrollbars=1,width=550,height=650');
   window.setTimeout('window.document.forms[\'input\'].submit();', 1);
  }

  else
  if(document.pressed == 'stations') // PUNKT 3
  {
    document.input.action ="agro_s.html?";
    window.input.target=self;
  }

  else
  if(document.pressed == 'plot') // PUNKT 2
  {
    document.input.action ="agro_s_plot.html?";
    document.input.target='window';
    window.open('about:blank', 'window', 'scrollbars=1,width=550,height=650');
    window.setTimeout('window.document.forms[\'input\'].submit();', 1)
  }

  return true;
}

 
</script>


  <head>
</head>
<html>
<body>

<form action="agro_s_data.html?" name="input" onsubmit=" switchAction(); return false;">
<p><label>plant_name: <select id="plant_name" name="plant_name">
</select></label>
<br>
<label>phase_name: <select id="phase_name" name="phase_name">
</select></label></p>
<label>station_name:</label>
<select name="station_name" size="1">	
<option> X
<option> Y
etc..
<input type="submit" name="data" onclick="document.pressed=this.value" value="data"/>
<input type="submit" name="plot" onclick="document.pressed=this.value" value="plot" />
<input type="submit" name="stations" onclick="document.pressed=this.value" value="stations" />
</form>
 
Zuletzt bearbeitet:
Zunächst mal: Herzlich Willkommen auf tutorials.de.

So nun zum Problem.
Erstens mal ist window.input.target=self; eigentlich falsch (Auch wenn es im IE/Chrome/Opera funktioniert). Formulare werden nicht über window sondern über document angesprochen:
http://de.selfhtml.org/javascript/objekte/forms.htm#allgemeines

Das ist aber nicht das eigentlich Problem.
Das Problem ist das return false im onsubmit event.
Beim onsubmit (Punkt 3) wird die switchAction Funktion aufgerufen diese ändert das action und das target attribut des Formulars und gibt true zurück.
An dieser Stelle erwartest du das das Formular abgeschickt wird. Was es gerne tun würde wenn da nicht noch das böse return false wäre welches das Senden des Formulars "abbricht".

Im Prinzip würde ich das return false aus dem onsubmit entfernen und die Funktion den return Wert bestimmen lassen:
HTML: 
<form action="agro_s_data.html?" name="input" onsubmit=" switchAction();">
Javascript: 
function switchAction()
{
	var retVal = false;
	if(document.pressed == 'data') //PUNKT 1
	{
		document.input.action ="agro_s_data.html?";
		document.input.target='window';
		window.open('about:blank', 'window', 'scrollbars=1,width=550,height=650');
		window.setTimeout('window.document.forms[\'input\'].submit();', 1);
	}

	else
	if(document.pressed == 'stations') // PUNKT 3
	{
		document.input.action ="agro_s.html?";
		document.input.target = '_self';
		retVal = true;
	}

	else
	if(document.pressed == 'plot') // PUNKT 2
	{
		document.input.action ="agro_s_plot.html?";
		document.input.target='window';
		window.open('about:blank', 'window', 'scrollbars=1,width=550,height=650');
		window.setTimeout('window.document.forms[\'input\'].submit();', 1)
	}

	return retVal;
}

Ich hätte da ja noch einiges mehr an dem code zu meckern. Aber das lass ich jetzt mal. Weils dein erster Tag ist :)
 
Hi,

vielen vielen Dank fuer die Hilfe!! Ich kann das leider erst morgen wieder testen wenn ich meinen Server habe an der Uni aber werd das dann sofort machen.
Ich les mich da auch nochma genauer ein mit dem Return..
Ich hoffe der Code ist nich soooo schlimm ;) bin noch neu und is ja auch erst mal ne Rohfassung.. ich hoffe, dass das morgen dann funktioniert.

Bis dahin nochmals vielen Dank und schoenen Abend =)
 
Ja es funktioniert =) Konnte das jetzt auch anhand des Links nachvollziehen.

Vielen Dank nochmals,

Gruss Linda
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück