Formular mit 5x7 RadioButtons, 2 Abhängigkeiten, Idee gesucht

[Mike Rofon]

Folgende Aufgabe:

Ich habe 5 Plätze für die Darstellung von Bildern
also <img src=... name=bild1> bis bild5.

und ich habe 7 Quellen, wo die Bilder herkommen könnten.
Jede Quelle darf innerhalb der 5 Bildplätze nur 1x vorkommen.
Jedem Bildplatz muß eine Quelle zugewiesen sein. 2 Quellen gehen also "leer" aus, bekommen keinen Platz.

Ich möchte diese Zuweisung erstellen. Dachte dabei an ein Formular mit 7x5 = 35 Radiobuttons
In jedes Tabellenfeld quasi 1 RadioButton...

	Quelle1	Quelle2	Quelle3	Quelle4	Quelle5	Quelle6	Quelle7
Platz1
Platz2
Platz3
Platz4
Platz5

RadioButtons gruppieren sich ja über das name= Atribut, also könnte ich die Quelle 1 mit 5 Buttons zu einem der Plätze zuweisen,
Aber wie verhindere ich dann, wenn ich Quelle 1 auf Platz 1 zuweise, daß ich Quelle2 AUCH auf Platz 1 klicken kann? Bzw. wie bewirke ich, dass dann Quelle1 NICHT mehr auf Platz1 zugewiesen ist?
Andersrum wär es dasselbe: Also die Radiobuttons zeilenweise gruppieren... dann müßte ich abfangen können, daß Platz 2 auf Quelle 2 geklickt wird, wenn schon Platz1,3,4oder5 auf Quelle 2 steht.
Hat jemand ne Idee wie man das machen könnte? Und sind Radiobuttons überhaupt das geeignete Mittel der Wahl? Was gibts denn noch?

MfG
Mike

 

[Sempervivum]

Ich denke schon, dass Radiobuttons das Mittel der Wahl sind. Und ich denke, dass Du Javascript brauchen wirst, um die Abhängigkeit für die jeweils andere Dimension zu realisieren.
Also wenn Du 7 Radiobuttons in einer Gruppe für die erste Zeile, Platz 1, vorsiehst, und der Benutzer wählt z. B. Quelle 3 aus, müsstest Du Quelle 3 in den verbliebenen Zeilen deaktivieren, z. B. indem Du das disabled-Attribut für die betr. Buttons setzt.

 

[ComFreek]

Möglicherweise sind andere Eingabeformen UX-mäßig besser. Wie wäre es mit einer Liste an Quellen und fünf Plätzen, wo man die Quellen per Drag & Drop hinziehen kann? Und wenn du eine Quelle auf eine andere droppst, dann fragt es dich, ob du sie tauschen oder nur ersetzen möchtest.

 

[Mike Rofon]

Ich hatte es mir schon gedacht. Für diese Sache muß ich nen Riesen Javascript-Ballon aufblasen. Irgendwo (kein Plan mehr wo) hatte ich mal was ähnliches gesehen, da gibts auch n Spezialbegriff dafür, sowas wie Kreuzschiene...

...und der Benutzer wählt z. B. Quelle 3 aus, müsstest Du Quelle 3 in den verbliebenen Zeilen deaktivieren, z. B. indem Du das disabled-Attribut für die betr. Buttons setzt.

Ja, das könnt ich mir vorstellen, die Frage wär nur, wie und unter welchen Bedingungen das das disabled wieder freigibt um Quelle 3 woanders zuzuweisen, weil 1x geklickt isses ja fix...

Nee aber für diese eine Sache, die eh nur ich bediene... das is mir dann zuviel Aufwand. Da gibts wichtigere Baustellen, die auch weniger Entwicklungszeit erfordern als die, die ich für dieses JS brauchen würde.
@Sempervivum und @ComFreek : Danke für Eure Einschätzungen.

 

[basti1012]

Ich hatte es mir schon gedacht. Für diese Sache muß ich nen Riesen Javascript-Ballon aufblasen.

Nee.

Link zur Lösung


Das kannst du ohne probleme auf 5 X 7 aufstocken

 

[basti1012]

Das sollte deiner Skizze aus post 1# schon näher kommen

Link zur Lösung

 

[Mike Rofon]

Nee.
https://codepen.io/basti1012/pen/eYpbXWd?editors=1010
Das kannst du ohne probleme auf 5 X 7 aufstocken

Das ist im Prinzip genau das was ich mir vorgestellt hatte. Hammer, daß das so simpel zu machen ist. Wenn man weiß wie.

Das sollte deiner Skizze aus post 1# schon näher kommen

Die Lösung mit den Radiobuttons reicht völlig, und ja, das Aufstocken sollte ich hinbekommen.
Variante 2 muß gar nicht
Diese "Skizze" hab ich nur so gemacht, weil ich veranschaulichen wollte, um was es mir geht. Is ja nie so einfach, anderen seine wirren Code-Fantasien zu erklären, wenn man selber nich klarkommt


Bleibt das bei Codepen stehen, oder sollte ich mir das runterladen?

 

[basti1012]

Ich hatte auch erst gedacht das es schwerer ist.
Nachdem ich das richtige Google Wort zum suchen rausgefunden habe gab es mehrere Beispiele.
Daraus habe ich dann eine einfache Version erstellt.

Bleibt das bei Codepen stehen, oder sollte ich mir das runterladen?

Das bleibt so , das kannst du auch Tage später noch anschauen