Add search to where it matters

artists/templates/artists/index.html

@@ -4,9 +4,24 @@
 
 {% block content %}
     <h1>Artists</h1>
-    <ul>
-        {% for artist in artists %}
-        <li><a href="/artists/{{ artist.slug }}">{{ artist.romanized_name }}</a></li>
-        {% endfor %}
-    </ul>
+    <form action="{{ request.path }}" method="GET">
+        <div class="input-group mb-3">
+            <input type="text" class="form-control" placeholder="Search" aria-label="Search" aria-describedby="search-button" name="q">
+            <button class="btn btn-outline-secondary" type="submit" id="search-button">Search</button>
+        </div>
+    </form>
+    <table class="table">
+        <thead>
+            <th>Artist</th>
+        </thead>
+        <tbody>
+            {% for artist in artists %}
+            <tr>
+                <td>
+                    <a href="/artists/{{ artist.slug }}">{{ artist.romanized_name }}</a>
+                </td>
+            </tr>
+            {% endfor %}
+        </tbody>
+    </table>
 {% endblock %}

artists/views.py

@@ -6,7 +6,13 @@ from songs.models import OutsideSong
 
 def artist_index(request):
     artists = Artist.objects.all()
-    return render(request,'artists/index.html',{'artists':artists})
+    objs = {}
+    if "q" in request.GET:
+        q = request.GET['q']
+        artists = Artist.objects.filter(name__contains=q) | Artist.objects.filter(romanized_name__contains=q)
+        objs['q'] = q
+    objs['artists'] = artists
+    return render(request,'artists/index.html',objs)
 
 def artist_show(request, slug):
     artist = Artist.objects.filter(slug=slug)[0]

songs/templates/songs/index.html

@@ -4,6 +4,12 @@
 
 {% block content %}
     <h1>Songs</h1>
+    <form action="{{ request.path }}" method="GET">
+        <div class="input-group mb-3">
+            <input type="text" class="form-control" placeholder="Search" aria-label="Search" aria-describedby="search-button" name="q">
+            <button class="btn btn-outline-secondary" type="submit" id="search-button">Search</button>
+        </div>
+    </form>
     {% include 'components/song-table.html' with songs=page_obj %}
     <nav aria-label="Pages">
         <ul class="pagination">

songs/views.py

@@ -5,10 +5,16 @@ from .models import Song
 # Create your views here.
 def song_index(request):
     songs = Song.objects.all()
+    objs = {}
+    if "q" in request.GET:
+        q = request.GET['q']
+        songs = Song.objects.filter(title__contains=q) | Song.objects.filter(romanized_title__contains=q)
+        objs['q'] = q
     paginator = Paginator(songs, 100)
     page_number = request.GET.get('page',1)
     page_obj = paginator.get_page(page_number)
-    return render(request,'songs/index.html',{'page_obj':page_obj})
+    objs['page_obj'] = page_obj
+    return render(request,'songs/index.html',objs)
 
 def song_id(request, id):
     song = Song.objects.filter(id=id)[0]