infinite_scroll ok

librasteve · Nov 20, 2024 · 5dabd51 · 5dabd51
1 parent 56fc479
commit 5dabd51
Show file tree

Hide file tree

Showing 5 changed files with 5 additions and 15 deletions.
diff --git a/README.md b/README.md
@@ -7,7 +7,7 @@ Candidates for Fragments are:
 - [x] click_to_load - 1
 - [x] edit_row - 1
 - [x] inline_validation
-- [ ] infinite_scroll
+- [x] infinite_scroll
 - [ ] value_select
 - [ ] tabs_hateos
 - [ ] tabs_hyperscript

diff --git a/lib/Routes/Examples/Infinite-Scroll.rakumod b/lib/Routes/Examples/Infinite-Scroll.rakumod
@@ -24,7 +24,7 @@ sub infinite_scroll-routes() is export {
 
         get -> 'contacts', Int :$page! {
             sleep 1;                    #<= delay to make spinner visible
-            template 'partial.crotmp', {contacts=>gen-contacts($page), next=>($page+1)};
+            template 'index.crotmp', :fragment<partial>, {contacts=>gen-contacts($page), next=>($page+1)};
         }
     }
 }
diff --git a/templates/infinite_scroll/index.crotmp b/templates/infinite_scroll/index.crotmp
@@ -7,6 +7,7 @@
         </tr>
     </thead>
     <tbody id="tbody">
+        <:fragment partial($_)>
         <@contacts : $c>
         <?$c.last>
         <tr hx-get="/infinite_scroll/contacts?page=<.next>" hx-trigger="revealed" hx-swap="afterend" hx-target="this">
@@ -19,6 +20,7 @@
             <td><$c.id></td>
         </tr>
         </@>
+        </:>
     </tbody>
 </table>
 <img id="ind" src="/img/bars.svg" width="150" class="htmx-indicator" />
diff --git a/templates/infinite_scroll/partial.crotmp b/templates/infinite_scroll/partial.crotmp
diff --git a/templates/inline_validation/index.crotmp b/templates/inline_validation/index.crotmp
@@ -42,4 +42,4 @@
         </div>
         <button>Submit</button>
     </form>
-</div>
+</div>