Introduce JS helper for bootstrap confirm dialogs on button-submit

2 files changed, 65 insertions, 115 deletions

diff --git a/modules-available/serversetup-bwlp-ipxe/templates/bootentry-list.html b/modules-available/serversetup-bwlp-ipxe/templates/bootentry-list.html
index edfc0e5f..96130b14 100644
--- a/modules-available/serversetup-bwlp-ipxe/templates/bootentry-list.html
+++ b/modules-available/serversetup-bwlp-ipxe/templates/bootentry-list.html
@@ -4,58 +4,64 @@
 	{{lang_bootentryIntro}}
 </p>
 
-<table class="table">
-	<thead>
-	<tr>
-		<th>{{lang_entryId}}</th>
-		<th>{{lang_bootentryTitle}}</th>
-		<th>{{lang_hotkey}}</th>
-		<th class="slx-smallcol">{{lang_refCount}}</th>
-		<th class="slx-smallcol">{{lang_edit}}</th>
-		{{#allowEdit}}<th class="slx-smallcol">{{lang_copy}}</th>{{/allowEdit}}
-		<th class="slx-smallcol">{{lang_delete}}</th>
-	</tr>
-	</thead>
-	<tbody>
-	{{#bootentryTable}}
-	<tr>
-		<td>
-			{{entryid}}
-		</td>
-		<td>
-			{{title}}
-		</td>
-		<td>
-			{{hotkey}}
-		</td>
-		<td align="right">
-			{{refs}}
-		</td>
-		<td align="center">
-			<a href="?do=serversetup&amp;show=editbootentry&amp;id={{entryid}}" class="btn btn-xs btn-default">
-				<span class="glyphicon glyphicon-{{#allowEdit}}edit{{/allowEdit}}{{^allowEdit}}eye-open{{/allowEdit}}"></span>
-			</a>
-		</td>
-		{{#allowEdit}}
-		<td align="center">
-			<a href="?do=serversetup&amp;show=editbootentry&amp;id={{entryid}}&copy=true" class="btn btn-xs btn-default">
-				<span class="glyphicon glyphicon-duplicate"></span>
-			</a>
-		</td>
-		{{/allowEdit}}
-		<td align="center">
+<form method="post" action="?do=serversetup">
+	<input type="hidden" name="token" value="{{token}}">
+	<input type="hidden" name="action" value="deleteBootentry">
+	<table class="table">
+		<thead>
+		<tr>
+			<th>{{lang_entryId}}</th>
+			<th>{{lang_bootentryTitle}}</th>
+			<th>{{lang_hotkey}}</th>
+			<th class="slx-smallcol">{{lang_refCount}}</th>
+			<th class="slx-smallcol">{{lang_edit}}</th>
+			{{#allowEdit}}<th class="slx-smallcol">{{lang_copy}}</th>{{/allowEdit}}
+			<th class="slx-smallcol">{{lang_delete}}</th>
+		</tr>
+		</thead>
+		<tbody>
+		{{#bootentryTable}}
+		<tr>
+			<td>
+				{{entryid}}
+			</td>
+			<td>
+				{{title}}
+			</td>
+			<td>
+				{{hotkey}}
+			</td>
+			<td align="right">
+				{{refs}}
+			</td>
+			<td align="center">
+				<a href="?do=serversetup&amp;show=editbootentry&amp;id={{entryid}}" class="btn btn-xs btn-default">
+					<span class="glyphicon glyphicon-{{#allowEdit}}edit{{/allowEdit}}{{^allowEdit}}eye-open{{/allowEdit}}"></span>
+				</a>
+			</td>
 			{{#allowEdit}}
-				{{^builtin}}
-					<button type="button" class="btn btn-xs btn-danger" data-toggle="modal" data-target="#deleteModal" onclick="deleteBootentry('{{entryid}}')">
-						<span class="glyphicon glyphicon-trash"></span>
-					</button>
-				{{/builtin}}
+			<td align="center">
+				<a href="?do=serversetup&amp;show=editbootentry&amp;id={{entryid}}&copy=true" class="btn btn-xs btn-default">
+					<span class="glyphicon glyphicon-duplicate"></span>
+				</a>
+			</td>
 			{{/allowEdit}}
-		</td>
-	</tr>
-	{{/bootentryTable}}
-	</tbody>
-</table>
+			<td align="center">
+				{{#allowEdit}}
+					{{^builtin}}
+						<button type="submit" name="deleteid" value="{{entryid}}" class="btn btn-xs btn-danger"
+								  data-confirm="#confirm-delete" data-title="{{title}}">
+							<span class="glyphicon glyphicon-trash"></span>
+						</button>
+					{{/builtin}}
+				{{/allowEdit}}
+			</td>
+		</tr>
+		{{/bootentryTable}}
+		</tbody>
+	</table>
+</form>
+<div class="hidden" id="confirm-delete">{{lang_bootentryDeleteConfirm}}</div>
 <div class="pull-right">
 	{{#allowEdit}}
 		<a href="?do=serversetup&amp;show=editbootentry" class="btn btn-success">
@@ -66,32 +72,3 @@
 </div>
 
 <div class="clearfix"></div>
-
-<!-- Modals -->
-<form method="post" action="?do=serversetup">
-	<input type="hidden" name="token" value="{{token}}">
-	<div class ="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
-		<div class="modal-dialog" role="document">
-			<div class="modal-content">
-				<div class="modal-header">
-					<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
-					<h4 class="modal-title" id="myModalLabel">{{lang_delete}}</h4>
-				</div>
-				<div class="modal-body">
-					<p>{{lang_bootentryDeleteConfirm}}</p>
-				</div>
-				<div class="modal-footer">
-					<input type="hidden" id="delete-bootentry-id" name="deleteid" value="">
-					<button type="button" class="btn btn-default" data-dismiss="modal">{{lang_cancel}}</button>
-					<button type="submit" name="action" value="deleteBootentry" class="btn btn-danger"><span class="glyphicon glyphicon-trash"></span> {{lang_delete}}</button>
-				</div>
-			</div>
-		</div>
-	</div>
-</form>
-
-<script>
-	function deleteBootentry(entryid) {
-		$("#delete-bootentry-id").val(entryid);
-	}
-</script>
\ No newline at end of file
diff --git a/modules-available/serversetup-bwlp-ipxe/templates/menu-list.html b/modules-available/serversetup-bwlp-ipxe/templates/menu-list.html
index ed12e596..8e67e697 100644
--- a/modules-available/serversetup-bwlp-ipxe/templates/menu-list.html
+++ b/modules-available/serversetup-bwlp-ipxe/templates/menu-list.html
@@ -48,9 +48,14 @@
 			</td>
 			<td align="center">
 				{{#allowEdit}}
-					<button type="button" class="btn btn-xs btn-danger" data-toggle="modal" data-target="#deleteModal" onclick="deleteMenu('{{menuid}}')">
-						<span class="glyphicon glyphicon-trash"></span>
-					</button>
+					<form method="post" action="?do=serversetup">
+						<input type="hidden" name="token" value="{{token}}">
+						<input type="hidden" name="deleteid" value="{{menuid}}">
+						<button type="submit" name="action" value="deleteMenu" class="btn btn-xs btn-danger"
+								  data-confirm="#confirm-delete" data-title="{{title}}">
+							<span class="glyphicon glyphicon-trash"></span>
+						</button>
+					</form>
 				{{/allowEdit}}
 			</td>
 		</tr>
@@ -64,37 +69,5 @@
 	</a>
 </div>
 
+<div class="hidden" id="confirm-delete">{{lang_menuDeleteConfirm}}</div>
 <div class="clearfix"></div>
-
-
-<!-- Modals -->
-<form method="post" action="?do=serversetup">
-	<input type="hidden" name="token" value="{{token}}">
-	<div class ="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
-		<div class="modal-dialog" role="document">
-			<div class="modal-content">
-				<div class="modal-header">
-					<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
-					<h4 class="modal-title" id="myModalLabel">{{lang_delete}}</h4>
-				</div>
-				<div class="modal-body">
-					<p>{{lang_menuDeleteConfirm}}</p>
-				</div>
-				<div class="modal-footer">
-					<input type="hidden" id="delete-menu-id" name="deleteid" value="">
-					<button type="button" class="btn btn-default" data-dismiss="modal">{{lang_cancel}}</button>
-					<button type="submit" name="action" value="deleteMenu" class="btn btn-danger"><span class="glyphicon glyphicon-trash"></span> {{lang_delete}}</button>
-				</div>
-			</div>
-		</div>
-	</div>
-</form>
-
-<script>
-	function deleteMenu(menuid) {
-		$("#delete-menu-id").val(menuid);
-	}
-	document.addEventListener('DOMContentLoaded', function() {
-		$('[data-toggle="tooltip"]').tooltip();
-	});
-</script>
\ No newline at end of file