Zaznaczanie i odznaczanie chceckboxow w jednym formularzu

0

Witam!

Mam dwa formularze wink.gif i checkboxy w obu.

Chciałbym, żeby móc zaznaczyć wszystkie chceckboxy i je odznaczyć, ale tylko w jednym formularzu.
Mam kod, który działa poprawnie, tylko mogę zaznaczyć dopiero wtedy kiedy w formularzu jest więcej niż jeden chcecbox...
Jeżeli w formularzu jest jeden to nie mogę zaznaczyć.. poniżej kod: gdzie może być błąd...


function makeCheck(thisForm)
{

for (i = 0; i < thisForm.all.length; i++)
{
thisForm.all[i].checked=true
}

}

function makeUncheck(thisForm)
{

for (i = 0; i < thisForm.all.length; i++)
{
thisForm.all[i].checked=false
}


<form method="POST" action="mod_box.php" class="form-inline" role="form">
 
<input id="all"  type="checkbox" style="width: 20px; height: 20px;">
<input id="all"  type="checkbox" style="width: 20px; height: 20px;">
<input id="all"  type="checkbox" style="width: 20px; height: 20px;">
 
<input type="button" value="Zaznacz" onclick="makeCheck(this.form)" class="btn checkall"> 
<input type="button" value="Odznacz" onclick="makeUncheck(this.form)" class="btn uncheckall">
 
</form>


Z góry dzięki

1

Bo przy wielu elementach dostajesz thisForm.all jako RadioNodeList (przynajmniej dla Chrome), z kolei przy jednym elemencie dostajesz referencje do tego konkretnego jednego checkboxa. Popracuj trochę z console np. Chrome, wszystko Ci wtedy rozjaśni. ID również powinno być unikatowe, łap checkboxy po klasie.

0
Świetny Szewc napisał(a):

Bo przy wielu elementach dostajesz thisForm.all jako RadioNodeList (przynajmniej dla Chrome), z kolei przy jednym elemencie dostajesz referencje do tego konkretnego jednego checkboxa. Popracuj trochę z console np. Chrome, wszystko Ci wtedy rozjaśni. ID również powinno być unikatowe, łap checkboxy po klasie.

Tzn. Jak musialbym zmodyfikowac istniejecy kod? Tak zeby zaznaczal wszystkie oraz jeden chceckbox w danym folmularzu :)

0
Świetny Szewc napisał(a):

Bo przy wielu elementach dostajesz thisForm.all jako RadioNodeList (przynajmniej dla Chrome), z kolei przy jednym elemencie dostajesz referencje do tego konkretnego jednego checkboxa. Popracuj trochę z console np. Chrome, wszystko Ci wtedy rozjaśni. ID również powinno być unikatowe, łap checkboxy po klasie.

Oto kod:

       
                (function(d)
                {
                    "use strict";
                    var form=d.getElementsByTagName('form')[0]
                    ,button=d.getElementsByTagName('button')[0];
                    button.addEventListener('click',function()
                    {
                        for(var i=0;i<form['check[]'].length;i++)
                        {
                            var t=form['check[]'][i];
                            if(i===0)
                                this.innerHTML=t.checked?'Zaznacz wszystkie':'Odznacz wszystkie';
                            t.checked=!t.checked;
                        }
                    },false);
                }(document))



            <form action="#" method="post">
                <fieldset>
                    <ul>
                        <li><input type="checkbox" name="check[]"></li>
                        <li><input type="checkbox" name="check[]"></li>
                        <li><input type="checkbox" name="check[]"></li>
                        <li><input type="checkbox" name="check[]"></li>
                        <li><input type="checkbox" name="check[]"></li>
                        <li><input type="checkbox" name="check[]"></li>
                        <li><input type="checkbox" name="check[]"></li>
                    </ul>
                    <button type="button">Zaznacz wszystkie</button>
                </fieldset>
            </form>

Również w tym przypadku jak będzie pojedyńczy checkbox to też nie zostanie zaznaczony dopiero jak będą min. dwa ;(

1

Choćby tak:

(function(d)
                {
                    "use strict";
                    var form=d.getElementsByTagName('form')[0]
                    ,button=d.getElementsByTagName('button')[0];					
										
                    button.addEventListener('click',function()
                    {						
						var elements = document.getElementsByClassName("jakasKlasa");
						
                        for(var i=0;i<elements.length;i++)
                        {
                            var t=elements[i];
                            if(i===0)
                                this.innerHTML=t.checked?'Zaznacz wszystkie':'Odznacz wszystkie';
                            t.checked=!t.checked;
                        }
                    },false);
                }(document))
<form action="#" method="post">
                <fieldset>
                    <ul>
                        <li><input type="checkbox" class="jakasKlasa" name="check[]"></li>                        
						<li><input type="checkbox" class="jakasKlasa" name="check[]"></li>                        
						<li><input type="checkbox" class="jakasKlasa" name="check[]"></li>                        
                    </ul>
                    <button type="button">Zaznacz wszystkie</button>
                </fieldset>
            </form>

1 użytkowników online, w tym zalogowanych: 0, gości: 1