Recherche de mot dans une colonne

**ticad** · 08/04/2010, 17h26

Bonjour à tous,

Je fais mes premiers pas en javascript, j'ai trouvé un scrîpt qui me permet de rechercher un mot dans une page web.
Seulement, j'aimerais que ce script s'adapte à une recherche dans une colonne. Je m'explique: j'ai un tableau avec trois champs ref, designation,famille. Ce tableau comporte plus de 1000 enregistrements. J'ai donc "fais" une zone de recherche, mais je souhaite que cette recherche ne s'effectue pas sur toutes les colonnes mais simplement sur la colonne designation. Je pense que l'astuce se situe au niveau du document.body mais j'ai beau cherché de la documentation, je ne trouve pas.

Voici le code du script de recherche dans la page :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
 
<SCRIPT LANGUAGE="JavaScript">
var IE4 = (document.all);
var win = window;    // window to search.
var n   = 0;
function findInPage(str) {
 var txt, i, found;
 if (str == "")
 return false;
 
 if (IE4) {
 txt = win.document.body.createTextRange();
 
 for (i = 0; i <= n && (found = txt.findText(str)) != false; i++) {
 txt.moveStart("character", 1);
 txt.moveEnd("textedit");
 }
 // If found, mark it and scroll it into view.
 if (found) {
 txt.moveStart("character", -1);
 txt.findText(str);
 txt.select();
 txt.scrollIntoView();
  n++;
  }
 else {
 if (n > 0) {
 n = 0;
 findInPage(str);
 }
 else
 alert("Not found.");
 }
 }
 return false;
 }
</script>
 
//En tete de mon tableau
 
<table id='decotableappel' border='1'>
   <tr>
     <td height='20' width='100'><a href='saisi2triarticle.php'>Reference</td>
     <td height='20' width='100'>
 
	<form name='search' onSubmit='return findInPage(this.string.value);'>
	<a href='saisi2tridesignation.php'>D&eacute;signation</a>
	<input name="string" type="text" size="15" onChange="n = 0;">
	<input type='submit' class='buttonsearch' value='OK'></form>
 
     </td>	
     <td height='20' width='100'><a href='saisi2trifamille.php'>Famille</a></td>
  </tr>

D'avance, un grand merci d'avoir pris le temps de me lire

**SpaceFrog** · 08/04/2010, 17h38

dans le td du mileu ?

recupère la collection des td de ton tableau
et boucle sur la collection en partant de 1 avec un pas de 3 en testant le innerHTML du td ..

**ticad** · 08/04/2010, 17h43

Merci de la rapidité de la réponse...
Oui c'est dans le td du milieu mais euh, comment je dois m'y prendre pour réaliser cela?

**SpaceFrog** · 09/04/2010, 09h40

Tout était dans la réponse précédente

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
 
<title>abricot</title>
 
<style type="text/css">
table {width:50%;
	border-collapse:collapse;
	}
td {
    border: solid 1px navy;
    text-align: center;
    color:navy;
    }
</style>
<script type="text/javascript">
function mysearch(mot){
var tds=document.getElementById('montableau').getElementsByTagName('td')
var found=false;
var occur=0;
for(i=1;tds[i];i=i+3){
		  found=(tds[i].innerHTML==mot)
         tds[i].style.color=(found)?"white":"navy";
         tds[i].style.backgroundColor=(found)?"navy":"white"; 
         occur+=(found)?1:0;
         }
if(occur==0){alert('pas trouvé')     
}            }
</script>
</head>
 
<body>
<table id="montableau">
	<tr>
		<td>abricot</td>
		<td>poire</td>
		<td>pêche</td>
	</tr>					
	<tr>
		<td>salade</td>
		<td>haricot</td>
		<td>poireau</td>
	</tr>
	<tr>
		<td>poulet</td>
		<td>poisson</td>
		<td>boeuf</td>
	</tr>
	<tr>
		<td>tarte</td>
		<td>gateau</td>
		<td>biscuit</td>
	</tr>
	<tr>
		<td>sucre</td>
		<td>sel</td>
		<td>poivre</td>
	</tr>
	<tr>
		<td>huile</td>
		<td>vinaigre</td>
		<td>moutarde</td>
	</tr>
	<tr>
		<td>fromage</td>
		<td>yaourt</td>
		<td>lait</td>
	</tr>
	<tr>
		<td>vin</td>
		<td>bière</td>
		<td>limonade</td>
	</tr>
</table>	
<input type="button" onclick="mysearch(document.getElementById('word').value)" value="rechercher" />
<input type="text" id="word" value="" />
</body>
 
</html>

Recherche de mot dans une colonne

JavaScript

Vue hybride

Discussions similaires

Partager

Partager