Javascript Funktion aufrufen

guten morgen zusammen,

ich probiere seit einiger Zeit ein Panel via Javascript auf visible zu setzen.
das javascript ist ausgelagert in eine .js datei.
die funktion sieht so aus

function SetPanelVisible(_id) {
    var panel = document.getElementById(_id);
        panel.style.display = (panel.style.display == 'none') ? 'inline' : 'none';
}

aufgerufen wird sie durch

_RadioButton.ID = _RadioButton.ClientID;
_RadioButton.Attributes.Add("margin", "0px");
_RadioButton.Attributes.Add("OnClick", "SetPanelVisible("+ _RadioButton.ClientID +")");

im web developer sehe ich das div mit der Id von Panel. Aber bekomme immer ein Fehler.
Was ich noch gesehen habe beim debuggen ist dass _RadioButton.ClientID null ist.
Kann es an dem liegen?

Fehler ist : Object Expected

Gruss
w1z4rd

_RadioButton.ID = _RadioButton.ClientID;  
  

Sorry, dass ich das so hart sage, aber: kompletter Unfug, der einen Hinweis darauf gibt, dass du immer noch das Problem hast, zwischen serverseitigem und clientseitigen Code zu unterscheiden.

Leute, gewöhnt euch ab, in Javascript Objekte über die ID zu übergeben....

function togglePanelVisibility(panel) {
        panel.style.display = (panel.style.display != 'none') ? 'none' : '';
}

_RadioButton.Attributes.Add('onclick', 'togglePanelVisibility(this)');

Merke: * onclick als Javascript-Eventhandler wird komplett klein geschrieben.

• Überprüfungen IMMER auf den nicht-default-Zustand (!= 'none')
• Rücksetzen nicht durch Angabe von "inline", sondern eben zurücksetzen (leerer String)
• Javascript-Methoden beginnen mit kleinen Buchstaben

LaTino

Hallo LaTino,

Danke für deine Antwort. Wenn ich das so mache wie du hier schreibst mit "this" verschwindet das RadioButton.

Mir ist noch nicht ganz bewusst wie mein Panel ansprechen kann. In meinem C# Code habe ich zwei Panels erstellt

_panPanel1 = new Panel();
_panPanel1.ID = "Panel1";
this.Controls.Add(_panPanel1);
_panPanel1.Style.Add("display", "none");

_panPanel2 = new Panel();
_panPanel2.ID = "Panel2"
this.Controls.Add(_panPanel2);
_panPanel2.Style.Add("display", "none");

du schreibst ja man soll sich abgewöhnen über die ID zu übergeben, wie soll ich den das am besten machen? Irgendwie muss ich meinem Javascript ja sagen er soll das Panel1 oder das Panel2 visible oder hidden machen.

Gruss und Danke
w1z4rd

Ich habe keine Ahnung, was du tun moechtest. Hätte die ID-Übergabe so geklappt, wie du sie vor hattest, wäre dasselbe passiert.

Sagen wir es einfach mal mit einem Filmzitat: ich bin der Client, du bist der serverseitige Code, und siehst, wie ich dein "Panel" verschwinden lasse. Wie, fragst du?

There is no panel.

Nein, ehrlich nicht. HTML kennt kein Panel. Da ist keines. Auch, wenn dein serverseitiger Code glaubt, dort wäre eins. Ich als Client habe keine Ahnung, was das "Panel", das du verschwinden lassen möchtest, ist. Gib mir das konkrete DOM-Element, das weg soll, und dann kann ich arbeiten.

Ich würde dir vorschlagen, dass du den generierten HTML-Code deiner aspx-Seite mal genau anschaust, damit du dich in die Rolle des Clients versetzen kannst. Dann weisst du auch, welches Element nun eigentlich weg soll.

LaTino

was ist den das was ich in der webdeveloper toolbar sehe?

ctl00_col3Content_PlaceHolderMain_CreateNewsControl_Panel1

diese sehe ich im gerendereten code. Panel1 ist ja genau die ID von meinem Panel das ich erstellt habe.

Oder besser gefragt, wie soll ich den das lösen? Ich möchte einfach zwei Panels haben und mit javascript diese jeweils auf hidden oder auf visible setzen.

Gruss
w1z4rd

wenn ich das der funktion übergebe

ctl00_col3Content_PlaceHolderMain_CreateNewsControl_GhqPanel

funktioniert es. Aber ist das die einzige Lösung? Ich möchte das nicht fix als String übergeben.

Gruss

Oder besser gefragt, wie soll ich den das lösen? Ich möchte einfach zwei Panels haben und mit javascript diese jeweils auf hidden oder auf visible setzen.

Ich glaube, das habe ich schon geschrieben: HTML kennt keine Panels.

a) Identifiziere das Element, das die Aktion auslösen soll
b) Identifiziere die Elemente, die von der Aktion betroffen sein sollen
c) Übergib die Elemente aus b) der Javascript-Methode, die durch die Aktion in a) ausgeführt wird

Was ist daran so schwer zu verstehen?

EDIT: Zum zweiten Posting: auch das habe ich schon geschrieben. Mit Übergabe von IDs zu arbeiten ist eine schlechte Lösung. Übergib Referenzen auf die DOM-Knoten.

LaTino

Hallo w1z4rd2003,

wenn du dennoch auf die ID zugreifen willst, dann musst du sie in 'dein_panelId' oder "dein_panelId" packen, denn sonst funktioniert dein Javascript nicht. Schau doch mal den HTML-Code im Browser an; es fehlen die Umklammerung des Argument im Aufruf der Funktion SetPanelVisible. Andererseits, .getElementXXXX mag bequem sein, sie sind aber sehr langsam und ein Resourcefresser. Man soll sie nur einsetzen, wo es absolut nicht anders geht.

Ein Panel, dass, so wie Du es serverseitig einfügst, ergibt dann clientseitig ein div.