Obtention de la valeur de case à cocher à partir de la vue de grille imbriquée

J'ai une vue de grille imbriquée avec 45 cases à cocher. Je souhaite que l'utilisateur puisse cliquer sur une case à cocher et conserver cette valeur dans une grille distincte jusqu'à ce qu'il veuille agir (similaire à un panier).Obtention de la valeur de case à cocher à partir de la vue de grille imbriquée

Les cases à cocher sont imbriquées dans une grille de deuxième niveau derrière un répéteur.

 <repeater> 
     <gridview> 
      <gridview> 
       checkbox 
      <gridview/> 
     <girdview /> 
    <repeater />

que je rencontrais un diable de temps à essayer d'obtenir la valeur de la case à cocher profonde et veulent apprendre jQuery et pensé que c'est un bon moment. Ce que je pensais était que l'utilisateur cliquait sur la case à cocher, jQuery obtiendrait l'id du contrôle (et la valeur), je pourrais alors passer cela à un déclencheur ajax postback et remplir le gridview 'panier d'achat'. La raison pour laquelle je dois passer par ajax est que je dois obtenir plus de valeurs d'une base de données en fonction de la case à cocher choisie par l'utilisateur.

Je pense que je pourrais le prendre à partir de là. Mon plus gros problème en ce moment est de trouver comment obtenir l'ID et la valeur de la case à cocher.

Source

2011-03-05 IMAbev

http://jsfiddle.net/AKU4W/ tant que la traversée n'a pas d'importance, il suffit de lier à la boîte spécifique. - Dans le pire des cas, vous pouvez utiliser '$ find()' de ASP pour rechercher les contrôles de case à cocher en premier, puis les lier (ou localiser le gridview et trouver toutes les cases à cocher). –

J'aimerais redimensionner ceci parce que j'ai besoin de comprendre ce qui se passe avant que j'ai la solution ... pourrais-je voir le code de jQuery pour cliquer une case à cocher et retourner l'identification de contrôle d'une des cases à cocher imbriquées? – IMAbev

Merci, Brad. Après avoir examiné le lien que vous avez fourni, j'ai été en mesure d'obtenir où je voulais pour le moment. Je peux maintenant cliquer sur la case à cocher et obtenir la valeur. Maintenant, j'ai besoin de comprendre comment passer cette valeur à un gridview ... – IMAbev

Vous devriez être en mesure d'obtenir la valeur (ou des données) de la case à cocher thats cliqués avec quelque chose comme

$ ('# case à cocher gridview-emballage). Live ("clic", la fonction (e) { // faire quelque chose avec la valeur du clic:

}); Vous voudrez peut-être utiliser les informations pour peupler quelque chose ailleurs sur la page ou vous pourriez vouloir stocker la valeur dans un tableau de données.

Le tableau de données est essentiellement un moyen de stocker des données de paire de valeurs clés dans jquery prêt à l'emploi lorsque l'utilisateur effectue une autre action sur la page.

lire la suite ici ->http://api.jquery.com/data/

Source

2011-03-05 23:49:48

jamais utilisé un répéteur, mais avec un peu jQuery simple et html je pense que vous pouvez obtenir le même effet sans le ballonnement des contrôles GridView:

Enregistrer comme html fichier pour un exemple

<html> 
<head> 
    <title>Test</title> 
</head> 
<body> 
    <table id="tblItems"> 
     <tbody> 
      <tr> 
       <td>+</td><td>Category 1</td> 
      </tr> 
      <tr> 
       <td> 
        <table> 
         <tbody> 
          <tr> 
           <td><input type="checkbox" /></td><td>Item 1</td><td>Price</td> 
          </tr> 
          <tr> 
           <td><input type="checkbox" /></td><td>Item 2</td><td>Price</td> 
          </tr> 
          <tr> 
           <td><input type="checkbox" /></td><td>Item 3</td><td>Price</td> 
          </tr> 
         </tbody> 
        </table> 
       </td> 
      </tr> 
      <tr> 
       <td>+</td><td>Category 2</td> 
      </tr> 
      <tr> 
       <td> 
        <table> 
         <tbody> 
          <tr> 
           <td><input type="checkbox" /></td><td>Item 4</td><td>Price</td> 
          </tr> 
          <tr> 
           <td><input type="checkbox" /></td><td>Item 5</td><td>Price</td> 
          </tr> 
          <tr> 
           <td><input type="checkbox" /></td><td>Item 6</td><td>Price</td> 
          </tr> 
         </tbody> 
        </table> 
       </td> 
      </tr> 
     </tbody> 
    </table> 
    <table id="tblResults"> 
     <thead> 
      <tr style="font-weight:bold"> 
       <td >Item Name</td><td>Price</td> 
      </tr> 
     </thead> 
     <tbody> 

     </tbody> 
    </table> 
</body> 
</html> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js" ></script> 
<script> 
    $(document).ready(function() { 
     $('#tblItems > tbody > tr').each(function(i){ 
      $row = $(this); 
      if(i % 2 == 0){//even rows are expanders 
       $row.children('td:eq(0)').click(function(){ 
        var $tmp = $(this); 
        var next = i + 1; 
        $row.parent().children("tr:eq(" + next + ")").toggle(); //toggle the next row 
        if($tmp.html() == '+'){ 
         $tmp.html('-'); 
        }else{ 
         $tmp.html('+'); 
        } 
       }); 
      }else{//odd rows are collapsed by default 
       $row.toggle(); 
      } 
     }); 

     $('input[type="checkbox"]').change(function(){ 
      var $chkBox = $(this), 
       data = $chkBox.data('checkboxData'); 

      if(!data){ //Add some data to remember to this checkbox 
       $chkBox.data('checkboxData', { 
        id: Example.GetUniqueId() // create a unique ID for this checkbox 
       }); 
       data = $chkBox.data('checkboxData'); 
      } 
      if($chkBox.is(':checked')){ //checkbox is checked 
       $("#tblResults tbody").append($chkBox.closest('tr').clone().attr('id', data.id)); //copy the checked row and add ID 
       $("#tblResults input").parent().remove(); //remove the checkbox from the copied row 
      }else{ 
       $("#" + data.id).remove(); //remove copied row when not checked 
      } 
     }); 
    }); 

    Example = {}; 

    Example.GetUniqueId = function() 
    { 
     var dateObject = new Date(); 
     var uniqueId = 
       dateObject.getFullYear() + '' + 
       dateObject.getMonth() + '' + 
       dateObject.getDate() + '' + 
       dateObject.getTime(); 

     return uniqueId; 
    }; 
</script>

Source

2011-03-06 00:59:13

Je suis d'accord que le ballonnement est là pour les contrôles gridview, mais je ne suis pas encore là. J'ai déjà créé la page et, malheureusement, j'ai imbriqué beaucoup plus que ce que je veux, mais cela fonctionne. Merci pour le code - beaucoup de matière à réflexion. – IMAbev

Obtention de la valeur de case à cocher à partir de la vue de grille imbriquée

Répondre

Questions connexes