Une zone de recherche ou une barre de recherche est une fonction populaire appliquée sur les applications Web pour que les visiteurs puissent rechercher des choses que vous trouvez. Une grande fonction de recherche UX peut raccourcir énormément le parcours de recherche d’informations et améliorer l’expérience utilisateur. Dans cet article, je vais suivre comment configurer une fonction de recherche fondamentale à l’aide de FLASK et de retour des données dans le cadre de données du Panda.

Ingrédients sur la barre de recherche du ballon plus rendement de la table de données dynamique à l’aide de pandas

Table des matières

• Barre de recherche
• Résultat de la recherche et API Easy2digital
• Script Python complet de la fonction de recherche d’applications Web à l’aide de Flask et Pandas
• FAQ

Barre de recherche

L’ajout d’une barre de recherche a besoin d’une méthode de formulaire et d’un type de recherche de méthode d’entrée ajoutée dans le dossier de script HTML Clientside. Dans Flask, nous devons créer un nouveau script HTML enregistré dans le dossier de modèle. Voici les codes comme suit:

Assurez-vous de vérifier deux valeurs variables. L’une consiste à ajouter le nom de la route «SymbolResult» dans le paramètre d’action qui est le même que le nom de route FLASK que vous créez dans le fichier de script Python.

L’autre est la valeur de l’ID d’entrée doit être la même que la valeur du nom de formulaire côté serveur. Je vais élaborer plus dans un instant.

Résultat de la recherche et API Easy2digital

Après avoir créé la page de barre de recherche ou une fonction de barre de recherche intégrée à toutes les pages que vous aimez. Nous devons maintenant développer un retour de données de r. ésultat de recherche après toute recherche d’utilisateurs. Fondamentalement, la communication des données comprend 2 sections – côté serveur et côté client

Côté serveur – Python, pandas

Tout d’abord, nous devons créer un itinéraire pour renvoyer le résultat de la recherche à l’utilisateur. Le nom de l’itinéraire ici doit être le même que le nom d’action du formulaire HTML côté client. C’est pour les connecter ensemble.

Ensuite, nous devons créer une variable de formulaire pour capturer l’entrée des utilisateurs de mots clés pour rechercher des informations. Et la valeur dans le get () doit être la même que l’ID sous la forme du côté client mentionné ci-dessus.

De plus, en fonction du mot-clé, nous pouvons l’utiliser pour connecter notre base de données. Ici, je prends une API Easy2digital par exemple et je sélectionne le ratio financier. Si vous êtes intéressé par la collection API Easy2digital. Veuillez consulter plus de détails sur cette page.

Nous utilisons les méthodes de demande et ajoutez des paramètres connexes dans le point de terminaison API Easy2digiatal pour récupérer les données liées au mot clé de la barre de recherche.

Enfin et surtout, pour le retour d’un tableau de données à afficher dans le résultat de la recherche, nous pouvons tirer parti de la trame de données du Panda et l’échantillon de code est le suivant:

• financialRatioData is for adding the table headers
• Row_data is for adding the value from each header

Côté client – HTML, CSS, Jinja

When the server-side code and route are ready, it returns the information related to the search keyword back to the client side. The question is how the client side in HTML, and CSS can display the data from the server side. Jinja2 and for loop, zip() methods can be used in this case. Here are the codes as follows:

Script Python complet de la barre de recherche d’applications Web à l’aide de Flask et Pandas

If you are interested in the Easy2Digital API, and the full python script of Chapter 65 – Flask Search Bar Plus Dynamic Data Table Return Using Pandas and Python, please subscribe to our newsletter by adding the message “Chapter 65”. We would send you the script immediately to your mailbox.

J’espère que vous apprécierez la lecture du chapitre 65 – Flask Search Bar Plus Dynamic Data Table Retour à l’aide de Pandas et Python. Si vous l’avez fait, veuillez nous soutenir en faisant l’une des choses énumérées ci-dessous, car cela aide toujours notre chaîne.

• Support and Donate to our channel through PayPal (paypal.me/Easy2digital)
• Subscribe to my channel and turn on the notification bell Easy2Digital Youtube channel.
• Follow and like my page Easy2Digital Facebook page
• Partagez l’article sur votre réseau social avec le hashtag # easy2digital
• Vous vous inscrivez à notre newsletter hebdomadaire pour recevoir les derniers articles, vidéos et codes de remise Easy2digital
• Subscribe to our monthly membership through Patreon to enjoy exclusive benefits (www.patreon.com/louisludigital)