mit php erstellte Elemente Unsichtbar machen

[spec]

Hi!

Also ich such nach einer möglichkeit meine über php generierten Elemente anzusteuern.
Aber irgendwie bekomm ich egal was ich versuche nichtmal die elemente gezählt oder sonstiges :D

Ich will über das klicken einer checkbox, das dazugehörige textfeld unsichtbar machen.

Mein Problem liegt darin das ich nichts was mir so erstellte elemente auswertet.Ich bekomme immer "NULL" ausgegeben :(

  
  
<input type="checkbox" name="anwesend[]" onClick="auftauchen()" value="kundenid">  
  
<input type="text" value="kundenname" size="5" name="fehlzeit[]">  
  

Meine versuche haben damit begonnen das ich erstmal die elemente zählen wollte.

  
function auftauchen(){  
var count=0;  
var anzahl=document.form1.length  
for (i=0;i<anzahl;i++){  
if (document.getElementById("anwesend"))  
count++;  
}  
alert(count);  
}  

Doch er gibt Null aus!
Ich hab auch schon folgende schreibweisen versucht

  
if (document.getElementById("anwesend[]"))  
if (document.getElementById("anwesend" + i))  
if (document.getElementById(anwesend[]))  
if (document.getElementById('anwesend[]'))  

aber ich bin wohl aufm holzweg?!
Mal davon ab das ich eigentlich nur auf ein lebenszeichen meiner checkbox warte ist das ja garnicht das was ich eigentlich erreichen will :(

Gibt es eine function wo ich die ID des elements welches geklickt wurde bekomme?

Kommt javascript nicht mit name="anwesend[]" zurecht?
ich muss die namen so verwenden weil sie auch in php gezählt werden.

[Felix Riesterer]

Lieber spec,

vergleiche Dein HTML mit Deinem JavaScript:

<input type="checkbox" name="anwesend[]" onClick="auftauchen()" value="kundenid">

if (document.getElementById("anwesend[]"))

if (document.getElementById("anwesend" + i))
if (document.getElementById(anwesend[]))
if (document.getElementById('anwesend[]'))

  
Fällt Dir was auf?  
  
Liebe Grüße,  
  
Felix Riesterer.

-- 
ie:% br:> fl:| va:) ls:[ fo:) rl:| n4:? de:> ss:| ch:? js:) mo:} zu:)

[Vinzenz Mai]

Hallo,

Mein Problem liegt darin das ich nichts was mir so erstellte elemente auswertet.Ich bekomme immer "NULL" ausgegeben :(

<input type="checkbox" name="anwesend[]" onClick="auftauchen()" value="kundenid">
<input type="text" value="kundenname" size="5" name="fehlzeit[]">

  
in diesem finde ich \*kein\* Element, das ein id-Attribut besitzt.  
  

> Meine versuche haben damit begonnen das ich erstmal die elemente zählen wollte.  
  

> Doch er gibt Null aus!  
  
sehr verständlich und sehr richtig.  
  

> Ich hab auch schon folgende schreibweisen versucht  
> ~~~javascript
  

> if (document.getElementById("anwesend[]"))  
> if (document.getElementById("anwesend" + i))  
> if (document.getElementById(anwesend[]))  
> if (document.getElementById('anwesend[]'))  
> 

aber ich bin wohl aufm holzweg?!

ja.

Dieser Archivthread müsste Dir helfen können.

Freundliche Grüße

Vinzenz

[spec]

Freundliche Grüße

Vinzenz

SUPER thread!
Hammer Hilfe!

Ich bin jetzt soweit gekommen das ich rückgabewerte erhalte, und auch die richtigen :D!!

Ein fehler hab ich aber wohl noch.
Ich bekomme die Felder jetzt nicht unsichtbar ^^

  
  
alert("Java An");  
  
  
function test(el)  
{  
  
alert("Function call");  
  
  
        var allCheckBoxes = document.getElementsByName("anwesend[]");  
	var allTextBoxes = document.getElementsByName("fehlzeit[]");  
	var allSelectBoxes = document.getElementsByName("fehlgrund[]");  
  
        for (var i = 0; i < allCheckBoxes.length; i++)  
	{  
alert("for next");  
  
          if (allCheckBoxes[i].className == el.className)  
		{  
alert("zeile gefunden");  
		  
		var ele1 = allTextBoxes[i].className;  
		var ele2 = allSelectBoxes[i].className;  
alert(ele1)  
		ele1.style.visibility = 'hidden';  
		ele2.style.visibility = 'visible';  
          	}  
        }  
  
  
  
  
}  

es muss an diesen zeilen liegen, da alle alerts wunderbar durchlaufen.
Hab ich einen syntax fehler?? oder bin ich schonwieder volkommen verkehrt!! :D

  
ele1.style.visibility = 'hidden';  
ele2.style.visibility = 'visible';  

[EKKi]

Mahlzeit spec,

alert("Java An");

Sicher?

es muss an diesen zeilen liegen, da alle alerts wunderbar durchlaufen.

Das tut es auch: hier liest Du die Eigenschaft "className" aus und speicherst ihren Wert (normalerweise ein Stringliteral) in je einer Variablen:

  var ele1 = allTextBoxes[i].className;  
  var ele2 = allSelectBoxes[i].className;  

Und hier versuchst Du die Eigenschaften eines Unterobjektes dieser Variablen zu setzen:

  ele1.style.visibility = 'hidden';  
  ele2.style.visibility = 'visible';  

MfG,
EKKi

[spec]

Mahlzeit spec,

alert("Java An");

Sicher?

es muss an diesen zeilen liegen, da alle alerts wunderbar durchlaufen.

Das tut es auch: hier liest Du die Eigenschaft "className" aus und speicherst ihren Wert (normalerweise ein Stringliteral) in je einer Variablen:

  var ele1 = allTextBoxes[i].className;  
  var ele2 = allSelectBoxes[i].className;  

Und hier versuchst Du die Eigenschaften eines Unterobjektes dieser Variablen zu setzen:

  ele1.style.visibility = 'hidden';  
  ele2.style.visibility = 'visible';  

MfG,
EKKi

Danke für die Antwort, aber ich versteh auch durch deine "fachwörtliche" Beschreibung nicht im geringsten warum es nun nicht geht :(

Also ich versuch das falsche...
Und das heisst mit hat die class nix gebracht????
und ich kann jetzt nichts damit anfangen oder wie?!....

Ich versteh nicht ganz was du mit "Und hier versuchst Du die Eigenschaften eines Unterobjektes dieser Variablen zu setzen:"

Weil, ich will doch die Eigenschaften meines Objektes auf Hide setzen?!?!
Hast du nicht wenigstens einen tipp??? So bringt mir das gerade nix, und ich weiss auch nicht nach was ich jetzt suchen könnte :(

[spec]

bekomm ich evtl irgendwie die id über die klasse?

[spec]

bekomm ich evtl irgendwie die id über die klasse?

Ok, habs geschafft.

Und Ekki du hättest echt mal deutlich mehr schreiben können als nur meinen fehler zu Analysieren. >:/

Es gibt in javascript keine vordefinierte function um über die classe eine id zu bekommen.

Jedoch gibt es die Function unter dem namen getElementsByClass u. getElementsByClassname zum "herunterladen"...

Und darauf soll man ja von alleine kommen ne?!?! .....

[EKKi]

Mahlzeit spec,

bekomm ich evtl irgendwie die id über die klasse?

Wieso willst Du die "ID über die Klasse" bekommen? Die benötigst Du an dieser Stelle doch gar nicht.

Und Ekki du hättest echt mal deutlich mehr schreiben können als nur meinen fehler zu Analysieren. >:/

Warum? Ich bin davon ausgegangen, dass Du an spontanem "Brett-vor-dem-Kopf" leidest (wie jeder mal) - deshalb habe ich Dich auf Deinen offensichtlichen Fehler hingewiesen.

var ele1 = allTextBoxes[i].className;

Hier schreibst Du den Namen der Klasse(n), die das jeweilige Objekt im Array "allTextBoxes", besitzt, in die Variable "ele1".

ele1.style.visibility = 'hidden';

Und hier gehst Du davon aus, dass die Variable "ele1" ein Unterobjekt namens "style" besitzt und versuchst dessen Eigenschaft "visibility" zu setzen.

Offenbar willst Du die Sichtbarkeitseigenschaft eines HTML-Elements ändern. Dieses Element existiert doch im Array "allTextBoxes" - aber anstatt das Element als ganzes dort herauszuholen, liest Du nur seine Klassenzugehörigkeit aus ... warum?

Es gibt in javascript keine vordefinierte function um über die classe eine id zu bekommen.

Selbst wenn - für Deinen konkreten Fall ist das vollkommen irrelevant.

Jedoch gibt es die Function unter dem namen getElementsByClass u. getElementsByClassname zum "herunterladen"...

Und darauf soll man ja von alleine kommen ne?!?! .....

Nein, soll man nicht. Braucht man auch nicht. Wieso auch?

Was mich interessieren würde: wie sieht Deine jetzige "Lösung" aus? Ich wette um eine Kiste Bier, dass sie keine ist und man Deinen Code erheblich vereinfachen könnte.

MfG,
EKKi

[Vinzenz Mai]

Hallo,

als erstes möchte ich mich für Dein Lob für meinen verlinkten Thread bedanken.

Ok, habs geschafft.

Das ist erfreulich, aber sicherlich bist Du etwas komplizierter vorgegangen als nötig. Dazu später mehr.

Jedoch gibt es die Function unter dem namen getElementsByClass u. getElementsByClassname zum "herunterladen"...

Und darauf soll man ja von alleine kommen ne?!?! .....

hatte ich ja im verlinkten Beitrag verlinkt :-)

Dein Problem ist zwar ähnlich gelagert wie das von mir verlinkte Problem, aber doch etwas anders:

Bei Dir identifiziert jede Checkbox die zugehörige Textbox, die ausgeblendet werden soll. Jeder einzelnen Checkbox entspricht genau eine zugehörige Textbox. Deswegen kannst Du hier problemlos mit id-Werten arbeiten. (Im verlinkten Beitrag gab es zu jedem Namen mehrere Checkboxen, deswegen musste man diese klassifizieren).

Wenn wir von Deinem Codefragment ausgehen:

  <input type="checkbox"  
         name="anwesend[]"  
         onClick="auftauchen()"  
         value="kundenid">  
  <input type="text"  
         value="kundenname"  
         size="5"  
         name="fehlzeit[]">  

so kannst Du bequem jeder Checkbox-Textbox-Kombination passende id-Werte verpassen, z.B. cb4 und tb4 für die vierte Kombination.

Somit hat man eine einfache Vorschrift, wie man von der id der Checkbox zu der id der Textbox kommt: Ersetze im Wert "cb" durch "tb". Das ist das Vorgehen, das ich dort mit "arbeite mit unterschiedlichen Präfixen" gemeint habe.

Somit möchtest Du, wenn die Checkbox mit der id "cb4" angehakt wird, die Textbox mit der id "tb4" einblenden und umgekehrt beim Entfernen des Häkchens die Textbox wieder einblenden. Solches Ein- und Ausblenden findest Du häufig unter dem Suchbegriff "toggle". Verwenden wir also eine Funktion toggle(id), die den Zustand des Elementes mit der übergebenen id umschaltet:

function [link:/archiv/2010/2/t195445/#m1308116@title=toggle](id) {  
    var e = document.getElementById(id)  
    var style = e.style;  
    style.display = style.display != "none" ? "none" : "inline";  
}

Beachte molilys Hinweise zum Inhalt von style.display und baue eine Fehlerbehandlung ein.

Nun können wir das HTML entsprechend anpassen:

  <input type="checkbox"  
         id="cb4"  
         name="anwesend[]"  
         onClick="toggle('tb4')"  
         value="kundenid">  
  <input type="text"  
         id="tb4"  
         value="kundenname"  
         size="5"  
         name="fehlzeit[]">  

Das hartcodierte toggle('tb4') ist natürlich nicht das, was Du willst und wir ersetzen das tb4 durch folgende Konstruktion:

Wir beschaffen uns mit this eine Referenz auf die angeklickte Checkbox, greifen auf dessen id-Eigenschaft zu und ersetzen mit http://de.selfhtml.org/javascript/objekte/string.htm#replace@title=replace das "cb" durch "tb":

  <input type="checkbox"  
         id="cb4"  
         name="anwesend[]"  
         onClick="toggle(this.id.replace(/cb/, 'tb'))"  
         value="kundenid">  
  <input type="text"  
         id="tb4"  
         value="kundenname"  
         size="5"  
         name="fehlzeit[]">  

Das hin- und herschalten zwischen "visible" und "hidden" überlasse ich Dir gern als Übung, falls "display:none" nicht Deiner Vorstellung entspricht.

Freundliche Grüße

Vinzenz

[ChrisB]

Hi,

Und Ekki du hättest echt mal deutlich mehr schreiben können als nur meinen fehler zu Analysieren. >:/

Dieses Forum will dir Denkansätze, -anstöße liefern - es will dir nicht das Denken komplett abnehmen.

Und deine Fehler zu analysieren, wäre eigentlich auch deine Aufgabe gewesen.

Und darauf soll man ja von alleine kommen ne?!?! .....

Mit den Grundlagen, wie man sich im DOM bewegt - ja, damit kann man sich erst mal selber beschäftigen.

MfG ChrisB