Select deselect all

[Valeria75_bis]

Ciao a tutti, nelle mie pagine uso uno script che mi consente di selezionare automaticamente tutti i checkbox di una colonna.

Il problema è che quando nella griglia ho due colonne con due tipologie di checkbox, io vorrei solo selezionare (tutti) i checkbox di una colonna.... ora invece vengono selezionate tutte.

Mi potete aiutare?

Grazie

<script language=JavaScript> 
<!--
function confirmDelete (frm) {

 // loop through all elements
 for (i=0; i<frm.length; i++) {

 // Look for our checkboxes only
 if (frm.elements[i].name.indexOf ('DeleteThis') !=-1) {
 // If any are checked then confirm alert, otherwise nothing happens
 if(frm.elements[i].checked) {
 return confirm ('Confermi la cancellazione?')
 }
 }
 }
}



function select_deselectAll (chkVal, idVal) {
var frm = document.forms[0];
// loop through all elements
 for (i=0; i<frm.length; i++) {
 // // Look for our Header Template's Checkbox
 if (idVal.indexOf ('CheckAll') != -1) {
 // Check if main checkbox is checked, then select or deselect datagrid checkboxes 
 if(chkVal == true) {
 frm.elements[i].checked = true;
 } else {
 frm.elements[i].checked = false;
 }
 // Work here with the Item Template's multiple checkboxes
 } else if (idVal.indexOf('DeleteThis') != -1) {
 // Check if any of the checkboxes are not checked, and then uncheck top select all checkbox
 if(frm.elements[i].checked == false) {
 frm.elements[1].checked = false; // Check if any of the checkboxes are not checked, and then uncheck top select all checkbox
 }
 }
 }
}//--> 
</script>

La mia è una griglia generata da .NET, vi posto comunque un esempio dell'HTML generato (se puo' servire)

<table cellspacing="0" rules="all" border="1" id="ctl00_Main_gwSpedizioni" style="width:90%;border-collapse:collapse;">
        <tr style="background-color:Silver;height:20px;">
            <th scope="col">
                            <div align="center"> 
                            <input id="ctl00_Main_gwSpedizioni_ctl01_CheckAll" type="checkbox" name="ctl00$Main$gwSpedizioni$ctl01$CheckAll" onclick="javascript: return select_deselectAll (this.checked, this.id);" />
                            </div> 
                        </th>

......
        </tr><tr style="height:20px;">
            <td style="width:35px;">
                            <div align="center"> 
                             <input id="ctl00_Main_gwSpedizioni_ctl02_DeleteThis" type="checkbox" name="ctl00$Main$gwSpedizioni$ctl02$DeleteThis" />
                             
                            </div> 
                        </td>

......


                                    <span disabled="disabled"><input id="ctl00_Main_gwSpedizioni_ctl02_chkNostroConto" type="checkbox" name="ctl00$Main$gwSpedizioni$ctl02$chkNostroConto" disabled="disabled" /></span>
                               </td>
        </tr><tr style="background-color:#E0E0E0;height:20px;">
            <td style="width:35px;">
                            <div align="center"> 
                             <input id="ctl00_Main_gwSpedizioni_ctl03_DeleteThis" type="checkbox" name="ctl00$Main$gwSpedizioni$ctl03$DeleteThis" />
                             
                            </div> 
                        </td><td style="width:80px;">


.......

                                    <span disabled="disabled"><input id="ctl00_Main_gwSpedizioni_ctl03_chkNostroConto" type="checkbox" name="ctl00$Main$gwSpedizioni$ctl03$chkNostroConto" disabled="disabled" /></span>
                               </td>
        </tr> 

[Valeria75_bis]

Please help me!!

[cavicchiandrea]

Aggiungi una classe hai checkbox che vuoi distingure tipo:
<input id="ctl00_Main_gwSpedizioni_ctl02_DeleteThis" class="col1" type="checkbox" name="ctl00$Main$gwSpedizioni$ctl02$DeleteThis" />
<input id="ctl00_Main_gwSpedizioni_ctl01_CheckAll" type="checkbox" name="ctl00$Main$gwSpedizioni$ctl01$CheckAll" onclick="java-script: return select_deselectAll (this.checked, this.id, 'col1');" />
function select_deselectAll (chkVal, idVal,classe){....
if(chkVal == true && classe='col1') {
frm.elements[i].checked = true;
} else {
frm.elements[i].checked = false;
}

[Valeria75_bis]

Grazie per l'aiuto, quindi aggiungo una classe al mio checkbox che voglio gestire (intendo a tutti quelli della colonna interessata)

esempio class="col1"

la chiamata (dalla griglia) sarà:

select_deselectAll (this.checked, this.id, 'col1');


a questo punto il JS diventerà


function select_deselectAll (chkVal, idVal,classe){....
if(chkVal == true && classe='col1') {
frm.elements[i].checked = true;
} else {
frm.elements[i].checked = false;
}

ma tutti il vecchio JS che funzionava correttamente??

come verrà modificato

function select_deselectAll (chkVal, idVal) {
var frm = document.forms[0];
// loop through all elements
 for (i=0; i<frm.length; i++) {
 // // Look for our Header Template's Checkbox
 if (idVal.indexOf ('CheckAll') != -1) {
 // Check if main checkbox is checked, then select or deselect datagrid checkboxes 
 if(chkVal == true) {
 frm.elements[i].checked = true;
 } else {
 frm.elements[i].checked = false;
 }
 // Work here with the Item Template's multiple checkboxes
 } else if (idVal.indexOf('DeleteThis') != -1) {
 // Check if any of the checkboxes are not checked, and then uncheck top select all checkbox
 if(frm.elements[i].checked == false) {
 frm.elements[1].checked = false; // Check if any of the checkboxes are not checked, and then uncheck top select all checkbox
 }
 }
 }
}

Grazie per l'aiuto

[Valeria75_bis]

Ho scritto qualche fesseria??

[Valeria75_bis]

Nessuna dritta??

[Vindav]

Immagino sarà cosi:

function select_deselectAll (chkVal, idVal, classe) {
var frm = document.forms[0];
// loop through all elements
 for (i=0; i<frm.length; i++) {
 // // Look for our Header Template's Checkbox
 if (idVal.indexOf ('CheckAll') != -1) {
 // Check if main checkbox is checked, then select or deselect datagrid checkboxes 
 if(chkVal == true && classe=='col1') {
frm.elements[i].checked = true;
} else {
frm.elements[i].checked = false;
}
 // Work here with the Item Template's multiple checkboxes
 } else if (idVal.indexOf('DeleteThis') != -1) {
 // Check if any of the checkboxes are not checked, and then uncheck top select all checkbox
 if(frm.elements[i].checked == false) {
 frm.elements[1].checked = false; // Check if any of the checkboxes are not checked, and then uncheck top select all checkbox
 }
 }
 }
}

Non l'ho provato quindi fai un po' di test...

[Valeria75_bis]

Sbaglio qualche cosa... come dicevo uso .NET quindi nella definizione della colonna della griglia ho messo

<asp:TemplateField>
                        <ItemStyle Width="35px"></ItemStyle>
                        <HeaderTemplate>
                            <div align="center"> 
                            <asp:CheckBox ID="CheckAll" OnClick="javascript: return select_deselectAll (this.checked, this.id, 'col1');" runat="server" />
                            </div> 
                        </HeaderTemplate>
                        <ItemTemplate>
                            <div align="center"> 
                             <asp:CheckBox ID="DeleteThis" runat="server" Class="col1" />
                             <asp:Label ID="StoreID" Text='<%# DataBinder.Eval (Container.DataItem, "id") %>' runat="server" Visible="false"/>
                            </div> 
                        </ItemTemplate>
                    </asp:TemplateField> 

poi nel JS

"function select_deselectAll (chkVal, idVal, classe) {\n" +
        "var frm = document.forms[0];\n" +
        "// loop through all elements\n" +
        " for (i=0; i<frm.length; i++) {\n" +
        " // // Look for our Header Template's Checkbox\n" +
        " if (idVal.indexOf ('CheckAll') != -1) {\n" +
        " // Check if main checkbox is checked, then select or deselect datagrid checkboxes \n" +
        " if(chkVal == true && classe=='col1') {\n" +
        " frm.elements[i].checked = true;\n" +
        " } else {\n" +
        " frm.elements[i].checked = false;\n" +
        " }\n" +
        " // Work here with the Item Template's multiple checkboxes\n" +
        " } else if (idVal.indexOf('DeleteThis') != -1) {\n" +
        " // Check if any of the checkboxes are not checked, and then uncheck top select all checkbox\n" +
        " if(frm.elements[i].checked == false) {\n" +
        " frm.elements[1].checked = false; // Check if any of the checkboxes are not checked, and then uncheck top select all checkbox\n" +
        " }\n" +
        " }\n" +
        " }\n" +
        "}" +
        "//--> \n" +
        "</script>"; 

Non funziona... o meglio seleziona (come prima) anche colonne che non c'entrano niente .... tra l'altro è strano che lo faccia anche ora vista la condizione

cmq nell'HTML, quello che io avevo inserito in .NET :

Class="col1"

diventa:

<span class="col1"><input id="ctl00_Main_gwSpedizioni_ctl02_DeleteThis" type="checkbox" name="ctl00$Main$gwSpedizioni$ctl02$DeleteThis" /></span>

quindi il tag class non è inserito nel campo input

Grazie

[Vindav]

Effettivamente qualcosa non quadra... penso sia meglio aspettare una risposta di andrea perche a me sfugge qualcosa... che senso ha inserire il controllo classe == 'col1' se al metodo viene sempre passata la stringa col1? cioè quella condizione sarà sempre a true no? boh forse mi sto perdendo qualcosa.

[Valeria75_bis]

Infatti!! Pur non creandomi correttamente la class dentro l'input vengono cmq chekkati.... proprio perchè forse, come dici, è sempre a true!

Thanks