'How to send custom value to sweetalert javascript code from PHP?

I want to warn user on attempting to delete a file. how can I transfer some details via the html button to this javascript ? for example, each time the user will be deleting different files, so the button should sent different file id to the fileid part of the url.

here is the .js example

    <script>
document.getElementById("custom-sa-warning") && document.getElementById("custom-sa-warning").addEventListener("click", function() {
    Swal.fire({
        html: '<div class="mt-3"><lord-icon src="https://cdn.lordicon.com/gsqxdxog.json" trigger="loop" colors="primary:#f7b84b,secondary:#f06548" style="width:100px;height:100px"></lord-icon><div class="mt-4 pt-2 fs-15 mx-5"><h4>Are you Sure ?</h4><p class="text-muted mx-4 mb-0">Are you Sure You want to Delete this Account ?</p></div></div>',
        showCancelButton: !0,
        confirmButtonClass: "btn btn-primary w-xs me-2 mb-1",
        confirmButtonText: "Yes, Delete It!",
        cancelButtonClass: "btn btn-danger w-xs mb-1",
        buttonsStyling: !1,
        showCloseButton: !0
    }).then((result) => {
   if (result.value) {
     window.location.href = `https://somedimain.com/delete.php?id=fileid`
   }
 });
})
</script>

Here is the html to initiate the popup

<button type="button" class="btn btn-primary" id="custom-sa-warning">Click me</button>

Already tried var test = 'https://somedimain.com/delete.php?id=$fileid';

if (result.value) {
       var example = test;
     window.location.href = example
   }

, it works, but how can I change this var test value from a button ?

javascripthtmlsweetalert2


Solution 1:[1]

Add data-fileId attribute to your button and when you click to button, get clicked buttons 'data-fileId'. it should be like this

html:

<button type="button" class="btn btn-primary" id="custom-sa-warning" data-fileId="write your fileId">Click me</button>

js:

<script>
document.getElementById("custom-sa-warning") && document.getElementById("custom-sa-warning").addEventListener("click", function(event) {
    var el = event.target || event.srcElement;
    var fileId = el.getAttribute('data-fileId');
    Swal.fire({
        html: '<div class="mt-3"><lord-icon src="https://cdn.lordicon.com/gsqxdxog.json" trigger="loop" colors="primary:#f7b84b,secondary:#f06548" style="width:100px;height:100px"></lord-icon><div class="mt-4 pt-2 fs-15 mx-5"><h4>Are you Sure ?</h4><p class="text-muted mx-4 mb-0">Are you Sure You want to Delete this Account ?</p></div></div>',
        showCancelButton: !0,
        confirmButtonClass: "btn btn-primary w-xs me-2 mb-1",
        confirmButtonText: "Yes, Delete It!",
        cancelButtonClass: "btn btn-danger w-xs mb-1",
        buttonsStyling: !1,
        showCloseButton: !0
    }).then((result) => {
    if (result.value) {
     window.location.href = "https://somedimain.com/delete.php?id=" + fileId
    }
  });
})
</script>

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Onur Gelmez

Related Questions