Je suis en train de soumettre un formulaire de recherche sur la touche Entrée ainsi que sur le bouton. Le clic fonctionne bien. Le texte est effacé, les rendoirs / la page de recherche et l'indice de recherche affichés. Lorsque je frappe Entrée, le texte de recherche s'éclaircit, mais rien d'autre. J'ai ajouté une poignée de main-d'œuvre, mais ça ne marche pas. Comment puis-je effectuer la recherche sur ENTER?
handleSubmit(e) {
e.preventDefault(e);
document.getElementById("search-input")
.addEventListener("keydown", function (event) {
// event.persist();
if (event.keyCode === 13) {
document.getElementById("search-button").click();
}
});
this.setState( {
searchItem: "",
})
};
render() {
return (
<div id="search-form">
<form>
<input
type="text"
id="search-input"
placeholder="Search videos"
value={this.state.searchItem}
onChange={this.update()}
/>
<button type="submit" id="search-button" onClick={this.handleSubmit}>
<Link to={`/search?search=${this.state.searchItem}`}><img id="search-icon" src="https://image.flaticon.com/icons/svg/49/49116.svg" alt="" /></Link>
</button>
</form>
</div>
);
}
3 Réponses :
document.getElementById("id_of_your_textbox").addEventListener("keydown", function(e) {
// Prevent a blank line.
e.preventDefault();
// Enter is pressed.
if (e.keyCode == 13) {
this.submit();
}
}, false);
Simply, edit document.getElementById("search-button").click(); to document.getElementById("search-button").submit();
VOTRE EVENTLISTENER ne peut pas être à l'intérieur de la fonction Handlesubmit.
form.addEventListener('submit', handleSubmit());
Devrait être handlesubmit au lieu de handlesubmit () . Nous voulons juste indiquer la fonction, pas l'appeler.
Dans les formulaires, Entrée à Soumettre est activé par défaut, mais vous devez indiquer le formulaire quoi faire sur Soumettre. Ajoutez donc un événement Onsubmit code> à votre formulaire: handleSubmit(e) {
e.preventDefault(); //prevents the form from submitting before the end of this function
//do something here...
}
Vous pouvez vérifier ce problème. Cela pourrait vous aider. Stackoverflow.com/cevestions / 20484738 / ...
Est-ce que cela répond à votre question? Comment soumettre un formulaire lorsque la clé de retour est pressé?