Add pop up box for action Delete & Duplicate
| File | Folder Link |
|---|---|
| backend.php | \\SYNAS\Allan\DOCUMENTATION\Component\Pop Up (sweetalert.js)\rckuc\wolf\app\layouts |
| index.php | \\SYNAS\Allan\DOCUMENTATION\Component\Pop Up (sweetalert.js)\rckuc\wolf\app\views\option |
| style.css | \\SYNAS\Allan\DOCUMENTATION\Component\Pop Up (sweetalert.js)\rckuc\wolf\admin\themes\black_and_white |
| backend.js & sweetalert2@11.js | \\SYNAS\Allan\DOCUMENTATION\Component\Pop Up (sweetalert.js)\rckuc\wolf\admin\javascript |
Update: backend.php
insert sweetalert script link in <head> section
<head>
<!-- Include SweetAlert2 JS -->
<script type="text/javascript" charset="utf-8" src="<?php echo URI_PUBLIC; ?>wolf/admin/javascripts/sweetalert2@11.js"></script>
</head>
<head>
<!-- Include SweetAlert2 JS -->
<script type="text/javascript" charset="utf-8" src="<?php echo URI_PUBLIC; ?>wolf/admin/javascripts/sweetalert2@11.js"></script>
</head>Update: style.css
.duplicate_sweetalert img {
height: 14px;
width: 14px;
}
.duplicate_sweetalert img {
height: 14px;
width: 14px;
}Update: backend.js
All delete and duplicate buttons in index.php need to apply class="delete_sweetalert" or class="duplicate_sweetalert" and a data-name attribute for the item name.
// Apply Sweetalert pop up box for all index.php table delete button
// Make sure to add class="delete_sweetalert" and add data-name="<?php echo $xxxxx->name ;?>" for delete button <a>
$(document).ready(function() {
$(document).on('click', 'a.delete_sweetalert', function (e) {
e.preventDefault(); // Prevent default link behavior
let name = $(this).attr('data-name');
let deleteLink = $(this).attr('href');
Swal.fire({
html: `Are you sure you want to delete:<br>"${name}"? <br><br>This action cannot be undone.`,
icon: 'warning',
showCancelButton: true,
confirmButtonText: 'Yes',
cancelButtonText: 'Cancel',
confirmButtonColor: '#d33',
cancelButtonColor: '#3085d6',
showCloseButton: true
}).then((result) => {
if (result.isConfirmed) {
window.location.href = deleteLink;
}
});
});
});
// Apply Sweetalert pop up box for all index.php table duplicate button
// Make sure to add class="duplicate_sweetalert" and add data-name="<?php echo $xxxxx->name ;?>" for duplicate button <a>
$(document).ready(function() {
$(document).on('click', 'a.duplicate_sweetalert', function (e) {
e.preventDefault(); // Prevent default link behavior
let name = $(this).attr('data-name');
let duplicateLink = $(this).attr('href');
Swal.fire({
html: `Are you sure you want to duplicate:<br>"${name}"?`,
icon: 'question',
showCancelButton: true,
confirmButtonText: 'Yes',
cancelButtonText: 'Cancel',
confirmButtonColor: 'green',
cancelButtonColor: '#3085d6',
showCloseButton: true
}).then((result) => {
if (result.isConfirmed) {
window.location.href = duplicateLink;
}
});
});
});
// Apply Sweetalert pop up box for all index.php table delete button
// Make sure to add class="delete_sweetalert" and add data-name="<?php echo $xxxxx->name ;?>" for delete button <a>
$(document).ready(function() {
$(document).on('click', 'a.delete_sweetalert', function (e) {
e.preventDefault(); // Prevent default link behavior
let name = $(this).attr('data-name');
let deleteLink = $(this).attr('href');
Swal.fire({
html: `Are you sure you want to delete:<br>"${name}"? <br><br>This action cannot be undone.`,
icon: 'warning',
showCancelButton: true,
confirmButtonText: 'Yes',
cancelButtonText: 'Cancel',
confirmButtonColor: '#d33',
cancelButtonColor: '#3085d6',
showCloseButton: true
}).then((result) => {
if (result.isConfirmed) {
window.location.href = deleteLink;
}
});
});
});
// Apply Sweetalert pop up box for all index.php table duplicate button
// Make sure to add class="duplicate_sweetalert" and add data-name="<?php echo $xxxxx->name ;?>" for duplicate button <a>
$(document).ready(function() {
$(document).on('click', 'a.duplicate_sweetalert', function (e) {
e.preventDefault(); // Prevent default link behavior
let name = $(this).attr('data-name');
let duplicateLink = $(this).attr('href');
Swal.fire({
html: `Are you sure you want to duplicate:<br>"${name}"?`,
icon: 'question',
showCancelButton: true,
confirmButtonText: 'Yes',
cancelButtonText: 'Cancel',
confirmButtonColor: 'green',
cancelButtonColor: '#3085d6',
showCloseButton: true
}).then((result) => {
if (result.isConfirmed) {
window.location.href = duplicateLink;
}
});
});
});