11523 sujets

JavaScript, DOM et API Web HTML5

Barre de recherche et résultat

Bonjour,

Je souhaiterais ajouter une barre de recherche dans ma page HTML et qu'à côté de ma barre de recherche il y ait le résultat numérique avec afficher :
exemple: " Résultat de la recherche : 10 éléments ", pour cela j’appuie sur un bouton

ma partie HTML : 

<form name = "barre">
          < input type = " text " name = " " id="barre" value= "recherche..."</form>
<input type=" button " onclick=" rechercher() " value = " start " </input>


mon problème ? je ne suis pas fort en algorithmie, serait ce possible de m'aider sur l'algo de la fonction rechercher en javascript si quelqu'un aurai la gentillesse de m’éclaircir, ce serai avec grand plaisir !

Merci cordialement
Modifié par 6l20 (04 Jul 2014 - 16:00)
Bonjour,

Je réponds à votre question par une autre question :
- Que souhaitez-vous chercher exactement : un mot clé présent dans votre site, un mot-clé présent sur le web, une donnée présente dans une base de donnée, etc. ?
Si vous souhaitez une réponse qui vous sera si possible utile, il faut être plus précis...

D'autre part, le code HTML que vous donnez dans votre message comporte plusieurs erreurs (il ne faut pas d'espace entre les noms d'attributs, le signe = et les valeurs d'attributs, le premier élément input n'est pas fermé, etc.). Je vous conseille de valider votre code avec un navigateur avant de le coller dans votre message sur ce forum, et d'utiliser la colorisation syntaxique.
Le code exact est le suivant :
<form name="formbarre">
 <input type="text" name="barre" id="barre" value= "recherche..." />
 <input type="button" onclick="rechercher() " value="start" />
</form>
pour le html je l'ai modifié avant, je m'étais trompé dans la balise "button" et le type de la barre de recherche est "search", j'ai aussi modifié d'autre chose, maintenant j'ai :

<form class="Fbarre">
<input type="search" name "barre" id"champ1" value=" rechercher ..."</input>
<button onlick= 'rechercher()'> </button></form>

je l'ai compilé entre temps, et cela affiche un un champ de texte et un bouton comme je le voulais

Mon véritable question est que, lorsque je rentre n'importe quelle mot, l'algorithme me retourne le nombre de fois que ce mot est affiché, avec une syntaxe, "Résultat de la recherche : 10 éléments trouvés", ceci est un exemple de ce que je voudrais, et en Javascript.

Avant de venir sur le forum j'ai essayer pendant des heures, j'ai pas réussi.....

Merci en tout cas, de m'accorder votre temps.
Modérateur
Salut,

Hum...... 

<form name = "barre">
          < input type = " text " name = " " id="barre" value= "recherche..."</form>
<input type=" button " onclick=" rechercher() " value = " start " </input>


bof....

 <input type="button" onclick="rechercher() " value="start" />


et d'une manière générale, la méthodologie de départ est tout bonne fausse. 

<form name="formbarre">
 <input type="text" name="barre" id="barre" value= "recherche..." />
 <input type="button" onclick="rechercher() " value="start" />
</form>


@dome91 : Bienvenue sur le forum. Cependant, je te conseille fortement de ne pas brûler les étapes. Là, comme tu pars, tu vas droit dans le mur. Ton html n'est pas du tout valide. Or là, tu fais ta demande pour dynamiser un code html bancale. Apprends d'abords l'html. C'est un langage très simple à aborder mais d'une très grande richesse. Lis ce très bon tutos est continu à étudier après. ne crois pas qu'après avoir lu ce tuto, tu maîtriseras. Tu auras mis un très bon pied à l'étrier, c'est tout.

@jlon :
Pourquoi "bof" ?
Bah voir un attribut html spécialisé pour le JS, ça sent l'intrusif, n'est pas ? 

document.getElementById('barre').onclick ....


Pourquoi ai je dis que la méthodo de départ n'est pas bonne ?
C'est une fonctionnalité spécialement créé en JS. Elle n'a pas de rapport direct avec le contenu. Cette fonctionnalité est un confort et seul le JS le permet. Donc il faut créer ce code html en JS et l'éditer dans le DOM.
Modifié par niuxe (04 Jul 2014 - 23:10)
Sujet clos
Aller à