Discussion :

[killer2015]

Bonjour

j'ai une barre de recherche que j'utilise très souvent car très pratique cependant j'ai actuellemtn un petit problème dans mon code. Je vais vous montrer.

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
<div id="rech">
 
          <form id="live-search" action="" class="styled" method="post">
              <fieldset>
                  Rechercher un pays : <input type="text" class="text-input" id="filter" value="">
                  <span id="filter-count"></span>
              </fieldset>
          </form>
 
 
            <script type="text/javascript">
                $(document).ready(function(){
                    $("#filter").keyup(function(){
                        var filter = $(this).val(), count = 0;
                        $("#rech div[class=nom]").each(function(){
                            if ($(this).text().search(new RegExp(filter, "i")) < 0){
                                    $(this).fadeOut();
                            }
                            else{
                                    $(this).show();
                                    count++;
                            }
                        });
                        var numberItems = count;
                        $("#filter-count").text(" Résultats correspondants : "+count);
                    });
                });
            </script>
 
 
          <?php  foreach ($FICHE_PAYS as $une) :  ?>
          <div class="test">
 
                  <?php echo '<div class="nom"><tr class="impair"> <td class="text-left">'.$une->nom.'</td></div>'; ?>
                  <?php echo '<div class="continent"><td class="text-left">'.$une->continent.'</td></div>';?>
                  <?php if (($une->etat)==0) {
                    echo '<div class="etat"><td class="text-left">'."Visa à obtenir au préalable".'</td></div>';
                  }elseif (($une->etat)==1) {
                    echo '<div class="etat"><td class="text-left">'."Visa à obtenir à la frontière".'</td></div>';
                  }elseif (($une->etat)==2) {
                    echo '<div class="etat"><td class="text-left">'."Aucun Visa requis".'</td></div>';
                  }?>
                <?php echo '<div class="duree"><td class="text-left">'.$une->duree.'</td></tr></div>';?>
          </div>
 
          <?php endforeach; ?>
        </div>

et mon problème actuel est que je ne parviens pas à faire en sorte que mes div id="rech" et class="test" englobe ce quelle sont censé englober elle se ferme avant et je ne comprend pas pk il me donne ceci



si quelqu'un a une solution je suis preneur.

[CosmoKnacki]

Je ne peux pas dire avec certitude ce qui ne va pas dans ton code, mais je remarque déjà qu'il y a des balises qui se chevauchent (tr avec div) ce qui n'est pas très bon signe. D'autre part une balise div n'a rien à faire dans une balise table (les enfants directs d'une balise table peuvent uniquement être caption thead tbody tfoot tr.)

À ta place, j'allégerai au maximum le code html en retirant toutes ces balises div et en plaçant les classes utiles sur les éléments td. Quelque chose comme ça:

Code html :

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
<script type="text/javascript">
    $(document).ready(function() {
        $("#filter").keyup(function() {
            var filter = $(this).val(), count = 0;
            $("#rech td[class=nom]").each(function() {
                if ($(this).text().search(new RegExp(filter, "i")) < 0) {
                    $(this).fadeOut();
                } else {
                    $(this).show();
                    count++;
                }
            });
            var numberItems = count;
            $("#filter-count").text(" Résultats correspondants : " + count);
        });
    });
</script>
 
<div id="rech">
    <form id="live-search" action="" class="styled" method="post">
        <fieldset>
            Rechercher un pays : <input type="text" class="text-input" id="filter" value="">
            <span id="filter-count"></span>
        </fieldset>
    </form>
 
    <table>
    <?php foreach ($FICHE_PAYS as $k => $une): ?>
        <tr>
            <td class="nom"><?php echo $une->nom; ?></td>
            <td class="continent"><?php echo $une->continent; ?></td>
            <td class="etat"><?php
                if ($une->etat == 0)
                    echo 'Visa à obtenir au préalable';
                elseif ($une->etat == 1)
                    echo 'Visa à obtenir à la frontière';
                elseif ($une->etat == 2)
                    echo 'Aucun Visa requis'; ?></td>
            <td class="duree"><?php echo $une->duree; ?></td>
        </tr>
    <?php endforeach; ?>
    </table>
</div>

À la place de la classe text-left, crée une règle css pour les td de cette table (il faudra alors l'identifier soit avec un attribut id soit avec une classe). Idem pour différencier les tr pairs et impairs, tu peux le faire avec le sélecteur css: tr:nth-child(even) { ... } et tr:nth-child(odd) { ... }.

[killer2015]

j'ai simplifier au max et ca fonctionne merci beaucoup

(j'ai tester ton code mais il m'a fais buger mon pc il a afficher la table qui est déjà conséquente 188 fois )

[CosmoKnacki]

Si tu obtiens 188 fois la même table, c'est que tu as placé le code d'exemple que j'ai donné dans une boucle ou je ne sais pas où, car ce bout de code affiche juste une table, pas 188.

[killer2015]

je sais tkt ca ma fais rigoler