Gruppen

Top Gruppen: Windows 7; Windows Vista; Windows XP; Textverarbeitung; Excel; DSL; Internet Browser; E-Mail/Outlook
Betriebsysteme: Windows classik; Linux; BS-Sonstige
Software: Datenbanken; Bildbearbeitung; Audio/mp3/Video; Security/Viren; SW-Sonstige
Hardware: Mainboard/CPU; Grafikkarten; Peripherie; Laptop/Notebook; HW-Sonstiges
Netzwerk: Telefon,ISDN,Modem; W-Lan; NW-Sonstiges
Programmierung: PHP,ASP,Perl...; Java,C++...; Webseiten/HTML
Sonstiges: PC-Sonstiges; Plauderecke; SN Intern; Test

/ Forum / Skripte(PHP,ASP,Perl...)

Skripte(PHP,ASP,Perl...)

Fragevon Uesch vom 06.01.2021, 20:32 Options

Ajax wird nicht im Formular erkannt

Hallo allerseits,

ich habe ein kleines Problem mit Ajax und PHP. Und zwar möchte ich, dass nach Ändern eines Auswahlfelds sich das andere Auswahlfeld ändert. Das ist erstmal kein Problem. Das Problem ist jedoch wie ich auf der Hauptseite das Auswahlfeld in eine Datenbank eintragen kann. Denn wenn ich einfach den Variablennamen angebe, ist die Datenbank leer.

Hier das Script:

<script type="text/javascript" language="javascript">

            var http_request = false;

            function makeRequest(url, parameters) {

                http_request = false;

                if (window.XMLHttpRequest) { // Mozilla, Safari,...
                    http_request = new XMLHttpRequest();
                 
                } else if (window.ActiveXObject) { // IE
                    try {
                        http_request = new ActiveXObject("Msxml2.XMLHTTP");
                    } catch (e) {
                        try {
                        http_request = new ActiveXObject("Microsoft.XMLHTTP");
                        } catch (e) {}
                    }
                }

                if (!http_request) {
                    alert('HTTP Instanz konnte nicht erstellt werden.');
                    return false;
                }
				http_request.onreadystatechange = htmlContents;
				http_request.open('POST', url, true);
				http_request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
				http_request.setRequestHeader("Content-length", parameters.length);
				http_request.setRequestHeader("Connection", "close");
				http_request.send(parameters);
				}

			function get(obj){
			var poststr = "txt=" + encodeURI(document.getElementById("search").value );
			makeRequest('ajaxing.php', poststr);
			}
			
			function htmlContents() {

                if (http_request.readyState == 4) {
                    if (http_request.status == 200) {
						document.getElementById('myspan').innerHTML = http_request.responseText;
						} else {
                        alert('There was a problem with the request.');
                    }
                }

            }
        </script>

So und das PHP-Script:


$stadt = array("Berlin", "München", "Köln");
foreach ($stadt as $meine) { echo "<option value=\"$meine\">$meine</option>"; }

So und das ganze wird jetzt in der Hauptseite per

<span name="myspan" id="myspan"></span>

angezeigt.

Wenn ich nun das <span name...> innerhalb des Formulars auf der HTML-Seite einfüge, dann wird es zwar angezeigt, aber beim Absenden des Formulars wird die Variable $stadt nicht erkannt.
Muss ich in der AJAX-Datei die $stadt separat übertragen?

Ich hoffe, irgendjemand hat das Problem verstanden.

Vielen Dank,

Üsch

Antwort schreiben

Antwort 1 von son_quatsch vom 07.01.2021, 08:07 Options

			var poststr = "txt=" + encodeURI(document.getElementById("search").value );
			makeRequest('ajaxing.php', poststr);

poststr ist das, was gesendet wird. Und momentan sendest du logischerweise nur txt=InhaltAusSearch. Das müsstest du also folgendermaßen erweitern:

			var poststr = "txt=" + encodeURI(document.getElementById("search").value )+ "&stadt=" + encodeURI(document.getElementById("wieAuchImmerDieIDvonDemElementIstWasStadtZurAuswahlStellt").value );
			makeRequest('ajaxing.php', poststr);

Antwort 2 von Uesch vom 07.01.2021, 14:25 Options

Sorry, da hab ich was falsch kopiert. In der Javascript-Datei steht

var poststr = "txt=" + encodeURI(document.getElementById("stadt").value );

Dort liegt aber auch nicht das Problem, oder? Denn die Variable "stadt" wird ja korrekt übergeben an die Ajaxdatei. Sobald ich eine bestimmte Stadt ausgewählt habe, zeigt sich das von der Ajax-Datei generierte Auswahlfeld. Das bedeutet, dass die Variable $stadt zwar an Ajax übergeben wird, aber wie bekomme ich das Auswahlfeld der Ajaxdatei ($bezirk) zurück in meine Hauptseite, so dass ich in der Hauptseite nach einem Klick auf den Button die Variabel $bezirk verarbeiten kann?

Momentan liefert $bezirk ein leeres Ergebnis und nicht das, was im Auswahlfeld ausgewählt wurde.

Vielen Dank und schöne Grüße von Üsch

Antwort 3 von son_quatsch vom 07.01.2021, 14:50 Options

Das ergibt jetzt dieselbe Antwort von mir.

Das, was der Browser dem Server schickt, sieht immer so aus:

Variable=Wert&AndereVariable=Wert&DritteVariable=GanzAndererWert

Dein zu schickender Text müsste also so aussehen:

stadt=auswahl&bezirk=auswahl

...genauso wie in meiner vorigen Antwort. Du musst es bloß umschreiben und GetElementById() jeweils auf das <SELECT> der Stadt anwenden (keine Ahnung, welche ID du dem gegeben hast) und auf das <SELECT> des Bezirks (ebenfalls weiß ich die ID davon nicht - hast ja nicht das komplette HTML-Dokument gepostet).

Antwort 4 von Uesch vom 07.01.2021, 15:19 Options

Verstehe ich nicht. Ich möchte ja nicht $bezirk an Ajax schicken.
Das

encodeURI(document.getElementById("wieAuchImmerDieIDvonDemElementIstWasStadtZurAuswahlStellt").value );

würde doch bewirken, dass die Variable "wieAuchImmerDieIDvonDemElementIstWasStadtZurAuswahlStellt" an die Ajaxdatei gesendet wird, so dass sie dort verarbeite werden kann, oder nicht? Würde es nicht mehr Sinn machen, in der ajaxing.php etwas zu schreiben, dass die Variable "bezirk" auch auf der Hauptseite zur Verfügung steht?

Hier ist der HTML-Teil (bericht_neu.php):

$ausgabe3.="<form action='".$PHP_SELF."' method='post' enctype=\"multipart/form-data\" class=\"formular\" name='bericht'>\n";
$ausgabe3.="Titel<br><input type=\"text\" class=\"eingabe_login\" value=\"$title\" name=\"title\" size=\"24\" maxlength=\"60\">\n";
$ausgabe3.="<br>Beitrag<br><textarea name=\"beitrag\" class=\"beitrag\" rows=\"4\" cols=\"40\">$beitrag</textarea>\n";
$ausgabe3.="
<table width=\"533\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\">
	<tr>
		<td width=\"170\">Reiseart</td>
		<td width=\"170\">Region</td>
		<td width=\"193\">Reisel&auml;nge</td>
	</tr>
	<tr>
		
		<td width=\"170\"><select name=\"region\" id=\"region\" onchange=\"get(this.parentNode); return false;\" autocomplete=\"off\" class=\"select\" size=\"1\">
				<option value=\"-\">--- Bitte ausw&auml;hlen ---</option>
				<option value=\"Nördliches Bergland\">N&ouml;rdliches Bergland</option>
				<option value=\"Zentralregion\">Zentralregion</option>
				<option value=\"Nordpazifik\">Nordpazifik</option>
				<option value=\"Zentralpazifik\">Zentralpazifik</option>
				<option value=\"Südpazifik\">S&uuml;dpazifik</option>
				<option value=\"Karibik-Atlantik\">Karibik-Atlantik</option>
				<option value=\"Rundreise\">Rundreise</option>
			</select></td>
		
	</tr>
	<tr height=\"21\">
		<td width=\"170\" height=\"21\"></td>
		<td width=\"170\" height=\"21\"><span name=\"myspan\" id=\"myspan\"></span></td>
		<td width=\"193\" height=\"21\"></td>
	</tr>
</table>";

Hier die Ajaxdatei (ajaxing.php):

header('Content-type: text/html; charset=ISO-8859-1');
$no_city = "Keine Stadt in Nähe";
$rundreise = "Rundreise in Region";
if($_POST['txt'] == "Zentralregion") {
$stadt = array("Berlin", "München", "Köln");
echo "Stadt";
echo "<select name=\"stadt\" id=\"stadt\" class=\"select\" size=\"1\">";
echo "<option value=\"no_city\" style=\"background: #d8d8d8\">$no_city</option>";
echo "<option value=\"rundreise\" style=\"background: #d8d8d8\">$rundreise</option>";
	foreach ($stadt as $meine) { echo "<option value=\"$meine\">$meine</option>"; }
echo "</select><br><input type=\"radio\" name=\"position\" value=\"in\"> In  <input type=\"radio\" name=\"position\" value=\"naehe\"> In der&nbsp;N&auml;he";

Und der Javascriptteil steht ja schon oben.

Antwort 5 von son_quatsch vom 07.01.2021, 16:58 Options

Ich geh mal davon aus, dass das Formular noch mit </FORM> abgeschlossen wird. Gib doch mal in jedem Fall im Ziel-PHP aus:

print_r($_REQUEST);die;

Antwort 6 von Uesch vom 07.01.2021, 17:25 Options

Wenn ichs in der ajaxing.php einfüge, kommt:

[txt] => Zentralregion [PHPSESSID] => fd799988 [visited] => 1

bzw. in der bericht_neu.php steht dann:

Array ( [PHPSESSID] => fd765dd222d48d999988 [visited] => 1 [__utmz] => 235031...

Antwort 7 von katy vom 07.01.2021, 21:16 Options

Hallo Uesch,

wenn ich dich richtig verstehe gilt:

du ergänzt nachträglich ein Formular via AJAX/innerHTML um select- und input-Felder

das Einfügen klappt auch, die felder werden wie gewünscht angezeigt

beim Absenden des Formulares werden die Inhalte dieser Elemente nicht mit gesendet

OK?

Dann ist gerade bei dieser Materie der Rat, in Formularelemente mit den DOM-Methoden einzufügen, damit der Browser sie korrekt zuordnet (wobei für den IE die Sondersyntax bei input-Feldern zu beachten ist)

katy

PS: dein span ist komplett überflüssig, gib die ID dem umgebenden td und lass das sinnlose und an dieser Stelle unzulässige name-Attribut weg.

Antwort 8 von Uesch vom 07.01.2021, 22:57 Options

Hey, danke für eure Antwort. So wie Katy mein Problem beschrieben hat, ist es richtig. Die Inhalte werden beim Senden nicht mit gesendet.

Was meinst du damit, dass ich in Formularelemente die DOM-Methoden einfüge? Unter DOM-Methode würde ich sowas verstehen wie "getElementById" oder "getElementsByName" verstehen. Meinst du, dass die Formulardaten nicht korrekt übertragen werden, liegt daran, dass der Browser die Formularelemente nicht genau zuordnen kann?

Ich verstehe nicht ganz, wo ich diese DOM-Methode anwenden soll?

Antwort 9 von katy vom 08.01.2021, 06:43 Options

Hallo Uesch,

DOM ist bei weitem mehr als ID und name. Mit document.createElement erstellst du neue Elemente, über options kannst du ein so erschaffenes select-Feld füllen. Zu dem IE-Bug kannst du dich hier belesen im Forum-SelfHTML.

katy

Antwort 10 von Uesch vom 08.01.2021, 13:56 Options

Aber wie kann ich diese DOM-Methode verwenden, um das Ajaxproblem zu lösen? Ich würde sagen, die DOM-Methode ist nützlich, wenn man das ganze mit Javascript lösen möchte, oder?

Antwort 11 von katy vom 08.01.2021, 16:14 Options

Hallo Uesch,

schau dir dies an: AJAX und JSON

katy

Antwort 12 von Uesch vom 08.01.2021, 19:41 Options

Ist das wirklich der "normale" Weg, um eine Variable im Formular verfügbar zu machen?

Gibt es nicht etwas leichteres? Weil da muss ich mich ja richtig in neue Materie einlesen, soweit ich das gerade gelesen habe. Mit Javascript habe ichs leider eh nicht so.

Antwort 13 von son_quatsch vom 09.01.2021, 08:27 Options

Vielleicht willst Du auch mal hier einen Blick reinwerfen: http://www.xajax.de/

Antwort 14 von katy vom 09.01.2021, 18:24 Options

Hallo Uesch,

es ist dies der normale Weg bei derartigen Problemstellungen, wie du sie wohl hast.

Allerdings würde ich von der Implementierung von AJAX ohne profunde JavaScript-Kenntnisse deuitlich abraten.

katy

Antwort 15 von Uesch vom 07.02.2021, 03:39 Options

So, ich habe es hinbekommen.

Für alle, die das gleiche Problem haben: Es lag an dem <doctype>. Ich hatte

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

geschrieben. Sobald ich es durch

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">

ersetzte, hat es wunderbar funktioniert.
Ich kann zwar nicht erklären, warum, aber immerhin geht es jetzt.

Vielen Dank nochmal an alle!

Antwort 16 von son_quatsch vom 09.02.2021, 10:48 Options

Shotgun-Debugging nennt man sowas

Hinweis

Diese Frage ist schon etwas älter, Sie können daher nicht mehr auf sie antworten. Sollte Ihre Frage noch nicht gelöst sein, stellen Sie einfach eine neue Frage im Forum..

Neue Einträge

Tipp einschicken

News einschicken