django, checkboxen wertübergabe

[Susanne]

Hallo zusammen,

ich bin gerade dabei Python und django zu erlernen, was auch sehr gut mit der Website: https://www.djangoproject.com/ funktioniert. Allerdings bin ich jetzt am Ende.

Mein Programm sieht wie folgt aus:

Code: Alles auswählen

{% block content %}
</style>   
    <table id="kontakttable" border="1" rules="cols" class="datatable" style="width: 100%; empty-cells: show">
			<thead>
				<tr>
				  <th></th>   
                  <th>Name</th>                                                       
				</tr>
			</thead>

			<tbody>
				{% for Kontakt in Kontakte %}	
                     <td style="width: 20px">
							<input class="chbox" type="checkbox" id="checkbox_export_" name="checkbox_export_{{ Kontakt.Name }}" {% if export.checkbox_selected %}checked="checked"{% endif %}/>
						</td>
                            <td>{{ Kontakt.Name }}</td>
							</td>
					</tr>
				{% endfor %}
                
			</tbody>
		</table>

        <input	
	      class="button" id ="export" type="submit" value="export" 
          onclick="checkbox_export_.disabled='1';">
	    </input>
{% endblock %}

Es handelt sich um eine Tabelle mit 2 Spalten. In der ersten Spalte wird eine Checkbox je Eintrag generiert. In der zweiten Spalte stehen die Namen der Kontakte. Der Datenbankzugriff funktioniert ohne Probleme, d.h. alle werte die in der Datenbank vorhanden sind werden ausgelsen und angezeigt. Pro Namen wird eine checkbox generiert.

Die checkboxen können angeklickt werden. Nachdem ich den Button "Export" gedrückt habe sollte der entsprechende Namen in ein .txt - File geschrieben werden. Außerdem wird beim klicken auf den Button "Export" die checkbox grau hinerlegt, sodass nur einmal der Name exportiert werden kann.

Bisher ist es so, dass wenn ich auf den Button "Export" klicke immer nur die erste checkbox in der Tabelle ausgegraut wird.

ich würde aber gerne die ausgrauen, die ich auch ausgewählt habe.
Ich denke, dass ich an dieser Zeile was falsch mache:

Code: Alles auswählen

 {% if export.checkbox_selected %}checked="checked"{% endif %}

die checkboxen haben auch alle eine andere ID, nämlich die des Namens. Leider funktioniert meine Auswahl noch nicht.
Wie kann ich der html checkbox sagen, dass ich den Name: "XXXX" ausgewält habe und nachdem ich den Button betätigt habe auch diese ausgegraut wird

vielen Dank im voraus

[BlackJack]

@Susanne: Ich glaube das hatten wir schon einmal: `id`-Attribute müssen eindeutig sein. Die sind dazu da genau *ein* Element zu *id*entifizieren, darum darf es jeden `id`-Wert auch nur *einmal* im HTML-Dokument geben.

Wenn Du bei `onclick` mehrere Elemente verändern willst, dann wirst Du etwas mehr JavaScript-Quelltext schreiben müssen. Zum Beispiel welchen der aus der Tabelle alle Checkboxen durchgeht und die deaktiviert, die ein Kreuzchen gesetzt haben. jQuery kann hier recht nützlich sein.

Der Template-Quelltext der über das vorhandensein des `checked`-Attributs entscheided ist etwas merkwürdig, weil dort für jeden Eintrag der selbe Wert zugrunde gelegt wird. Damit sollten entweder immer alle Kreuzchen gesetzt werden, oder gar keines.

[Susanne]

Hallo nochmals,

Das mit dem jacascript weis ich.
ich würde aver dennoch einfach anfangen und nur die checkbox ausgrauen die ich auch angewählt habe.
Meine ids sind schon eindeutig. Das kann ich mithilfe des firebugs erkennen.

[lunar]

@Susanne In diesem Quelltext können die IDs nicht eindeutig sein, denn Du erzeugst in einer Schleife Elemente mit konstanter ID. Sowie in "Kontakte" mehr als ein Kontakt vorkommt, gibt es die ID "checkbox_export_" doppelt.

[Susanne]

Hallo nochmals,

ich hab den Code unten nun erweitert allerdings ohne Erfolg. Jetzt müsste es eigentlich klappen, macht es aber nicht, haber vorher schon alles versucht, war wahrscheinlich ein copy-Paste Fehler

Code: Alles auswählen

 onclick="checkbox_export_{{ Kontakt.Name }}.disabled='1';">

Code: Alles auswählen

{% block content %}
</style>   
    <table id="kontakttable" border="1" rules="cols" class="datatable" style="width: 100%; empty-cells: show">
         <thead>
            <tr>
              <th></th>   
                  <th>Name</th>                                                       
            </tr>
         </thead>

         <tbody>
            {% for Kontakt in Kontakte %}   
                     <td style="width: 20px">
                     <input class="chbox" type="checkbox" id="checkbox_export_" name="checkbox_export_{{ Kontakt.Name }}" {% if export.checkbox_selected %}checked="checked"{% endif %}/>
                  </td>
                            <td>{{ Kontakt.Name }}</td>
                     </td>
               </tr>
            {% endfor %}
               
         </tbody>
      </table>

        <input   
         class="button" id ="export" type="submit" value="export"
          onclick="checkbox_export_{{ Kontakt.Name }}.disabled='1';">
       </input>
{% endblock %}

[BlackJack]

@Susanne: Die `id`\s sind immer noch für alle Kontakte gleich. Und die Änderung am `onclick`-Wert macht keinen Sinn. Wie bist Du denn darauf gekommen? Was hast Du Dir dabei gedacht?

[Susanne]

Die sind doch nicht gleich?!

Wie muss es dann richtig heißen?

[BlackJack]

@Susanne: Natürlich sind die gleich. Die Checkbox für jeden Kontakt bekommt bei Dir die ID `checkbox_export_`. Du hast anscheinend falsch geraten was und wo geändert werden muss. Wild herum raten und hoffen das es irgendwie funktioniert, funktioniert nicht wirklich gut und hat nicht viel mit Programmieren zu tun.

[Susanne]

Ich will auch nicht raten.
aber ich weiß auch nicht wie es richtig geht.
An einem kleinen Gedankenstoß, wäre ich sehr interessiert
in welcher Zeile liegt den der Fehler?

[Sirius3]

Wenn Du nicht raten willst, hilft vielleicht lesen:
Deine Checkboxen haben ja alle einen eindeutigen Namen, aber die gleiche ID
Dein Javascript-Code spricht im übrigen auch den Namen an, und nicht die ID.
Aber die Variable Kontakt wird dort außerhalb der for-Schleife benutzt.
Wie Blackjack schon geschrieben hat, kommst Du um ein wenig Javascript nicht rum.
Am wenigsten mit jquery:

Code: Alles auswählen

$(':checked').attr('disabled','1');

PS: einen block content mit </style> zu starten läßt einen weiteren Designfehler vermuten.

PPS: so wie Du "checkbox_export_{{ Kontakt.Name }}.disabled='1';" schreibst seh ich schon
die erste riesengroße Sicherheitslücke in Deiner Web-Seite, da jeder, der einen Namen
vergeben kann auch beliebigen Java-Script-Code mit den Rechten Deiner Seite ausführen darf.
Niemals externe Daten ungefiltert als Javascript-Code einfügen (HTML-Tags werden ja
automatisch gefiltert)

[sparrow]

Schau dir mal den HTML-Code an der so generiert wird.
Außerdem vergibst du ja verschiedene "name"-Attribute. Warum machst du das nicht auch so mit dem "id"-Attribut?