Tout cocher ne fonctionnera pas dans Chrome, mais fonctionne dans Firefox

Question

J'ai une case à cocher tout dans laquelle lorsque l'utilisateur va cocher, tous les éléments en dessous seront cochés. Cela fonctionne très bien dans Firefox mais n'effectuera pas la fonction Check All en chrome.

Ceci est la fonction JS:

function Check(chk, num) 
{ 
    if(chk.value=="Check all"){ 
     for (i = 0; i <= num; i++){ 
      chk[i].checked = true ; 
     } 
     chk.value="UnCheck all"; 
    }else{ 

     for (i = 0; i <= num; i++){ 
      chk[i].checked = false ; 
     } 
     chk.value="Check all"; 
    } 
} 

HTML:

<form target="_blank" action="" method="post" id="myform" name="myform"> 
    <input type="checkbox" value="Check all" onclick="Check(document.myform.Product A, 9)" id="Fujitsu" name="Fujitsu"> Select All 
    <input type="hidden" value="1" name="product_id[1]"> 
    <input type="checkbox" value="Product 1" id="Product 1" name="product[1]">Product A -Product 1 
    <input type="hidden" value="2" name="product_id[2]"> 
    <input type="checkbox" value="Product 2" id="Product 2" name="product[1]">Product A -Product 2 
</form> 

Answer 1

Pour moi, à la fois plantage de Firefox et Chrome sur "document.myform.Product A". Voici votre code un peu modifié pour fonctionner:

function Check(form, all, chk, num) 
{ 
    if(form[all].value=="Check all"){ 
     for (i = 1; i <= num; i++){ 
      form[chk + i].checked = true ; 
     } 
     form[all].value="UnCheck all"; 
    }else{ 

     for (i = 1; i <= num; i++){ 
      form[chk + i].checked = false ; 
     } 
     form[all].value="Check all"; 
    } 
} 

et HTML:

<form target="_blank" action="" method="post" id="myform" name="myform">- 
    <input type="checkbox" value="Check all" onclick="Check(document.myform, 'Fujitsu', 'Product_' , 2)" id="Fujitsu" name="Fujitsu"> Select All- 
    <input type="hidden" value="1" name="product_id[1]">- 
    <input type="checkbox" value="Product 1" id="Product_1" name="product[1]">Product A -Product 1- 
    <input type="hidden" value="2" name="product_id[2]">- 
    <input type="checkbox" value="Product 2" id="Product_2" name="product[1]">Product A -Product 2- 
</form> 

Mais vous pouvez faire un code plus propre à faire la même chose:

function Check(form, action) 
{ 
    var l = form.getElementsByTagName("input"); 
    for (var i = 0; i < l.length; ++i) 
     if (l[i].type == "checkbox") l[i].checked = action; 
} 

et HTML:

<form target="_blank" action="" method="post" id="myform" name="myform">- 
    <input type="checkbox" value="Check all" onclick="Check(document.myform, this.checked)" id="Fujitsu" name="Fujitsu"> Select All- 
    <input type="hidden" value="1" name="product_id[1]">- 
    <input type="checkbox" value="Product 1" id="Product_1" name="product[1]">Product A -Product 1- 
    <input type="hidden" value="2" name="product_id[2]">- 
    <input type="checkbox" value="Product 2" id="Product_2" name="product[1]">Product A -Product 2- 
</form> 

Ce serait encore mieux si vous avez utilisé une bibliothèque avec des sélecteurs CSS comme jQuery.