Page 1 sur 1

Trigger script JQuery (qui filtre/highlight un texte écrit dans un input)

Posté : 15 déc. 2020, 18:07
par Ben_Lyon
Bonsoir tout le monde. Comment pourrais-je trigger un script JQuery (qui filtre/highlight un texte écrit dans un input) avec un bouton (qui insère un texte dans cet input comme si nous l'avions écrit) s'il vous plaît ? Actuellement le bouton ajoute le texte mais ne trigger pas le script JQuery.

J'ai vu l'option .trigger ("clic") mais cela n'a pas fonctionné. Avez-vous une idée s'il vous plaît? Voici mon code actuel :

https://jsfiddle.net/hzrvwn0c/

Code : Tout sélectionner

<style>
mark {background: yellow;}
</style>
 
<!-- input1 -->
<input id="idinput1" name="nameinput1" type="text" />
 
<!-- text that will be filtered/highlighted when we write in input1 -->
<span id="thistext1">text1</span><br />
 
<!-- button1 -->
<button id="button1">add text2</button>

<!-- WORKS = jquery script to filter + highlight text we wrote in input1 -->
<script src="https://checkandsave.info/mark.js"></script> <!-- dependency -->
<script>
$(function(){
var $input = $("input[name='nameinput1']"),
$context = $("#thistext1");
$input.on("input", function(){
var term = $(this).val();
$context.show().unmark();
if (term) {
$context.mark(term, {
done: function(){
$context.not(":has(mark)").hide();
}});}});});
</script>
 
<!-- DOESN'T WORK = script to trigger the filter/highlight jquery script with the text added by the button1 -->
<script>
$('#button1').click(function()
{$('#idinput1').val('text2')});
</script>
Merci pour votre aide.

NB: J'ai cherché d'autres solutions avec Javascript uniquement ou React JS mais cela n'a pas fonctionné non plus ou trop compliqué donc je reste sur JQuery pour le moment.

Re: Trigger script JQuery (qui filtre/highlight un texte écrit dans un input)

Posté : 16 déc. 2020, 11:43
par webmaster
Bonjour,

Je pense que la dernière syntaxe est bonne, mais il faudrait la placer dans la partie qui détecte le bon chargement de l'ensemble de la page :

Code : Tout sélectionner

$(function() {

}

Re: Trigger script JQuery (qui filtre/highlight un texte écrit dans un input)

Posté : 17 déc. 2020, 19:40
par Ben_Lyon
En effet! Merci pour ton conseil. J'en ai profité pour rajouter un bouton reset de l'input/une image qui indique si le filtre est actif/la recherche des mots entiers pas des lettres séparées : https://jsfiddle.net/3L0da8pr/ .

Je vais pouvoir mettre mon site à jour (c'est un portail sur la vérification de l'actualité et la sauvegarde de l'information https://checkandsave.info/usa/index.php ).

Bonne soirée!