recupere la cellule d'un GridView cliqué par la souris

Version imprimable

19/09/2012, 22h07
sak_ura

recupere la cellule d'un GridView cliqué par la souris

Bonjour

Malgrès plusieurs recherche est divers test je n'arrive pas trouver une solution a mon probleme.

J'ai créer une gridview qui contient certain information et j'aurai de besoin d'identifier précisement la case sur laquel l'utilisateur clic y a t il un moyen de faire cela ?

Ou dois je repenser mon application ?

Un exemple :

J'ai un GridView contenant 10 ligne representant des articles

Citation:

Produit | Couleur1 | Couleur2 | Couleur3 | Couleur4 |
Article 1 | Bleu | Rouge | Vert | Jaune |
Article 2 | Bleu | Rouge | Vert | Jaune |
Article 3 | Bleu | Rouge | Vert | Jaune |
Article 4 | Bleu | Rouge | Vert | Jaune |
Article 5 | Bleu | Rouge | Vert | Jaune |
Article 6 | Bleu | Rouge | Vert | Jaune |
Article 7 | Bleu | Rouge | Vert | Jaune |
Article 8 | Bleu | Rouge | Vert | Jaune |
Article 9 | Bleu | Rouge | Vert | Jaune |
Article10 | Bleu | Rouge | Vert | Jaune |

Je demande a l'utilisateur de choisir une couleur pour chaque article je voudrais donc au moment du clic de la souris savoir que l'utilisateur a choisi le Rouge pour l'article 4

Quelqu'un aurait il une solution a me proposer svp ?
19/09/2012, 22h49
vhoward99
Bonjour,

oui tu peux y arriver avec JQuery

si tu veux je te fais un exemple pour une table, mais en voici un en attendant pour sélectionner une série d'input qui se termine par XXX, si tu as des input de ta grille qui se termine par XXX la fonction click sera déclenchée, mais on peut faire plus propre en sélectionnant les inputs de la grille (table tr td input)
Code:

1 2 3 $('input[id$=txtXXX]').bind('click', function() { var i = $(this).attr('id); });
pour info JQuery est livré maintenant avec Visual Studio 2010, donc tu peux t'appuyer dessus

Cordialement
19/09/2012, 23h57
sak_ura

Bonsoir et merci pour ta reponse

Debutante, je n'ai pas encore eu l'occasion d'utiliser JQuery.

Excuse moi, je demande de précisions car je ne suis pas sur d'avoir saisi

Tu me propose de remplacer mon GridView par un tableau et dans chaque case contenant une couleur d'afficher un input?
20/09/2012, 11h38
vhoward99

Bonjour,

si j'ai bien compris tu as une grille et l'utilisateur peut cliquer dans les lignes pour choisir une couleur, à ce moment il faut récupérer la cellule, la ligne ...

je ne te propose pas de remplacer le gridview mais d'utiliser JQuery pour attacher un évenement aux éléments de ta grille (un gridview n'est qu'une table au final), quand l'évenement est déclenché tu peux récupérer l'id de l'élément cliqué ainsi que la ligne ...

Cordialement
20/09/2012, 23h45
sak_ura

Bonsoir est merci pour ta reponse

J'ai orrienter mes recherches vers JQuery

D'ailleur connaitrais tu des liens qui me permettrais de mettre en place ce que je veux faire ou comme tu le disais aurait tu un exmple a me fournir stp

J'ai tenter des exemple trouver sur internet mais rien n'a ete concluant

J'espere que tu pourra m'aide, je te remercie

Bonne soirée

Ah il fallait que je demande pour trouve 'peut etre' une piste j'ai enfin un test qui fonction en tous cas le click sur ma cellule me retourne le numero de la ligne et de la colonne choisi

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
 <script src="http://code.jquery.com/jquery-latest.js"></script>
 
  <script>
      $(document).ready(function () {
 
          $('table td').click(function () {
              var ligne = $(this).parent().attr('id');
              var cellule = $(this).attr('id');
              alert('Cellule: ' + cellule + ' Ligne: ' + ligne);
 
          });
      });
  </script>

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
 
<table>
	<tr id="ligne1">
		<td id="ligne1_cellule1">1</td>
		<td id="ligne1_cellule2">2</td>
		<td id="ligne1_cellule3">3</td>
		<td id="ligne1_cellule4">4</td>
		<td id="ligne1_cellule5">5</td>
		<td id="ligne1_cellule6">6</td>
	</tr>
	<tr id="ligne2">
		<td id="ligne2_cellule1">1</td>
		<td id="ligne2_cellule2">2</td>
		<td id="ligne2_cellule3">3</td>
		<td id="ligne2_cellule4">4</td>
		<td id="ligne2_cellule5">5</td>
		<td id="ligne2_cellule6">6</td>
	</tr>
	<tr id="ligne3">
		<td id="ligne3_cellule1">1</td>
		<td id="ligne3_cellule2">2</td>
		<td id="ligne3_cellule3">3</td>
		<td id="ligne3_cellule4">4</td>
		<td id="ligne3_cellule5">5</td>
		<td id="ligne3_cellule6">6</td>
	</tr>
</table>

En cas si tu as un exemple de pres je suis toujours interessé,

Me manque a trouve comment envoyer recupere le contenu de cette case et de l'afficher dans un textbox

Code:

1
2
 
  $('input[id$=TextBox1]').val($(this).val());

Bonjour est merci pour ta reponse

J'ai tester le code que tu ma donner mais il me retourne [object Object]

J'ai peut etre mal compris ou place cette ligne de code (moi je l'avais placer dans ce bloque)
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 <script src="http://code.jquery.com/jquery-latest.js"></script> <script> $(document).ready(function () { $('table td').click(function () { var ligne = $(this).parent().attr('id'); var cellule = $(this).attr('id'); alert('Cellule: ' + cellule + ' Ligne: ' + ligne); }); }); </script>
J'ai bien essayer de l'afficher dans mon textbox mais de meme j'ai ne pas reussi
Code:

1 2 <td id="ligne4_cellule1"><asp:TextBox ID="TextBox1" Text = <script>$val</script> runat="server"></asp:TextBox></td>

27/09/2012, 00h42
sak_ura

bonjour a tous

Je me permet de reposter sur le forum car je suis toujours bloqué dans mon problème, j'ai essayer plusieurs code mais je n'arrrive toujours pas a recuperer la valeur de ma cellule selectionner a chaque fois je me retrouve avec :

Citation:

[object Object]

Connaissais vous une solution ou un cours qui pourrais m'aider svp