JQuery CheckAll dans GridView

Question

J'ai un GridView sur un fichier .ascx. J'ai une case à cocher: Checkbox CheckAll dans le modèle d'en-tête pour une colonne, puis une case à cocher dans le ItemTemplate. Je voudrais ajouter la fonctionnalité de sorte que lorsque je coche la case dans l'en-tête, il va cocher ou décocher toutes les cases à cocher dans le GridView.

Comment faire ceci avec JQuery? Je voudrais alors également ajouter la fonctionnalité inverse de sorte que lorsque je décoche une case à cocher dans le GridView qu'il décoche la case à cocher dans l'en-tête.

Answer 1

Vous pouvez jouer avec l'ID 'CheckAll' Checkbox et les classes des lignes. Par exemple, vous pouvez avoir un ID de contrôle "chkSelectAllNone" (notez que cela va changer dans le client pour quelque chose comme 'Ctl001_chkSelectAllNone') et vous pouvez assigner les classes rows avec la classe css "select-row" .

Ensuite, créez un script jQuery dans le ASPX (ou l'écrire du code sous-jacent) pour gérer la bascule Sélectionner tout/rien, comme celui-ci:

$("#<%= chkSelectAllNone.ClientID %>").click(function(){ 
$(".select-row").attr("checked", $("#<%= chkSelectAllNone.ClientID %>").attr("checked")); 
}); 

Hope it helps.

Answer 2

Je ne sais pas si GridViews rendre un th, mais si elles le font devraient vous permettre de:

$("th :radio").click(function() { 
    if($(this).is(":checked")) { 
    $("td :radio").attr("checked", "checked"); 
    } 
}); 

$("td :radio").click(function() { 
    var attr = $("td :radio").not(":checked").length ? "" : "checked"; 
    $("th :radio").attr("checked", attr); 
});