• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

[FRAGE] Andere Checkboxen werden gesetzt - Wert aber nicht übergeben

H

hejo

New member
Hallo zusammen!

Ich bin JavaScript-Neuling der eigentlich aus der ABAP-Welt stammt. Ich hoffe ihr könnt mir helfen.
Mein Problem ist folgedes:
Ich habe eine Checkbox gs_partner-yksi_dataproc, die, wenn man sie deselektiert, die anderen Checkboxen (hier gs_partner-yblock_mail) auch deselektieren soll. Das mache ich derzeit mit
document.getElementsByName('gs_partner-yblock_mail')[0].checked = false;
Zwar wird die Checkbox an der Oberfläche deselektiert, wenn ich mein Formular jedoch absende, wird der neue Wert nicht gesetzt, meine Struktur hat also beim Absenden noch den alten Wert. Mir ist nicht ganz klar wie ich hier vorzugehen habe. Habt ihr mir ein Codesnippet oder einen Ansatz wie ich vorzugehen habe?

Dank & Gruß

HTML: 
<td class="column3"> </td>
<td class="column_sep"> </td>
      
<td class="column1">Data Processing (Dealer)</td>
      
<td class="column2cb">
      <input id="X" name="gs_partner-yksi_dataproc" type="checkbox" value="X"
      tabindex="238.0 "
      
      checked
      
       onClick="
        var sibling = this.nextSibling;
        while(sibling.tagName == null || sibling.id != 'SPACE') sibling = sibling.nextSibling;
        if(this.checked == false){
         sibling.checked = true;
        document.getElementsByName('gs_partner-yblock_mail')[0].checked = false;
        }
        else {
        sibling.checked = false;
        }

        ">
      <input id="SPACE" name="gs_partner-yksi_dataproc" type="checkbox" value=""
      tabindex="238.0 "
      
      >
</td>

...

<td class="column2cb">
      <input id="X" name="gs_partner-yblock_mail" type="checkbox" value="X"
      tabindex="240.0 "
      
      checked
      
       onClick="
      var sibling = this.nextSibling;
      while(sibling.tagName == null || sibling.id != 'SPACE') sibling = sibling.nextSibling;
      if(this.checked == false) sibling.checked = true;
      else sibling.checked = false;
      ">
      <input id="SPACE" name="gs_partner-yblock_mail" type="checkbox" value=""
      tabindex="240.0 "   
      >
</td>
 
Zuletzt bearbeitet:
Hi, da sich keiner von den Admins gemeldet hat mache ich mal den Anfang.

In einem Event-Handern führt man keinen Javascript Code aus man ruft eine Funktion auf
Code: 
onClick="var sibling = this.nextSibling;
besser
Code: 
 onClick="Funktion()"

Code: 
<input id="SPACE"
Eine ID (das steckt schon im Namen) ist einmalig. Space wird 2mal verwendet.

Code: 
name="gs_partner-yksi_dataproc"
Das Name-Attribut ist bei Checkboxen keine gute Idee, da ein Name-Attribut mehrmals vorkommen kann.
Bei Formularen(gehe davon aus das Du ein Formular verarbeiten willst) ist es besser mit IDs zu arbeiten, willst Du z.B. bei mehreren div's die Schriftfarbe wechseln kann auch Name verwenden werden. Denn mehre div's können denselben Namen haben.
Der Unterschied liegt auch im "S" document.getElementsByName und getElementById <- kein S.

Wenn möglich solche Namen vermeiden, „gs_partner-yksi_dataproc“.
Der Bindestich kann in JavaScript als minus Operator gezählt werden. Besser ist Unterstich oder die CamelCase Schreibweise.

Ich gehe mal davon aus das du sowas suchst:
Code: 
<!DOCTYPE html>
<html>
<head>
    <title>Box</title>
    <meta charset="UTF-8">
    <script>
        function check(form) {
            var gs_partner_yblock_mail = document.getElementById("gs_partner_yblock_mail");
            //Alle Formularelemente in fileds ablegen 
            var fields = document.forms["FormName"].elements;
            /*
             *Der Trick ist das if auf true zu stellen,
             *denn bei onklick wird gleich true uebergeben
             */
            if (form == true) {
                //schleife durch alle Elemente.
                for (var i = 0; i < fields.length; i++) {
                    fields[i].checked = true;
                }
            } else {
                //ist != true, deselektiere gs_partner_yblock_mail
                gs_partner_yblock_mail.checked = false;
            }
        }


        function auswerten() {
            var gs_partner_yksi_dataproc = document.getElementById("gs_partner_yksi_dataproc");
            var gs_partner_yblock_mail = document.getElementById("gs_partner_yblock_mail");
            //!gs_partner_yksi_dataproc.checked == false also gehe in das if
            if (!gs_partner_yksi_dataproc.checked) {
                document.getElementById("ausgabe").innerHTML = "gs_partner_yksi_dataproc wurde  nicht gesetzt."
            } else {
                document.getElementById("ausgabe").innerHTML = "gs_partner_yksi_dataproc wurde gesetzt."
            }
            if (!gs_partner_yblock_mail.checked) {
                document.getElementById("ausgabe2").innerHTML = "gs_partner_yblock_mail wurde nicht gesetzt.";
            } else {
                document.getElementById("ausgabe2").innerHTML = "gs_partner_yblock_mail wurde gesetzt."
            }
        }
    </script>
</head>

<body>
    <div id="ausgabe"></div>
    <div id="ausgabe2"></div>
    <br>
        <form name="FormName" method="post">
            <input onclick="check(this.checked)" type="checkbox" id="gs_partner_yksi_dataproc">gs_partner-yksi_dataproc
            <br>
            <input type="checkbox" id="gs_partner_yblock_mail">gs_partner-yblock_mail
            <br>
            <input type="checkbox" id="weitereBox">weitereBox
            <br>
            <input type="checkbox" id="weitereBox2">weitereBox2
            <br>
            <input type="checkbox" id="weitereBox3">weitereBox2
            <br>
            <br>
            <input onclick="auswerten()" type="button" value=Auswerten>
        </form>
</body>
</html>

In meinem Beispiel wird beim Click auf "gs_partner-yksi_dataproc" alles selektiert, beim erneuten klicken wird gs_partner-yblock_mail und gs_partner-yksi_dataproc deselektiert.
Da Du ja schon eine Programmiersprache beherrschst solltest Du es auch hinbekommen das alle Boxen deselektiert werden.

Kleine Frage:Wo hast Du eigentlich den Code her? Das riecht verdächtig nach Adobe Dreamweaver.

Kleine bitte an die Moderatoren:
Ich arbeite selten in DOM, schaut doch mal über mein geschriebenes, nicht das ich Müll schreibe.

MfG xorg1990
 
xorg1990 schrieb:
In einem Event-Handern führt man keinen Javascript Code aus man ruft eine Funktion auf
Zum Vergrößern anklicken....
Auch der Aufruf einer Funktion ist JS-Code, aber du hast Recht, dass man in Inline-Eventhandlern beeser nicht so viel Code reinpackt, sondern eine Funktion daraus macht. Macht das HTML viel lesbarer und vermeidet eine ganze Klasse von Fehlern. (In diesem Zusammenhang möchte ich noch erwähnen, dass es onclick heißt).

Die doppelten IDs (auch "X" ist doppelt vergeben) sind zwar falsch und müssen bereinigt werden, sollten dein Problem aber nicht erzeugen.

xorg1990 schrieb:
Das Name-Attribut ist bei Checkboxen keine gute Idee
Zum Vergrößern anklicken....
Dem würde ich wiedersprechen, da nur über den Namen auch die Elemente versendet werden. Der Zugriff im JS ist natürlich über (eindeutige) IDs einfacher und stabiler.

xorg1990 schrieb:
Wenn möglich solche Namen vermeiden
Zum Vergrößern anklicken....
Ich finde solche Namen auch nicht besonders schön (v.A. die Mischung von _ und -) aber ein Problem hat man dadurch im JS nicht, da es ja immer noch Schema 4 gibt.

hejo schrieb:
Zwar wird die Checkbox an der Oberfläche deselektiert, wenn ich mein Formular jedoch absende, wird der neue Wert nicht gesetzt, meine Struktur hat also beim Absenden noch den alten Wert.
Zum Vergrößern anklicken....
Dann liegt dein Problem auf der Serverseite, dass du deine Eingaben wahrscheinlich nur dann weiterverarbeitest, wenn das Feld auch im POST oder GET drin ist. Eine nicht selektierte Checkbox wird überhaupt gar nicht abgesendet.

Ich bin außerdem der Meinung, dass du dein komplettes JS weglassen kannst, wenn du Radioboxen verwenden würdest (und allen den gleichen Namen geben würdest), da die ganzen Auswahlmöglichkeiten ja exklusiv sind.

xorg1990 schrieb:
Ich arbeite selten in DOM, schaut doch mal über mein geschriebenes, nicht das ich Müll schreibe.
Zum Vergrößern anklicken....
Dafür schaut's nicht schlecht aus.
 
Hi!

Danke für eure Hilfe, leider hat es mir noch nicht den gewünschten Erfolg gebracht.
Bezüglich der Namen lässt sich folgendes Sagen. Mir ist klar, dass es nicht schön ist, allerdings wird mit dem Bindestrich in ABAP signalisiert, dass auf ein bestimmtes Feld einer Tabelle zugegriffen wird. Die Namen kann ich nicht ändern.
Das Coding habe ich ausprobiert. Erfüllt seinen Zweck in jsfiddle, füllt mir aber dennoch nicht meine Struktur. Ich denke der Fehler liegt wirklich an dem was Avatar von kkapsner gesagt hat, dass der Fehler serverseitig liegt. Ist es denn möglich auch eine nicht selektierte Checkbox mitzugeben?
Achja, Radioboxen stehen nicht zur Auswahl. Insgesamt sind es sechs Checkboxen. Theoretisch können alle selektiert werden. Nur wenn yksi_dataproc deselektiert wird, werden auch die anderen deselektiert.
 
hejo schrieb:
leider hat es mir noch nicht den gewünschten Erfolg gebracht.
Zum Vergrößern anklicken....
Hast du denn inzwischen dafür gesorgt, dass jede ID nur einmal in einem HTML Dokument vorkommt? Sonst brauchst du über den Rest nämlich garnicht nachdenken.

hejo schrieb:
Die Namen kann ich nicht ändern.
Zum Vergrößern anklicken....
OK, nicht schlimm.

hejo schrieb:
Erfüllt seinen Zweck in jsfiddle, füllt mir aber dennoch nicht meine Struktur.
Zum Vergrößern anklicken....
An welcher Stelle hast du denn jetzt genau das Problem, den Code bei dir einzufügen?

hejo schrieb:
dass der Fehler serverseitig liegt.
Zum Vergrößern anklicken....
Sowas sollte man lieber nicht vermuten sondern belegen, damit man keinem Geist hinterher jagt. Welche Fehlermeldung kommt denn? Oder was konkret passiert nicht so wie erwartet?

hejo schrieb:
Ist es denn möglich auch eine nicht selektierte Checkbox mitzugeben?
Zum Vergrößern anklicken....
Warum sollte man das tun wollen? Man könnte per JS natürlich vor dem Absenden der <form> die nicht selektierten checkboxen iterieren und daraus input type=hidden Felder machen. Aber nötig ist das m.E. in keinem Fall.

hejo schrieb:
Nur wenn yksi_dataproc deselektiert wird, werden auch die anderen deselektiert.
Zum Vergrößern anklicken....
Das ist ja eine reine JS Funktion und kann am Schluss gemacht werden, keine funktionelle Relevanz.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben