<tr> <th width="37%""> <tr> <th width="37%""> <tr> <th width="37%"" />

Beperking van het aantal selectievakjes geselecteerd door de gebruiker in PHP

Ik heb de volgende tabel gemaakt die de gebruiker de mogelijkheid geeft om selectievakjes te gebruiken om de selectie aan te vinken. Ik beperkte het aantal selectie tot vier, maar het selecteerde meer dan 4 keuzes.

HTML:

<table width="100%" border="0">
    <tr>
        <th width="37%" height="19" align="center" bgcolor="#CCCCCC">
            Biological
        </th>
        <th width="37%" align="center" bgcolor="#CCCCCC">
            Psychological
        </th>
        <th width="37%" align="center" bgcolor="#CCCCCC">
            Social
        </th>
    </tr>
    <tr>
        <td>
            <input type="radio" name="Antidepressant" id="Antidepressant" value="Antidepressant" onclick="chkcontrol(1)" />
            Antidepressant</td>
        <td> </td>
        <td> </td>
    </tr>
    <tr>
        <td>
            <input type="radio" name="Antipsychotic oral" id="Antipsychotic oral" value="Antipsychotic oral" onclick="chkcontrol(2)" />
            Antipsychotic oral</td>
        <td> </td>
        <td> </td>
    </tr>
    <tr>
        <td>
            <input type="radio" name="Antipsychotic_depot" id="Antipsychotic depot" value="Antipsychotic depot" onclick="chkcontrol(3)" />
            Antipsychotic depot</td>
        <td> </td>
        <td> </td>
    </tr>
    <tr>
        <td>
            <input type="radio" name="Bblocker" id="B-blocker" value="B-blocker" onclick="chkcontrol(4)" />
            B-blocker</td>
        <td> </td>
        <td> </td>
    </tr>
    <tr>
        <td>
            <input type="radio" name="Benzodiazepine" id="Benzodiazepine" value="Benzodiazepine" onclick="chkcontrol(5)" />
            Benzodiazepine</td>
        <td> </td>
        <td> </td>
    </tr>
    <tr>
        <td>
            <input type="radio" name="Mood_stabiliser" id="Mood stabiliser" value="Mood stabiliser" onclick="chkcontrol(6)" />
            Mood stabiliser</td>
        <td> </td>
        <td> </td>
    </tr>
    <tr>
        <td>
            <input type="radio" name="ECT" id="ECT" value="ECT" onclick="chkcontrol(7)" />
            ECT</td>
        <td> </td>
        <td> </td>
    </tr>
    <tr>
        <td>
            <input type="radio" name="Otherbio" id="Other" value="Other" />
            Other</td>
        <td> </td>
        <td> </td>
    </tr>
    <tr>
        <td> </td>
        <td> </td>
        <td> </td>
    </tr>
</table>

Het script werd gebruikt om het aantal selectie te checeren:

function chkcontrol(j) {
    var total = 0;
    for (var i = 0; i < document.form1.ckb.length; i++) {
        if (document.form1.ckb[i].checked) {
            total = total + 1;
        }
        if (total > 4) {
            alert("Please Select only three")
            document.form1.ckb[j].checked = false;
            return false;
        }
    }
}

Hier is een screenshot:

enter image description here

0
Wat u daar zou moeten gebruiken, zijn selectievakjes, geen keuzerondjes.
toegevoegd de auteur Derek 朕會功夫, de bron
Er zijn veel problemen in uw code. Eerst moet het <input> zijn in plaats van . Ten tweede is id = "Mood stabilizer" niet correct omdat geen spatie is toegestaan ​​in id . Ten derde zijn s niet op die manier gebruikt . Dit is een goede HTML-referentie: developer.mozilla.org/en/HTML
toegevoegd de auteur Derek 朕會功夫, de bron
@nnnnnn - Je hebt gelijk, en het is goed in HTML5.
toegevoegd de auteur Derek 朕會功夫, de bron
voor starters zijn dat geen keuzerondjes.
toegevoegd de auteur tradyblix, de bron
en ook ID's in HTML kunnen geen spaties hebben, b.v. id = "Antipsychoticum-depot"
toegevoegd de auteur tradyblix, de bron
U hebt geen "form1.ckb" in uw HTML zodat de JS-code niets doet
toegevoegd de auteur alfasin, de bron
@Derek: <input /> met een / is vereist voor xhtml en doet geen schade in (niet-x) html.
toegevoegd de auteur nnnnnn, de bron
Wat heeft PHP ermee te maken? Het enige JavaScript ..
toegevoegd de auteur SuperSaiyan, de bron
maar het script werkt niet en de gebruiker kan meer dan 4 keuzes selecteren
toegevoegd de auteur Tina, de bron

1 antwoord

Na een paar kleine correcties:

<html>
<head>
<script type="text/javascript">
function chkcontrol(j) {
    var total=0;
    for(var i=0; i < document.form1.ckb.length; i++){
        if(document.form1.ckb[i].checked){
            total =total +1;
        }
        if(total > 4){
            alert("Please Select only four!")
            document.form1.ckb[j].checked = false ;
            return false;
        }
    }
}
</script>

</head>
<body>
<table width="100%" border="0">
    <form action="" id="form1" name="form1">
            <tr>
              <th width="37%" height="19" align="center" bgcolor="#CCCCCC">Biological</th>
              <th width="37%" align="center" bgcolor="#CCCCCC"> Psychological</th>
              <th width="37%" align="center" bgcolor="#CCCCCC"> Social</th>
            </tr>
            <tr>
              <td><input type="radio" name="Antidepressant" id="ckb" value="Antidepressant" onclick="chkcontrol(0);" />
                Antidepressant</td>
              <td> </td>
              <td> </td>
            </tr>
            <tr>
              <td><input type="radio" name="Antipsychotic oral" id="ckb" value="Antipsychotic oral" onclick="chkcontrol(1);" />
                Antipsychotic oral</td>
              <td> </td>
              <td> </td>
            </tr>
            <tr>
              <td><input type="radio" name="Antipsychotic_depot" id="ckb" value="Antipsychotic depot" onclick="chkcontrol(2);" />
                Antipsychotic depot</td>
              <td> </td>
              <td> </td>
            </tr>
            <tr>
              <td><input type="radio" name="Bblocker" id="ckb" value="B-blocker"  onclick="chkcontrol(3);"/>
                B-blocker</td>
              <td> </td>
              <td> </td>
            </tr>
            <tr>
              <td><input type="radio" name="Benzodiazepine" id="ckb" value="Benzodiazepine"  onclick="chkcontrol(4);"/>
                Benzodiazepine</td>
              <td> </td>
              <td> </td>
            </tr>
            <tr>
              <td><input type="radio" name="Mood_stabiliser" id="ckb" value="Mood stabiliser"  onclick="chkcontrol(5);"/>
                Mood stabiliser</td>
              <td> </td>
              <td> </td>
            </tr>
            <tr>
              <td><input type="radio" name="ECT" id="ckb" value="ECT"  onclick="chkcontrol(6);"/>
                ECT</td>
              <td> </td>
              <td> </td>
            </tr>
            <tr>
              <td><input type="radio" name="Otherbio" id="ckb" value="Other"  onclick="chkcontrol(7);"/>
                
                Other</td>
              <td> </td>
              <td> </td>
            </tr>
            <tr>
              <td> </td>
              <td> </td>
              <td> </td>
            </tr>
        </form>
    </table>
</body>
</html>

Toch is het niet logisch, omdat de vorm de inhoud nergens indient, maar het is een goede POC.

1
toegevoegd
@Tina - Er zijn veel meer fouten in uw code. Zie mijn opmerking hierboven.
toegevoegd de auteur Derek 朕會功夫, de bron
meerdere id = "ckb" is niet correct. verwijst ook naar de element_id en niet naar de naam.
toegevoegd de auteur tradyblix, de bron
Ik bedoel dat het label moet verwijzen naar de element_id en niet naar de naam.
toegevoegd de auteur tradyblix, de bron
ik begrijp dat ik alleen wil wijzen op dat wat gecorrigeerd is, niet correct is. de originele id en relatie van het OP heeft gelijk (behalve de spatie in id) dan wat je gepost hebt. ja het werkt misschien nu, maar het verbetert de code niet.
toegevoegd de auteur tradyblix, de bron
@tradyblix Ik was niet van plan om alle fouten op te lossen, alleen om te laten zien hoe je het kunt laten werken. Er zijn andere dingen die ik zou veranderen zoals: het toewijzen van de "onclick" -methode op het hoofd in plaats van het lichaam enz.
toegevoegd de auteur alfasin, de bron
De labelelementen zijn hier sowieso zinloos omdat ze leeg zijn: wat de labelinhoud zou moeten zijn, is op dit moment na de afsluitende -tags.
toegevoegd de auteur nnnnnn, de bron
Bedankt..Het werkt nu prima :) Nogmaals bedankt
toegevoegd de auteur Tina, de bron