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

Pour toutes les discussions javascript, jQuery et autres frameworks
Répondre
Ben_Lyon
Messages : 2
Enregistré le : 15 déc. 2020, 18:03

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

Message par Ben_Lyon » 15 déc. 2020, 18:07

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.

Avatar du membre
webmaster
Administrateur du site
Messages : 396
Enregistré le : 28 févr. 2017, 15:19

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

Message par webmaster » 16 déc. 2020, 11:43

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() {

}
TJS : 20 ans et mon livre Tout JavaScript chez Dunod
https://www.toutjavascript.com/livre/index.php

Ben_Lyon
Messages : 2
Enregistré le : 15 déc. 2020, 18:03

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

Message par Ben_Lyon » 17 déc. 2020, 19:40

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!

Répondre