Accueil Technologie
Comment ajouter des fonctions de recherche aux applications Django

Comment ajouter des fonctions de recherche aux applications Django

L’ajout d’une fonction de recherche à votre application web permet à vos utilisateurs de la parcourir facilement en recherchant ce qu’ils veulent. Django fournit un support intégré pour construire une fonction de recherche en utilisant son puissant ORM et ses outils de requête. Avec Django, vous pouvez mettre en œuvre différents types de recherche, y compris des recherches par mot-clé, des recherches simples et des recherches avancées avec des filtres.

Mise en œuvre de la fonctionnalité de recherche dans Django

Django vous permet d’implémenter différents types de recherche grâce à ses méthodes et fonctions intégrées. Vous pouvez mettre en œuvre une simple recherche par mot-clé ou une recherche avancée en fonction de votre cas d’utilisation. Vous devriez mettre en œuvre une recherche avancée si vous avez une application complexe, comme un site web de commerce électronique, tandis qu’une recherche simple par mot-clé convient à des projets moins complexes.

Le code utilisé dans cet article se trouve sur GitHub et est libre d’utilisation sous la licence MIT.

Implémenter une recherche simple par mot-clé dans Django

Pour créer une fonction de recherche simple, vous devez commencer par construire votre barre de recherche. Vous pouvez construire votre barre de recherche dans votre barre de navigation. Bootstrap fournit une barre de navigation prête à l’emploi avec une barre de recherche, et vous pouvez facilement intégrer Bootstrap et ses composants dans votre projet Django. Créez votre barre de recherche dans un fichier HTML, définissez la méthode de formulaire à POST, et donnez au champ de saisie une valeur nom attribue comme ceci :

 <form class="d-flex" role="search" method="POST">
 {% csrf_token %}
<input
    class="form-control me-2"
    type="search"
    placeholder="Search"
    name="search_query"
    required aria-label="Search"
 >
<button class="btn btn-outline-success" type="submit">Search</button>
</form>

Dans le code ci-dessus, le nom du champ de saisie est search_query. Le formulaire utilise le jeton CSRF de Django pour prévenir les attaques CSRF. Pour que votre barre de recherche fonctionne, suivez les étapes suivantes.

  • Ouvrez votre views.py et importez votre modèle depuis le fichier models.py fichier :

 from .models import ModelName
  • Créer une fonction d’affichage pour la fonction de recherche :

 def search_feature(request):
    # Check if the request is a post request.
    if request.method == 'POST':
        # Retrieve the search query entered by the user
        search_query = request.POST['search_query']
        # Filter your model by the search query
        posts = Model.objects.filter(fieldName__contains=search_query)
        return render(request, 'app/template_name.html', {'query':search_query, 'posts':posts})
    else:
        return render(request, 'app/template_name.html',{})

La fonction ci-dessus vérifie d’abord si le client envoie un POST . Si la vérification est positive, il récupère la valeur de la requête de recherche de l’utilisateur comme suit :

 search_query = request.POST['search_query']

Dans request.POST[’search_query’], ‘search_query’ doit être remplacé par le nom du champ de saisie de votre barre de recherche.

Après avoir récupéré la valeur de la requête de l’utilisateur, la fonction filtre le modèle à l’aide de la fonction __contains méthode. La méthode __contains n’est pas sensible à la casse. Pour utiliser cette méthode, vous devez respecter le format suivant :

 fieldName__contains

Par exemple, si vous souhaitez que vos utilisateurs effectuent une recherche sur la base d’un champ de modèle appelé nomvous devriez modifier votre code pour qu’il ressemble à ceci :

 name__contains=search_query

Enfin, la fonction rend un modèle et transmet la requête de recherche et le modèle filtré en tant que contexte.

Cependant, si la méthode du formulaire n’est pas une méthode POST la fonction rend un modèle avec un dictionnaire vide et ne traite pas la requête de recherche.

Créer un modèle pour le résultat de la recherche

  • Créez un fichier HTML pour renvoyer les résultats de votre recherche au client.

un dossier contenant quatre fichiers HTML, dont un fichier appelé search_post.html

  • Affichez le résultat de la recherche sur la page pour que l’utilisateur puisse le voir. Le code de votre fichier HTML devrait ressembler à ceci :

 {% if query %}
    <div>
        <div>
        <!-- loop through search query -->
        {% for post in posts %}
            <div>
                <!-- return search query -->
                <p>{{post.title}}</p>
            </div>
        {% endfor %}
        </div>
    </div>
{% else %}
    <!-- return a message if the user does not enter a search query -->
    <h1>Please enter a search query</h1>
{% endif %}

Le modèle HTML ci-dessus vérifie si l’utilisateur saisit une requête de recherche dans la barre de recherche. Si l’utilisateur saisit une requête de recherche, un fichier boucle for passe en revue les résultats de la recherche et les renvoie à l’utilisateur. S’il n’y a pas de requête de recherche, un message s’affiche pour que l’utilisateur en saisisse une. Il se peut qu’il n’y ait pas de requête de recherche si l’utilisateur se rend directement à l’URL sans remplir la barre de recherche, c’est-à-dire s’il saisit une URL telle que mywebsite.com/search directement dans le navigateur. Vous devez vous assurer que vous utilisez l’héritage de modèle de Django dans votre fichier HTML.

une page de blog montrant quelques résultats après qu'un utilisateur ait cherché pt

  • Modifiez votre code HTML pour qu’il renvoie un message d’erreur s’il n’y a pas de résultat de recherche.

 {% if query %}
    <div>
        <div>
        <!-- check if there is a result in the database-->
        {% if posts %}
            <!-- loop through search query if there is a result -->
            {% for post in posts %}
                <div>
                    <!-- return search query -->
                    <p>{{post.title}}</p>
                </div>
            {% endfor %}
            <!-- return a message if there are no results found. -->
        {% else %}
            <h3>No search results found</h3>
        {% endif %}
        </div>
    </div>
{% else %}
    <h1>Please enter a search query</h1>
{% endif %}

Le nouveau modèle HTML permet une meilleure expérience utilisateur. Il introduit une instruction conditionnelle pour vérifier si un résultat de recherche est disponible dans la base de données. Si c’est le cas, il affiche le résultat de la recherche ; sinon, il envoie à l’utilisateur un message d’erreur.

une page de recherche indiquant à l'utilisateur qu'il n'y a pas de résultat pour sa recherche

Configurez vos modèles d’URL

  • Si vous ne l’avez pas encore fait, créez une urls.py dans le répertoire de votre application.
  • Dans votre urls.py, crée un modèle d’URL pour votre page de recherche :

 from django.urls import path
from . import views

urlpatterns = [
    path('search/', views.search_feature, name='search-view'),
]

Le programme ci-dessus importe d’abord le fichier chemin et la fonction vues lié à l’application. Il crée ensuite un chemin nommé recherche-vue pour la page de recherche.

  • Ajoutez un formulaire d’action à votre barre de recherche. L’URL de l’action doit pointer vers le chemin d’accès à la vue de recherche. Dans ce cas, le formulaire pointe vers vue-recherche.

 <form class="d-flex" role="search" method="POST" action="{% url 'search-view' %}">
   <input
       class="form-control me-2"
       type="search"
       placeholder="Search for something"
       name="search_query"
       required aria-label="Search"
   >
   <button class="btn btn-outline-success" type="submit">Search</button>
</form>

Sans une action de formulaire pointant vers le chemin de l’URL de recherche, votre fonction de recherche ne fonctionnera pas. N’oubliez pas que le chemin de l’URL de recherche doit pointer vers la vue de Django qui gère la logique de votre fonction de recherche.

Créer une fonction de recherche pour plusieurs champs de modèle

Si vous souhaitez améliorer l’expérience utilisateur de votre application web, vous pouvez permettre à vos utilisateurs d’effectuer des recherches sur plusieurs champs de votre modèle. Par exemple, dans une application de blog, vous pouvez permettre à vos utilisateurs d’effectuer des recherches sur la base des titres des articles ou des noms des auteurs.

Pour mettre en œuvre cette fonctionnalité, vous devez utiliser la méthode Q fourni par Django. Vous devez importer l’objet Q L’objet de votre views.py fichier comme ceci :

 from django.db.models import Q

Après l’importation Q, vous devez modifier votre fonction de visualisation comme suit :

 def search_post(request):
    if request.method == 'POST':
        search_query = request.POST['search_query']
        posts = Post.objects.filter(Q(title__icontains=search_query) | Q(author__icontains=search_query))
        return render(request, 'app/template_name.html', {'query':search_query, 'posts':posts})
    else:
        return render(request, 'app/template_name.html',{})

Dans le programme ci-dessus, la fonction postes filtre le modèle en fonction du titre de l’article ou du nom de l’auteur. La fonction utilise la variable OU (dans ce cas, un symbole de tuyau) pour effectuer le filtrage.

Améliorer l’expérience utilisateur grâce à une fonction de recherche

Une fonction de recherche dans votre application web améliore efficacement l’expérience utilisateur et la convivialité générale. Avec Django, il vous suffit d’exploiter les fonctionnalités intégrées pour faire fonctionner votre fonction de recherche, ce qui présente des avantages significatifs pour vous et vos utilisateurs.

Leave your vote

0 0 votes
Évaluation de l'article
S’abonner
Notification pour
guest
0 Commentaires
Le plus ancien
Le plus récent Le plus populaire
Commentaires en ligne
Afficher tous les commentaires

Log In

Forgot password?

Don't have an account? Register

Forgot password?

Enter your account data and we will send you a link to reset your password.

Your password reset link appears to be invalid or expired.

Log in

Privacy Policy

Add to Collection

No Collections

Here you'll find all collections you've created before.

0
Nous aimerions avoir votre avis, veuillez laisser un commentaire.x