Top-Themen

AppleEntwicklungHardwareInternetLinuxMicrosoftMultimediaNetzwerkeOff TopicSicherheitSonstige SystemeVirtualisierungWeiterbildungZusammenarbeit

Aktuelle Themen

Administrator.de FeedbackApache ServerAppleAssemblerAudioAusbildungAuslandBackupBasicBatch & ShellBenchmarksBibliotheken & ToolkitsBlogsCloud-DiensteClusterCMSCPU, RAM, MainboardsCSSC und C++DatenbankenDatenschutzDebianDigitiales FernsehenDNSDrucker und ScannerDSL, VDSLE-BooksE-BusinessE-MailEntwicklungErkennung und -AbwehrExchange ServerFestplatten, SSD, RaidFirewallFlatratesGoogle AndroidGrafikGrafikkarten & MonitoreGroupwareHardwareHosting & HousingHTMLHumor (lol)Hyper-VIconsIDE & EditorenInformationsdiensteInstallationInstant MessagingInternetInternet DomäneniOSISDN & AnaloganschlüsseiTunesJavaJavaScriptKiXtartKVMLAN, WAN, WirelessLinuxLinux DesktopLinux NetzwerkLinux ToolsLinux UserverwaltungLizenzierungMac OS XMicrosoftMicrosoft OfficeMikroTik RouterOSMonitoringMultimediaMultimedia & ZubehörNetzwerkeNetzwerkgrundlagenNetzwerkmanagementNetzwerkprotokolleNotebook & ZubehörNovell NetwareOff TopicOpenOffice, LibreOfficeOutlook & MailPapierkorbPascal und DelphiPeripheriegerätePerlPHPPythonRechtliche FragenRedHat, CentOS, FedoraRouter & RoutingSambaSAN, NAS, DASSchriftartenSchulung & TrainingSEOServerServer-HardwareSicherheitSicherheits-ToolsSicherheitsgrundlagenSolarisSonstige SystemeSoziale NetzwerkeSpeicherkartenStudentenjobs & PraktikumSuche ProjektpartnerSuseSwitche und HubsTipps & TricksTK-Netze & GeräteUbuntuUMTS, EDGE & GPRSUtilitiesVB for ApplicationsVerschlüsselung & ZertifikateVideo & StreamingViren und TrojanerVirtualisierungVisual StudioVmwareVoice over IPWebbrowserWebentwicklungWeiterbildungWindows 7Windows 8Windows 10Windows InstallationWindows MobileWindows NetzwerkWindows ServerWindows SystemdateienWindows ToolsWindows UpdateWindows UserverwaltungWindows VistaWindows XPXenserverXMLZusammenarbeit
GELÖST

Checkboxen auswahl begenzen

Frage Entwicklung JavaScript

Mitglied: ppmk22

ppmk22 (Level 1) - Jetzt verbinden

02.02.2011 um 00:27 Uhr, 2925 Aufrufe, 5 Kommentare

Hallo liebe Leute

Denn Codeschnippel habe ich im Netz gefunden und habe Probleme ihn für meine Bedürfnisse anzupassen.
Es sollen die Anzahl der möglichen Auswahlmöglichkeiten auf zwei bzw. auf drei begrenzt werden.
Also bei 1.1 bis 1.5 soll es zwei Möglichkeiten geben und bei 2.1 bis 2.5 sollen es drei Möglichkeiten sein.
Bin wie immer für jede Hilfe dankbar.

01.
<html> 
02.
    <head> 
03.
        <script type="text/javascript" language="JavaScript"> 
04.
            function cbLimit_1() 
05.
06.
                with(document.forms[0]) 
07.
08.
                    var cbLimit = 2; // Maximale Auswahl 
09.
                    var cbCount = 0; 
10.
                    var cbSel   = 0; 
11.
 
12.
                    /* Anzahl der Checkboxen und der ausgewählten bestimmen */ 
13.
                    for (var n = 0; n < elements.length; n++) 
14.
15.
                        if(elements[n].type.toLowerCase() == 'checkbox') 
16.
17.
                            cbCount += 1;  // ++cbCount oder cbCount++ - sieht so aber schöner aus 
18.
                            cbSel   += elements[n].checked; 
19.
20.
21.
                    /* Auswertung */ 
22.
                    for (var n = 0; n < cbCount; n++) 
23.
                        elements[n].disabled = !elements[n].checked && cbSel >= cbLimit; 
24.
25.
26.
            function cbLimit_2() 
27.
28.
                with(document.forms[0]) 
29.
30.
                    var cbLimit = 2; // Maximale Auswahl 
31.
                    var cbCount = 0; 
32.
                    var cbSel   = 0; 
33.
 
34.
                    /* Anzahl der Checkboxen und der ausgewählten bestimmen */ 
35.
                    for (var n = 0; n < elements.length; n++) 
36.
37.
                        if(elements[n].type.toLowerCase() == 'checkbox') 
38.
39.
                            cbCount += 1;  // ++cbCount oder cbCount++ - sieht so aber schöner aus 
40.
                            cbSel   += elements[n].checked; 
41.
42.
43.
                    /* Auswertung */ 
44.
                    for (var n = 0; n < cbCount; n++) 
45.
                        elements[n].disabled = !elements[n].checked && cbSel >= cbLimit; 
46.
47.
48.
        </script> 
49.
    </head> 
50.
    <body> 
51.
        <form action="" method="post" name="cbTest"> 
52.
            1.1<input type="checkbox" name="cb1_1" onClick="cbLimit_1();"><br> 
53.
            1.2<input type="checkbox" name="cb1_2" onClick="cbLimit_1();"><br> 
54.
            1.3<input type="checkbox" name="cb1_3" onClick="cbLimit_1();"><br> 
55.
            1.4<input type="checkbox" name="cb1_4" onClick="cbLimit_1();"><br> 
56.
            1.5<input type="checkbox" name="cb1_5" onClick="cbLimit_1();"><br> 
57.
            <br> 
58.
            2.1<input type="checkbox" name="cb2_1" onClick="cbLimit_2();"><br> 
59.
            2.2<input type="checkbox" name="cb2_2" onClick="cbLimit_2();"><br> 
60.
            2.3<input type="checkbox" name="cb2_3" onClick="cbLimit_2();"><br> 
61.
            2.4<input type="checkbox" name="cb2_4" onClick="cbLimit_2();"><br> 
62.
            2.5<input type="checkbox" name="cb2_5" onClick="cbLimit_2();"><br> 
63.
        </form> 
64.
    </body> 
65.
</html> 
66.
</html> 
67.
 
68.
 
Liebe Grüße
Petra
Mitglied: nxclass
02.02.2011 um 10:52 Uhr
so gehts jetzt:
01.
<html> 
02.
    <head> 
03.
        <script type="text/javascript" language="JavaScript"> 
04.
            function cbLimit_1() 
05.
06.
                with(document.getElementById('cb1')) 
07.
08.
                    var cbLimit = 2; // Maximale Auswahl 
09.
                    var cbCount = 0; 
10.
                    var cbSel   = 0; 
11.
 
12.
                    /* Anzahl der Checkboxen und der ausgewählten bestimmen */ 
13.
                    for (var n = 0; n < getElementsByTagName('input').length; n++) 
14.
15.
                        if(getElementsByTagName('input')[n].type.toLowerCase() == 'checkbox') 
16.
17.
                            cbCount += 1;  // ++cbCount oder cbCount++ - sieht so aber schöner aus 
18.
                            cbSel   += getElementsByTagName('input')[n].checked; 
19.
20.
21.
                    /* Auswertung */ 
22.
                    for (var n = 0; n < getElementsByTagName('input').length; n++) 
23.
                    	getElementsByTagName('input')[n].disabled = !getElementsByTagName('input')[n].checked && cbSel >= cbLimit; 
24.
25.
26.
            function cbLimit_2() 
27.
28.
                with(document.getElementById('cb2')) 
29.
30.
                    var cbLimit = 3; // Maximale Auswahl 
31.
                    var cbCount = 0; 
32.
                    var cbSel   = 0; 
33.
 
34.
                    /* Anzahl der Checkboxen und der ausgewählten bestimmen */ 
35.
                    for (var n = 0; n < getElementsByTagName('input').length; n++) 
36.
37.
                        if(getElementsByTagName('input')[n].type.toLowerCase() == 'checkbox') 
38.
39.
                            cbCount += 1;  // ++cbCount oder cbCount++ - sieht so aber schöner aus 
40.
                            cbSel   += getElementsByTagName('input')[n].checked; 
41.
42.
43.
                    /* Auswertung */ 
44.
                    for (var n = 0; n < getElementsByTagName('input').length; n++) 
45.
                    	getElementsByTagName('input')[n].disabled = !getElementsByTagName('input')[n].checked && cbSel >= cbLimit; 
46.
47.
48.
        </script> 
49.
    </head> 
50.
    <body> 
51.
        <form action="" method="post" name="cbTest"> 
52.
        	<div id="cb1"> 
53.
            1.1<input type="checkbox" name="cb1_1" onClick="cbLimit_1(cb1);"><br> 
54.
            1.2<input type="checkbox" name="cb1_2" onClick="cbLimit_1(cb1);"><br> 
55.
            1.3<input type="checkbox" name="cb1_3" onClick="cbLimit_1(cb1);"><br> 
56.
            1.4<input type="checkbox" name="cb1_4" onClick="cbLimit_1(cb1);"><br> 
57.
            1.5<input type="checkbox" name="cb1_5" onClick="cbLimit_1(cb1);"><br> 
58.
            </div> 
59.
            <br> 
60.
            <div id="cb2"> 
61.
            2.1<input type="checkbox" name="cb2_1" onClick="cbLimit_2(cb2);"><br> 
62.
            2.2<input type="checkbox" name="cb2_2" onClick="cbLimit_2(cb2);"><br> 
63.
            2.3<input type="checkbox" name="cb2_3" onClick="cbLimit_2(cb2);"><br> 
64.
            2.4<input type="checkbox" name="cb2_4" onClick="cbLimit_2(cb2);"><br> 
65.
            2.5<input type="checkbox" name="cb2_5" onClick="cbLimit_2(cb2);"><br> 
66.
            </div> 
67.
        </form> 
68.
    </body> 
69.
</html> 
70.
</html>
Bitte warten ..
Mitglied: nxclass
02.02.2011 um 11:35 Uhr
noch etwas gekürzt - falls du 1.000.000 weitere Tests anfügen willst:
01.
<html> 
02.
    <head> 
03.
        <script type="text/javascript" language="JavaScript"> 
04.
            function cbLimit(pnode, limit) 
05.
06.
                with( document.getElementById( pnode ) ) 
07.
08.
                    var cbLimit = limit; // Maximale Auswahl 
09.
                    var cbCount = 0; 
10.
                    var cbSel   = 0; 
11.
 
12.
                    /* Anzahl der Checkboxen und der ausgewählten bestimmen */ 
13.
                    for (var n = 0; n < getElementsByTagName('input').length; n++) 
14.
15.
                        if(getElementsByTagName('input')[n].type.toLowerCase() == 'checkbox') 
16.
17.
                            cbCount += 1;  // ++cbCount oder cbCount++ - sieht so aber schöner aus 
18.
                            cbSel   += getElementsByTagName('input')[n].checked; 
19.
20.
21.
                    /* Auswertung */ 
22.
                    for (var n = 0; n < getElementsByTagName('input').length; n++) 
23.
                    	getElementsByTagName('input')[n].disabled = !getElementsByTagName('input')[n].checked && cbSel >= cbLimit; 
24.
25.
26.
        </script> 
27.
    </head> 
28.
    <body> 
29.
        <form action="" method="post" name="cbTest"> 
30.
        	<div id="cb1"> 
31.
            1.1<input type="checkbox" name="cb1_1" onClick="cbLimit('cb1',2);"><br> 
32.
            1.2<input type="checkbox" name="cb1_2" onClick="cbLimit('cb1',2);"><br> 
33.
            1.3<input type="checkbox" name="cb1_3" onClick="cbLimit('cb1',2);"><br> 
34.
            1.4<input type="checkbox" name="cb1_4" onClick="cbLimit('cb1',2);"><br> 
35.
            1.5<input type="checkbox" name="cb1_5" onClick="cbLimit('cb1',2);"><br> 
36.
            </div> 
37.
            <br> 
38.
            <div id="cb2"> 
39.
            2.1<input type="checkbox" name="cb2_1" onClick="cbLimit('cb2',3);"><br> 
40.
            2.2<input type="checkbox" name="cb2_2" onClick="cbLimit('cb2',3);"><br> 
41.
            2.3<input type="checkbox" name="cb2_3" onClick="cbLimit('cb2',3);"><br> 
42.
            2.4<input type="checkbox" name="cb2_4" onClick="cbLimit('cb2',3);"><br> 
43.
            2.5<input type="checkbox" name="cb2_5" onClick="cbLimit('cb2',3);"><br> 
44.
            </div> 
45.
        </form> 
46.
    </body> 
47.
</html> 
48.
</html>
Bitte warten ..
Mitglied: ppmk22
02.02.2011 um 20:12 Uhr
Voll Toll Vielen vielen dank.
Bitte warten ..
Mitglied: ppmk22
06.02.2011 um 00:44 Uhr
Hallo nxclass
Das geht soweit schon ganz gut danke noch mal. Möchte Dich aber doch noch mal um Hilfe bitten.
01.
      <div id="cb1"
02.
            1.1<input type="checkbox" name="cb1_1" onClick="cbLimit('cb1',1);"><br> 
03.
            1.2<input type="checkbox" name="cb1_2" onClick="cbLimit('cb1',2);"><br> 
04.
            1.3<input type="checkbox" name="cb1_3" onClick="cbLimit('cb1',2);"><br> 
05.
            1.4<input type="checkbox" name="cb1_4" onClick="cbLimit('cb1',2);"><br> 
06.
            1.5<input type="checkbox" name="cb1_5" onClick="cbLimit('cb1',2);"><br> 
07.
        </div>
Jetzt wird durch den Funktionsaufruf bei 1.1 "eine Checkbox möglich" übergeben. Jetzt wäre es toll, wenn bei der Auswahl von 1.3 schon das Feld für 1.1 disablet werden würde, damit man jetzt nicht doch noch 1.1 auswählen kann. Hintergrund ist. z:B. Bei folgender Fragestellung:
Was ist Ihre Lieblingsfarbe?
1.1 Das möchte ich nicht beantworten.
1.2 blau
1.3 rot
1.4 gelb
1.5 grau

Wenn der User jetzt 1.1 auswählt sollte eine weitere Auswahl nicht mehr möglich sein. (geht sowei ja auch) Und wenn als erstes eine Farbe ausgewählt wird solle man 1.1 nicht mehr auswählen können. Alternativ könnte nachdem man doch aus 1.1 klickt eine eventuell vorher ausgewählte Farbe wieder disablen. Hast Du da auch eine Lösung für?

Ganz liebe Grüße
Petra
Bitte warten ..
Mitglied: nxclass
07.02.2011 um 08:09 Uhr
... ich glaube an dieser Stelle sollte überlegt werden ob man doch zu jedem Punkt ein eigenes JS schreibt oder nicht - oder besser noch: gleich eine Auswertung auf Server Seite mit AJAX.

Aber:
01.
                    /* Auswertung */  
02.
                    for (var n = 0; n < getElementsByTagName('input').length; n++)  
03.
                    	getElementsByTagName('input')[n].disabled = !getElementsByTagName('input')[n].checked && cbSel >= cbLimit; 
ändern in
01.
switch (this.id) { 
02.
 case 'cb1': 
03.
    /* die spezielle Auswertung */ 
04.
    break; 
05.
/* ...*/ 
06.
 
07.
  default: 
08.
    for (var n = 0; n < getElementsByTagName('input').length; n++)  
09.
      getElementsByTagName('input')[n].disabled = !getElementsByTagName('input')[n].checked && cbSel >= cbLimit; 
10.
}
damit könntest Du spezielle Auswertungen einfügen.
Bitte warten ..
Neuester Wissensbeitrag
Humor (lol)

Linkliste für Adventskalender

(3)

Information von nikoatit zum Thema Humor (lol) ...

Ähnliche Inhalte
Server-Hardware
gelöst Hilfe bei einer Server (Hardware) auswahl (30)

Frage von bjk190368 zum Thema Server-Hardware ...

Windows Tools
gelöst Powershell - Auswahl aus Listbox soll Aktion ausführen (4)

Frage von Schmierlappen zum Thema Windows Tools ...

Netzwerke
gelöst Switch Hardware-Auswahl im Heimnetzwerk (4)

Frage von DieOmer zum Thema Netzwerke ...

Heiß diskutierte Inhalte
Router & Routing
gelöst Ipv4 mieten (22)

Frage von homermg zum Thema Router & Routing ...

Windows Server
DHCP Server switchen (20)

Frage von M.Marz zum Thema Windows Server ...

Exchange Server
gelöst Exchange 2010 Berechtigungen wiederherstellen (20)

Frage von semperf1delis zum Thema Exchange Server ...

Hardware
gelöst Negative Erfahrungen LAN-Karten (19)

Frage von MegaGiga zum Thema Hardware ...