Preserving form input

Author: bradtraversy

listings/views.py

@@ -63,7 +63,8 @@ def search(request):
     'state_choices': state_choices,
     'bedroom_choices': bedroom_choices,
     'price_choices': price_choices,
-    'listings': queryset_list
+    'listings': queryset_list,
+    'values': request.GET
   }
 
   return render(request, 'listings/search.html', context)

templates/listings/search.html

@@ -12,20 +12,24 @@
             <div class="form-row">
               <div class="col-md-4 mb-3">
                 <label class="sr-only">Keywords</label>
-                <input type="text" name="keywords" class="form-control" placeholder="Keyword (Pool, Garage, etc)">
+                <input type="text" name="keywords" class="form-control" placeholder="Keyword (Pool, Garage, etc)" value="{{ values.keywords }}">
               </div>
 
               <div class="col-md-4 mb-3">
                 <label class="sr-only">City</label>
-                <input type="text" name="city" class="form-control" placeholder="City">
+                <input type="text" name="city" class="form-control" placeholder="City" value="{{ values.city }}">
               </div>
 
               <div class="col-md-4 mb-3">
                 <label class="sr-only">State</label>
                 <select name="state" class="form-control">
                   <option selected="true" disabled="disabled">State (All)</option>
                   {% for key,value in state_choices.items %}
-                      <option value="{{ key }}">{{ value }}</option>
+                      <option value="{{ key }}" 
+                      {% if key == values.state %}
+                        selected
+                      {% endif %}
+                      >{{ value }}</option>
                     {% endfor %}
                 </select>
               </div>
@@ -37,15 +41,23 @@
                 <select name="bedrooms" class="form-control">
                   <option selected="true" disabled="disabled">Bedrooms (Any)</option>
                   {% for key,value in bedroom_choices.items %}
-                      <option value="{{ key }}">{{ value }}</option>
+                      <option value="{{ key }}"
+                      {% if key == values.bedrooms %}
+                        selected
+                      {% endif %}
+                      >{{ value }}</option>
                     {% endfor %}
                 </select>
               </div>
               <div class="col-md-6 mb-3">
                 <select name="price" class="form-control">
                   <option selected="true" disabled="disabled">Max Price (All)</option>
                   {% for key,value in price_choices.items %}
-                      <option value="{{ key }}">{{ value }}</option>
+                      <option value="{{ key }}"
+                      {% if key == values.price %}
+                        selected
+                      {% endif %}
+                      >{{ value }}</option>
                     {% endfor %}
                 </select>
               </div>