'Adding search bar function into a django project

I'm trying to add search bar in my application but I don't know how to query a database to gives the things that user's search for. I want when user search for a user in a post or category in a post of model to shows the result that user search for, like YouTube search and facebook search, How can i do this in django to give me what i want ?

this is my model:

class Photo(models.Model):
    user = models.ForeignKey(User, on_delete=models.CASCADE)
    category = models.CharField(max_length=30,null=True, blank=False)
    image = CloudinaryField(blank=False, null=False)
    description = models.TextField(null=True)
    date_added = models.DateTimeField(auto_now_add=True)
    phone = models.CharField(max_length=12, null=False, blank=False)
    price = models.CharField(max_length=30,blank=False)
    location = models.CharField(max_length=20, blank=False)

    def __str__(self):
        return str(self.category)

my search form in dashboard template:

  <div class="container">
   <div class="row justify-content-center">
     <form action="{% url 'search' %}" method="get">
      <input class="form-control me-2" type="search" placeholder="Search" aria- 
      label="Search">
      <br>
      <button class="btn btn-outline-success" type="submit">Search</button>
     </form>
  </div>
 </div>

the post card in dashboard template:

<div class="container">
      <div class="row justify-content-center">
           {% for photo in photos reversed %}
                    <div class="col-md-4">  
                        <div class="card my-2">
                          <img class="image-thumbail" src="{{photo.image.url}}" alt="Card image cap">
                       
                          <div class="card-body">
                               <h2 style="color: yellowgreen; font-family: Arial, Helvetica, sans-serif;">
                               {{photo.user.username.upper}}
                               </h2>
                          <br>
                          <h3>{{photo.category}}</h3>
                          <h4>{{photo.price}}</h4>  
                         </div>
                         <a href="{% url 'Photo-view' photo.id %}" class="btn btn-warning 
                          btn-sm m-1">Buy Now</a>
                       </div>
                 </div>
                 {% empty %}
                 <h3>No Files...</h3>
                 {% endfor %} 
                </div> 
        </div>

the dashboard view:

def dashboard(request):
    photos = Photo.objects.all()
    context = {'photos': photos}
    return render(request, 'dashboard.html', {'photos': photos} ) 

the search bar view:

def search(request):

    return render(request, 'search.html')

urls:

path('', views.dashboard, name='dashboard'),
path('search/', views.search, name='search')


Solution 1:[1]

You can make it using filter method inside your view. Something like:

def dashboard(request):

   photos_filter = request.GET.get('filtered[]', False)

   photos = Photo.objects.all()

   if photos_filter:
      photos_filter = eval(photos_filter)
   if photos_filter['id'] == 'category':
      payments = payments.filter(
          category__icontains=payments_filter['value'])
   if photos_filter['id'] == 'user':
      payments = payments.filter(
           user__id=payments_filter['value'])

   context = {'photos': photos}
   return render(request, 'dashboard.html', {'photos': photos} )

And so on, you can add any filter you like. And in your URL you just add

/?filtered[]=%7B%22id%22:%22category%22,%22value%22:%22Nature%22%7D

Your code will see this filter like a dict obj: {'id': 'category', 'value': 'Nature'}. So after it, you'll get all photos with the category nature

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1