Déclencher la saisie semi-automatique sans l'envoi d'un formulaire
Je suis en train d'écrire une application web très simple avec trois saisies de texte. Les entrées sont utilisées pour générer un résultat, mais tout le travail est fait en Javascript, donc il n'est pas nécessaire de soumettre un formulaire. J'essaie de trouver une façon de passer le navigateur pour stocker les valeurs d'entrée pour la saisie semi-automatique comme il le ferait s'ils étaient dans une forme qui lui a été soumis.
J'ai essayé de donner les entrées de saisie semi-automatique="sur" manuellement, mais sans un formulaire, le navigateur n'a aucun moyen de savoir quand il doit stocker les valeurs, donc cela n'a aucun effet.
J'ai aussi essayé en enveloppant les entrées dans un formulaire qui a onSubmit="return false;", mais en empêchant le formulaire de soumission semble également empêcher le navigateur de stocker ses données d'entrée des valeurs.
Il est bien sûr possible d'utiliser manuellement localStorage ou d'un cookie de persister entrées et de générer de saisie semi-automatique des conseils de ceux-ci, mais je suis l'espoir de trouver une solution qui s'appuie sur navigateur natif de comportement plutôt que de dupliquer il à la main.
- Pas sûr, Si je comprends correctement à la question. Ça veut dire que vous aurez chargé de l'information dans le navigateur de sorte que le javascript d'effectuer une recherche dans certains préchargé données à l'aide de l'information provenant de trois zone de saisie? Certains de saisie semi-automatique des implémentations j'ai vu, utilise Ajax pour charger les résultats. Qui ne s'adapte pas votre modèle, n'est ce pas?
- Ici, essayez la solution fournie à une question similaire: stackoverflow.com/questions/8400269/...
- Je veux simplement le navigateur pour traiter les entrées comme si elles faisaient partie d'un formulaire qui a été soumis, en ce que l'utilisateur verra les valeurs qu'ils avaient précédemment saisies comme des suggestions de saisie semi-automatique, sans réellement l'envoi d'un formulaire.
- Qui sonne comme il a besoin d'un enregistrement de l'historique des entrées. Des sons comme la façon dont le navigateur enregistre les entrées d'un formulaire à autosuggest/saisie semi-automatique. Autant que je sache, nous aurons besoin de locaux de stockage. Ce plugin amplifyjs c'est bon. Pour vos critères, aucune storatge, pas de connexion au serveur de recherche via le formulaire de soumission ajax(ou similaire), où est l'histoire viendra? Cela sonne comme une application hors ligne plus proche d'une extension de navigateur, plutôt que d'une application web. Votre question a piqué ma curiosité, et j'espère que quelqu'un peut répondre aussi.
- Double de stackoverflow.com/questions/9201858/...
Vous devez vous connecter pour publier un commentaire.
Testé avec Chrome, IE et Firefox:
Dans votre Javascript déclencher l'envoi, par exemple,
$("form").submit();
$("#submit_button").click()
(mise à jour à partir d'observations)Vous avez besoin de retourner à une page vide, at /content/vide pour obtenir des & post (about:blank n'a pas fonctionné pour moi, mais YMMV).
$("form").submit();
, vous avez à utiliser, par exemple,$("#submit_button").click()
about:blank
pour l'iframe et la forme. Vous devriez être en mesure de reproduire ceci sur votre fin.Nous savons que le navigateur enregistre ses informations uniquement lorsque le formulaire est soumis, ce qui signifie que nous ne pouvons pas annuler avec
return false
oue.preventDefault()
Ce que nous pouvons faire c'est de présenter les données de nulle part sans recharger une page. On peut le faire avec un
iframe
Démo sur JSfiddle (testé dans IE9, Firefox, Chrome)
Pour plus de la actuellement accepté réponse:
Il n'y a pas de javascript supplémentaire. Normalement, vous fixez un gestionnaire à l'
submit
événement de l'écran pour envoyer le XHR et ne l'annulez pas.Exemple en Javascript
Non-prise en charge de javascript
Idéalement, vous devez laisser le travail de la forme sans javascript aussi, donc, supprimer le
target
et de définir l'action à une page qui doit recevoir votre formulaire de données.Et puis il suffit de l'ajouter via javascript lorsque vous ajoutez le
submit
événement:Je n'ai pas testé, mais il pourrait fonctionner si vous soumettez le formulaire pour un iframe masqué (ainsi que le formulaire est soumis, mais la page n'est pas rechargée).
Peut-être vous pouvez utiliser cette Twitter Typeahead...très complet de la mise en œuvre d'une saisie semi-automatique, locale et à distance prefetch, ce qui rend l'utilisation de localStorage pour persister les résultats et il est également à afficher un indice de l'élément d'entrée...le code est facile à comprendre et si vous ne voulez pas utiliser la totalité de jquery plugin, je pense que vous pouvez prendre un coup d'oeil du code pour voir comment obtenir ce que vous voulez...
Pour ceux qui préfèrent ne pas changer leur forme actuelle fonctionnalité, vous pouvez utiliser un second formulaire pour recevoir des copies de toutes les valeurs d'un formulaire et de le soumettre ensuite à une page blanche à l'avant de votre formulaire principal soumet. Ici est entièrement vérifiable document HTML à l'aide de JQuery Mobile démonstration de la solution.
La
save_autofill
fonction doit être appelée sur votre formulaire principal bouton "soumettre". Si vous avez un script de la fonction qui envoie de votre forme, de la place que l'appel après l'save_autofill
appel. Vous devez avoir un nom de zone de texte dans votrehidden_form
pour chacun dans votre formulaire principal.Si votre site utilise le protocole SSL, vous devez changer l'URL pour
about:blank
avechttps://about:blank
.De ce que j'ai cherché.. il semble que vous avez besoin pour identifier les noms. Certains des noms comme 'nom', 'email', 'téléphone', 'adresse' sont automatiquement enregistrées dans la plupart des navigateur.
Bien, le problème c'est que les navigateurs poignée de ces noms differenetly. Par exemple, ici, est en chrome de la regex:
Mais chrome utilise également
autocomplete
, de sorte que vous pouvez personnaliser le nom et mettre de saisie semi-automatique de type, mais je crois que ce n'est pas pour les champs personnalisés..Voici chrome standard
Et c'est une autre chose dans IE, Opera et Mozilla. Pour l'instant, vous pouvez essayer la solution iframe, vous pouvez la soumettre. (C'est peut-être quelque chose de semi-standard)
Eh bien, c'est tout ce que je peux vous aider.
Vous pouvez utiliser jQuery pour persister de saisie semi-automatique des données dans le localstorage quand focusout et quand focusin il auto-complété à la valeur persisté.
c'est à dire
Vous pouvez également lier la persistance de la logique sur d'autres événements aussi en fonction de la vos besoins des applications.
Assurez-vous que vous envoyez le formulaire par la POSTE. Si vous envoyez via ajax, ne
<form autocomplete="on" method="post">
, en omettant leaction
attribut.vous pouvez utiliser le "." dans les deux iframe src et de la forme de l'action.