Discussion :

[pinpinsql]

Bonjour,

Novice en JS, je viens chercher de l'aide pour cacher un bouton généré par un progiciel (je n'ai pas beaucoup de souplesse).

Voici mon html et CSS :

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
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
<div style="padding: 5px 10px 0 10px;">
    <br>
</div>
<div style="padding: 5px 10px 0 10px;"><img alt="" src="#[FIELD('Image')]#" style="width: 150px; height: 150px;" class="fr-draggable"></div>
<div style="padding: 5px 10px 0 10px;">
    <br>
</div>
<div style="padding: 5px 10px 0 10px;">
    <br>
</div>
<div>#[FIELD('Description')]#</div>
<br>
<br>
<button data-ezv-tags="#[EZVTAG-EXTENDED-NEW-REQUEST CI='XTRA.CATALOG_GUID' style='font-size:14px;border-radius:0px;'  bgOver=@undefined@ txtOver=@undefined@  bgOut=@undefined@ txtOut=@undefined@  LB='Demander' SDRV='()']#" style="font-size:14px;border-radius:0px;">Demander</button>
<br>
<style type="text/css">
    .button_replace {
        background-color: #FF5000;
        border-radius: 8px !important;
        border: 1px solid #FF5000;
        transition: all ease 0.2s;
        font-size: 14px;
        font-weight: bold;
        padding: 16px 34px;
        width: 100%;
    }
    
    .button_replace span {
        color: white !important;
    }
    
    .button_replace:hover {
        background-color: white;
        color: #FF5000 !important;
    }
    
    .button_replace:hover span {
        color: #FF5000 !important;
    }
    
    .containerScroll:after {
        content: none;
        height: 110px;
        z-index: 50;
        pointer-events: none;
        background: rgb(255, 255, 255);
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        background: -moz-linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
        background: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
        background: linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
        filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#ffffff", endColorstr="#ffffff", GradientType=1);
    }
    
    </div>
 
</style>

Mon besoin, cacher le bouton "demander" si dans le champs "description" il y'a une chaine de caractère précise.
Il n'est possible d'utiliser que du JS.

Merci pour votre aide.

[nibors]

Bonjour,

tu peux créé une class css

Code :

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

1
2
3
4
 
.cacheBouton {
  display: none;
}

et l'ajouter à ton bouton si le texte de description contient la chaine que tu cherches.

[pinpinsql]

Bonjour,

Effectivement j'avais trouvé ça, et pour compléter j'ai la main sur la chaine de caractère qui apparaitra dans le champ description.
Dans l'idée, je clique sur un premier bouton, il fait apparaitre la description correspondante qui contient le bouton sauf si on repère une chaine de caractère.
C'est la partie conditionnelle qui me pose probléme, mets recherche m'ont amené vers du JS, mais je me trompe peut être.?!

[nibors]

Dans ce cas tu peux mettre le code JS en question dans le code du onClick du premier bouton qui fait apparaitre la description.

je te mets un exemple de la fonction indexOf qui te permet de dire si une chaine de caractere en contient une autre.

Code :

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

1
2
3
4
 
if (description.indexOf("laChaineQueTuCherches") > -1) { // indexOf return -1 si la chaine n'est pas là, donc si c'est supérieur à -1 c'est que la chaine est là
   // code qui cache le bouton
}