Frage zu JQuery

Sternchen10 · 30.01.2012

Liebes Forum,

ich erzeuge mit JQuery und Ajax neue Zeilen in einer Tabelle. Die Tabelle enthält in der ersten Spalte einige Icons, die wiederum an Events gebunden sind. Diese Events habe ich mit live notiert. Das funktioniert ganz gut. Das live werde ich im nächsten Schritt durch on ersetzen.

Jetzt zu meinem Problem;

Wenn die so erstellte Tabellenzeile Elemente wie etwa das Formular "AktorenForm" enthält, kann ich auf diese nicht zugreifen.

Beispiel:
$(".saveButton").live("click",function(){
var Zeile = $(this).attr("Zeile") ;
$Akt = $(this).attr("akt") ;
var key = $(this).attr("id") ;

var form = $('#AktorenForm');
var data = form.serialize();
alert(data);

Das Event wird beim Click auf ein Icon der Klasse saveButton aufgerufen, die Variable "data" bleibt leer. Wenn sich das Event auf Zeilen bezieht, die bei Erstellung des DOMs bereits vorhanden waren, funktioniert das Ganze.

Was mache ich falsch? Gibt es eine "live-Syntax" für das Ansprechen von Objekten? Hoffentlich habe ich mich verständlich ausgedrückt und alle notwendigen Infos gegeben.

Danke für eure Mühe

Duddle · 30.01.2012

AW: Frage zu JQuery

http://docs.jquery.com/Frequently_A...event_work_on_a_new_element_I.27ve_created.3F

Duddle

Sternchen10 · 30.01.2012

AW: Frage zu JQuery

Danke für die Antwort

Ich bin nicht sicher, ob ich meine Frage gut formuliert habe. Das Problem ist nicht das Binden der Icons an einen Eventhandler, das klappt gut. Das Problem liegt darin, dass das Formular, das ich als Ajax-Reponse mit php erstellt und in der Callbackfunktion in die Zeile geschrieben habe, vom Eventhandler nicht gefunden wird. Die Variable data (s. Frage) bleibt leer.

Der Link beschäftigt sich meiner Meinung nach mit dem Binden von Events.

Habe ich was übersehen oder falsch verstanden??? Soll ich mal Hardcopies oder Code posten??

Duddle · 30.01.2012

AW: Frage zu JQuery

Da habe ich mich wohl etwas verlesen. Um sicherzustellen, dass ich es jetzt richtig verstehe, habe ich das Prinzip mal bei mir nachgestellt.

foo.html

HTML:

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

<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>Sternchentest</title>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
		<script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" language="javascript" charset="utf-8">
		    $(document).ready(function() {
			$.get('ajaxdatei.txt', function(data) {
			    $('#start').html(data);
			    alert($('#ajaxinhalt').html());
			});

		    });
		</script>
	</head>

	<body>
	    <div id="start">
		start
	    </div>	
	</body>
</html>

ajaxdatei.txt

HTML:

<p id="ajaxinhalt">ich bin ajaxdatei</p>

Hier lädt die .html-Datei neue Inhalte per AJAX und fügt sie in den DOM-Baum ein. Dann wird ein Knoten dieser neuen Inhalte ausgewählt und benutzt.
Bei mir funktioniert dieser Beispielcode wie erwartet. Falls das Prinzip also das gleiche ist und es dennoch nicht funktioniert, solltest du wohl mal ein relevantes Code-Schnippselchen zeigen.

Duddle

Sternchen10 · 30.01.2012

AW: Frage zu JQuery

Hier mein code:

Aufruf der php-Datei, die das Formular generiert:
$(".openerEditZeile").click(function(){
var Zeile = $(this).attr("Zeile") ;
var DB_ID = $(this).attr("DB_ID") ;
data="";
$pageToLoad="/cgi-bin/hc6/allgemein/MakeInputZeile.php?DB_ID="+DB_ID;
$.get($pageToLoad,data,function($response){
$("#MyInfoDiv").html("Daten geaendert");
alert($response); // Response ist ok. Formular hat Eingabefelder
$(Zeile).html($response); // Ersetzen der Ausgabezeile in der Tabelle durch Eingabeformular
//$(Zeile).replaceWith($response); / funktioniert nicht
});
});

So wir die Formularzeile in php generiert:

$htmlZeile = "";
$htmlZeile .= "<form id=\"AktorenForm\" name=\"AktorenForm\" method=\"POST\" >\n";
$htmlZeile .= "<td class=\"aktoff\" height=\"22\" width=\"160\" style=\"text-align:left\">";

//$htmlZeile .= "<a href=\"$cfg_cgiPfad/aktoren/aktoren.cgi?Aktion=cancel&Funktion=$FunktionID&Aktor=$Edata[0]\">";

$htmlZeile .= "<img border=\"0\" width=\"16\" height=\"16\" src=\"$cfg_IconPath/cancel.png\" title=\"alter Zustand \"></a>";

$htmlZeile .= " ";

$htmlZeile .= "<img id=\"update\" Zeile=\"#Zeile-".$Zeile['AktorNr']."\" Akt=\"".$Zeile['AktorNr']."\" width=\"16\" height=\"16\" class=\"saveButton\" name=\"update\" title=\"Datensatz speichern\" src=\"/hc6/Images/16x16/save2.gif\"></td>\n";
$htmlZeile .= "<td class=\"aktoff\" height=\"22\" width=\"50\" style=\"text-align:left;padding-left: 0;\"> <input type=\"text\" class=\"Eingabefeld\" name=\"AktorNr\" value=\"".$Zeile['AktorNr']."\" style=width:25px></td>\n";

Den Zugriff auf das Formualar habe ich in meiner Frage in rot dargestellt.

Was mache ich falsch
Danke im vorraus für jede Antwort.

Duddle · 30.01.2012

AW: Frage zu JQuery

Gibt es das irgendwo live zu sehen? Falls nicht / es intern läuft, würde ich wohl mal mit Firebug nach Fehlern suchen. Auf den ersten Blick sieht es korrekt aus.

Duddle

fexx · 31.01.2012

AW: Frage zu JQuery

Wirft die Konsole Fehler?

Sternchen10 · 31.01.2012

AW: Frage zu JQuery

Danke für deine Mühe. Natürlich läuft die Anwendung local und steuert meine Haustechnik. Ich bin aber sehr an einer Lösung für mein Problem interessiert und würde dir einen Internetzugang für eine begrenzte Zeit freischalten. Sag mir wann du Zeit hast und ich richte alles ein. Allerdings möchte ich die Zugangsdaten nicht unbedingt in das Forum schreiben. Geht das per EMail oder Telefon?

Sternchen10 · 31.01.2012

AW: Frage zu JQuery

Hallo fexx,

ich sehe deine Frage erst jetzt, sorry.

Nein, es gibt keine Fehler in der Firefox-Fehlerkonsole.

Sternchen10 · 31.01.2012

AW: Frage zu JQuery

Vielen Dank an alle, die mir geholfen haben das Problem zu fixen.
Es lag tatsächlich an der Notierung des Formulars in der Zeile. Ich habe jetzt in die Tabellenzeile ein Formular - Tabelle - Zeile - Spalten eingefügt und entsprechend wieder geschlossen. Jetzt ist die Darstellung im Firebug wie gewohnt und alles klappt.
Nochmals Vielen Dank und bis zum nächsten Problem.