diff --git a/samples/htmx_mustache/WebSiteControllerU.pas b/samples/htmx_mustache/WebSiteControllerU.pas
index c965c7c6..a0ad89fe 100644
--- a/samples/htmx_mustache/WebSiteControllerU.pas
+++ b/samples/htmx_mustache/WebSiteControllerU.pas
@@ -38,6 +38,12 @@ type
     [MVCProduces(TMVCMediaType.TEXT_HTML)]
     procedure NewPerson;
 
+    [MVCPath('/modal/fordelete/($guid)')]
+    [MVCHTTPMethods([httpGET])]
+    [MVCProduces(TMVCMediaType.TEXT_HTML)]
+    function ShowModalForDelete(guid: string): String;
+
+
     [MVCPath('/edit/($guid)')]
     [MVCHTTPMethods([httpGET])]
     [MVCProduces(TMVCMediaType.TEXT_HTML)]
@@ -48,6 +54,11 @@ type
     [MVCProduces(TMVCMediaType.TEXT_HTML)]
     procedure Index;
 
+    [MVCPath('/modal')]
+    [MVCHTTPMethods([httpGET])]
+    [MVCProduces(TMVCMediaType.TEXT_HTML)]
+    function ShowModal: String;
+
     [MVCPath('/mustacheshowcase')]
     [MVCHTTPMethods([httpGET])]
     [MVCProduces(TMVCMediaType.TEXT_HTML)]
@@ -66,6 +77,7 @@ var
 begin
   LDAL := TServicesFactory.GetPeopleDAL;
   LDAL.DeleteByGUID(GUID);
+  Context.Response.SetPageRefresh(true);
   RenderStatusMessage(HTTP_STATUS.OK);
 end;
 
@@ -242,4 +254,27 @@ begin
   Context.Response.SetRedirect('/people');
 end;
 
+function TWebSiteController.ShowModal: String;
+begin
+  var lJSON := StrToJSONObject('{"message":"Do you really want to delete row?", "title":"Bootstrap Modal Dialog"}');
+  try
+    Result := GetRenderedView(['modal'], lJSON);
+  finally
+    lJSON.Free;
+  end;
+end;
+
+function TWebSiteController.ShowModalForDelete(guid: string): String;
+begin
+  var lJSON := TJsonObject.Create;
+  try
+    lJSON.S['title'] := 'Bootstrap Modal Dialog';
+    lJSON.S['message'] := 'Do you really want to delete row?';
+    lJSON.S['guid'] := guid;
+    Result := GetRenderedView(['modal'], lJSON);
+  finally
+    lJSON.Free;
+  end;
+end;
+
 end.
diff --git a/samples/htmx_mustache/bin/templates/delete_person_link.mustache b/samples/htmx_mustache/bin/templates/delete_person_link.mustache
index a2e346e1..e4abe96b 100644
--- a/samples/htmx_mustache/bin/templates/delete_person_link.mustache
+++ b/samples/htmx_mustache/bin/templates/delete_person_link.mustache
@@ -1 +1,9 @@
-<a hx-delete="/people/delete/{{guid}}" hx-confirm="Are you sure to delete {{first_name}} {{last_name}} ?" href="" hx-swap="delete" hx-target="closest tr">Delete</a>
\ No newline at end of file
+<!--<a hx-delete="/people/delete/{{guid}}" hx-confirm="Are you sure to delete {{first_name}} {{last_name}} ?" href="" hx-swap="delete" hx-target="closest tr">Delete</a>-->
+
+<button 
+	hx-get="/people/modal/fordelete/{{guid}}" 
+	hx-target="#modals-here" 
+	hx-trigger="click"
+    data-bs-toggle="modal"
+    data-bs-target="#modals-here"
+	class="btn btn-primary">Delete</button>
\ No newline at end of file
diff --git a/samples/htmx_mustache/bin/templates/editperson.mustache b/samples/htmx_mustache/bin/templates/editperson.mustache
index 6853bf6e..083d40a8 100644
--- a/samples/htmx_mustache/bin/templates/editperson.mustache
+++ b/samples/htmx_mustache/bin/templates/editperson.mustache
@@ -24,7 +24,7 @@
     <div class="col">
       <div class="form-group">
         <label for="first_name" class="control-label">First name</label>
-        <input type="text" value="{{person.first_name}}" class="form-control" id="first_name" placeholder="First name" name="first_name">
+        <input type="text" value="{{person.first_name}}" class="form-control" id="first_name" placeholder="First name" name="first_name" autocomplete="first_name" >
       </div>
     </div>
     <div class="col">        
@@ -46,7 +46,7 @@
     <div class="col">      			
       <div class="form-group">			
         <label for="items" class="col-sm-10 control-label">Devices</label>					
-          <select name="items" multiple class="form-control">
+          <select id="items" name="items" multiple class="form-control">
           {{#deviceslist}}
             <option value="{{devicename}}" {{#selected}}selected{{/selected}}>{{devicename}}</option>
           {{/deviceslist}}							
diff --git a/samples/htmx_mustache/bin/templates/header.mustache b/samples/htmx_mustache/bin/templates/header.mustache
index 4fc6fde7..02548e5b 100644
--- a/samples/htmx_mustache/bin/templates/header.mustache
+++ b/samples/htmx_mustache/bin/templates/header.mustache
@@ -1,17 +1,18 @@
 <!DOCTYPE html>
 <html>
 <header>
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
 	<script src="https://unpkg.com/htmx.org@1.9.6" integrity="sha384-FhXw7b6AlE/jyjlZH5iHa/tTe9EpJ1Y55RjcgPbjeWMskSxZt1v9qkxLJWNJaGni" crossorigin="anonymous"></script>
     <style>
-        body {
-            padding: 20px 50px 20px 50px;
+        h1 a:hover {
+            text-decoration: none;
         }
     </style>
 </header>
 
-<body>
+<body class="text-capitalize">
     <div id="main" class="container">
         <div class="shadow-sm p-3 mb-5 bg-body-tertiary rounded">
-            <h1>HTMX Sample <small>DMVCFramework</small></h1>
+            <h1>✅<a href="https://htmx.org/" target="_blank">HTMX</a> Sample <small><a href="https://github.com/danieleteti/delphimvcframework" target="_blank">DMVCFramework</a></small></h1>
         </div>    
\ No newline at end of file
diff --git a/samples/htmx_mustache/bin/templates/modal.mustache b/samples/htmx_mustache/bin/templates/modal.mustache
new file mode 100644
index 00000000..74751efc
--- /dev/null
+++ b/samples/htmx_mustache/bin/templates/modal.mustache
@@ -0,0 +1,14 @@
+<div class="modal-dialog modal-dialog-centered">
+  <div class="modal-content">
+    <div class="modal-header">
+      <h5 class="modal-title">{{title}}</h5>
+    </div>
+    <div class="modal-body">
+      <p>{{message}}</p>
+    </div>
+    <div class="modal-footer">
+      <button type="button" class="btn btn-primary" data-bs-dismiss="modal" hx-delete="/people/delete/{{guid}}">Yes, delete it!</button>
+      <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">No</button>
+    </div>
+  </div>
+</div>
\ No newline at end of file
diff --git a/samples/htmx_mustache/bin/templates/partials/modal_placeholder.mustache b/samples/htmx_mustache/bin/templates/partials/modal_placeholder.mustache
new file mode 100644
index 00000000..32fc82cd
--- /dev/null
+++ b/samples/htmx_mustache/bin/templates/partials/modal_placeholder.mustache
@@ -0,0 +1,9 @@
+<div id="modals-here"
+    class="modal modal-blur fade"
+    style="display: none"
+    aria-hidden="false"
+    tabindex="-1">
+    <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
+        <div class="modal-content"></div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/samples/htmx_mustache/bin/templates/people_list.mustache b/samples/htmx_mustache/bin/templates/people_list.mustache
index a8095b9b..0c514ca4 100644
--- a/samples/htmx_mustache/bin/templates/people_list.mustache
+++ b/samples/htmx_mustache/bin/templates/people_list.mustache
@@ -1,5 +1,5 @@
-<div class="row_fluid" id="people_list">
-    <div class="col-sm-12">
+<div class="row" id="people_list">
+    <div class="col">
         {{>people_table}}
     </div>
 </div>
\ No newline at end of file
diff --git a/samples/htmx_mustache/bin/templates/people_list_bottom.mustache b/samples/htmx_mustache/bin/templates/people_list_bottom.mustache
index ace075b2..db822c81 100644
--- a/samples/htmx_mustache/bin/templates/people_list_bottom.mustache
+++ b/samples/htmx_mustache/bin/templates/people_list_bottom.mustache
@@ -1,8 +1,10 @@
-<div class="row">
-    <div class="offset-7 col-2">
-        <a href="/people/exports/csv" download="people.csv" target="_blank">Export as CSV</a>
+<div class="row padding mx-auto">
+    <div class="col-2 text-left">
+        <a href="/people/exports/csv" class="btn btn-dark" download="people.csv" target="_blank">Export as CSV</a>
     </div>
-    <div class="col-2">
-        <a hx-boost="true" href="/people/new">Add New Person</a>
+    <div class="offset-8 col-2 text-right">
+        <button class="btn btn-primary" hx-on:click="window.location.href = '/people/new'">Add New Person</button>
     </div>
-</div>
\ No newline at end of file
+</div>
+
+{{>partials/modal_placeholder}}
\ No newline at end of file
diff --git a/unittests/general/TestServer/templates/dataset_list.html b/unittests/general/TestServer/templates/dataset_list.html
index 6ab7357e..4a6c31e0 100644
--- a/unittests/general/TestServer/templates/dataset_list.html
+++ b/unittests/general/TestServer/templates/dataset_list.html
@@ -4,5 +4,4 @@
 ---
 {{#customers2}}
 {{CUST_NO}}|{{CUSTOMER}}|{{CONTACT_FIRST}}|{{CONTACT_LAST}}|{{PHONE_NO}}|{{ADDRESS_LINE1}}|{{CITY}}|{{COUNTRY}}|{{POSTAL_CODE}}
-{{/customers2}}
-                                
\ No newline at end of file
+{{/customers2}}
\ No newline at end of file