added search

YongeStreet/Views/Home/Index.cshtml

@@ -6,6 +6,22 @@
 }
 
 
+<p>
+    Le Québec possède un reseau routier impréssionant.
+</p>
+
+
+<div class="uk-form-horizontal uk-margin-large">
+    <div class="uk-margin">
+        <label class="uk-form-label" for="city-name">Nom de Ville</label>
+        <div class="uk-form-controls">
+            <input class="uk-input" id="city-name" type="text" name="search" placeholder="Rimouski" hx-get="/Home/CityList_Partial"
+                   hx-trigger="keyup changed delay:500ms"
+                   hx-target="#city-table-body"
+                   hx-swap="innerHTML">
+        </div>
+    </div>
+</div>
 
 <table class="uk-table uk-table-striped">
     <thead>
@@ -15,16 +31,10 @@
         <th></th>
     </tr>
     </thead>
-    <tbody>
-    @foreach(var city in Model.Cities)
-    {
-        <tr>
-            <td>@Html.ActionLink(city.Name, "City", "Home",  new {City=city.Name})</td>
-            <td>@((city.TotalStreetSize / 1000 ).ToString("N"))</td>
-            <td>@string.Join(", ", city.AvailableDates)</td>
-        </tr>
-    }
-    
-    
+    <tbody id="city-table-body"
+           hx-get="/Home/CityList_Partial"
+           hx-trigger="load"
+           hx-target="#city-table-body"
+           hx-swap="innerHTML">
     </tbody>
 </table>