onchange wird als Attribut nicht übernommen

[Chris]

Hallo zusammen,

ich beschäftige mich als Neuling mit einer Oberfläche zur Eingabe von (Angebots-)Daten. Da ich vorher nicht weiss, wieviele Positionen das Angebot hat, soll sich das Formular dynamisch erweitern lassen.

Das HTML-Gerüst enthält einen am Anfang fast leeren table, der z.B. den 'Absenden'-Button enthält.
Über einen weiteren Link hat der Benutzer die Möglichkeit, eine (weitere) Position in das Formular einzufügen.
Ja nachdem, welche Angaben im Formular angeklickt werden (über select, checkbox, radiobutton) werden neue Werte berechnet.
Dazu ist es ja meines Wissens nötig, dass ich die onchange bzw. onclick-Attribute setze.
Da die Erweiterung des Formulars über JavaScript geschieht, muss ich auch dort die neuen Elemente mit den entsprechenden Attributen versorgen.
Mein Problem: die Attribute für onclick oder onchange werden einfach nicht übernommen (auch Firebug zeigt sie nicht an), womit das Formular seine komplette Funktionalität verliert.
Ach so, das ganze HTML ist in Perl gehalten/eingebettet.

Beispiel-JavaScript-Code:

print $cgi->start_html(-title=>"Angebotsformular", -script=>'
function test()
{
 alert('Aufruf Test!!!');

var tbody = document.getElementById('Angebote').getElementsByTagName('tbody')[0];
 var row = document.createElement('tr');
 var td = document.createElement('td');

var vali = document.createElement('input');
 vali.type = 'checkbox';
 vali.id = 'vali';
 vali.onclick = 'calc();'; //Diese Zeile wird nicht berücksichtigt.
 td.appendChild(vali);

row.appendChild(td);
 tbody.appendChild(row);
}
function calc()
{
 alert ('Aufruf calc!!! ');
}
');

Hoffe, es hat jemand einen guten Hinweis parat!
Viele Grüße,
Christian

[molily]

Hallo,

Event-Handler solltest du immer so registrieren:

element.onevent = funktion;

Das heißt

vali.onclick = calc;

Das Setzen als Attribut, indem man onclick einen String zuweist, ist nicht so zuverlässig. (Geht zur Not mit setAttribute, funktioniert dann aber nicht in allen Browsern.)

Mathias

[Chris]

Hallo Mathias,

herzlichen Dank,

das scheint es gewesen zu sein.
Was mache ich aber dann, wenn ich der Funktion Parameter mit übergeben möchte?

Christian

Hallo,

Event-Handler solltest du immer so registrieren:

element.onevent = funktion;

Das heißt

vali.onclick = calc;

Das Setzen als Attribut, indem man onclick einen String zuweist, ist nicht so zuverlässig. (Geht zur Not mit setAttribute, funktioniert dann aber nicht in allen Browsern.)

Mathias

[molily]

Hallo,

Was mache ich aber dann, wenn ich der Funktion Parameter mit übergeben möchte?

Welche willst du ihr denn übergeben?

In der Event-Handler-Funktion hast du Zugriff auf das Event-Objekt sowie auf das Element, dessen Handler ausgelöst wurde.

function calc (e) {
   e = e || window.event;
   alert(e); // Eventobjekt
   alert(this); // Elementobjekt
}

Darüber lässt sich das meiste machen und oft sind keine Parameter notwendig. Wenn doch, nutzt man etwa:

vali.onclick = function () { calc(1, 2, 3); };

Die Parameter können auch lokale Variablen der Funktion sein, in dem diese Anweisung notiert ist:

function starteEventÜberwachung () {
   var parameter = "irgendwas"
   var vali = ...;
   vali.onclick = function () { calc(parameter); };
}

Einfach mal eine Woche hier mitlesen oder im Archiv suchen, dann lernt man solche Grundlagen. :)

Mathias