Using plain jquery / javascript to create a popup confirm box

Question

Here is the extract code of how to make a confim box when delete,

For HTML part A link is to trigger JS code , but it will trigger the php code at same time

For JS part popupbox is triggered

For PHP part Process the sql query, it should be ok

The problems are...

I should use js to trigger the php page? But how can i let the php page know that which ListID i want to delete?
What should i put in the html link?
What if i want to include the list name in the popup box e.g. do you want to delete list A ,where list A is a variable already. The only thing is how can i append it to the popup box

Thank you

HTML

<a id="delete" href='delete.php?id=$set[ListID]'>Delete</a>

JS

$(function(){
    $("#delete").click(function() {
        // what should be add here? 
    });
});

PHP

//connection db
INSERT  INTO delete_list SELECT * FROM list WHERE ListID=?;    
INSERT  INTO delete_user_list SELECT * FROM user_list WHERE ListID=?;    
INSERT  INTO delete_require_attributes SELECT * FROM require_attributes WHERE ListID='2';    
INSERT  INTO delete_subscriber SELECT * FROM subscriber WHERE ListID=?;    
INSERT  INTO delete_subscriber SELECT * FROM subscriber WHERE ListID=?;    
DELETE FROM list WHERE ListID = '1'

Sorry, I mess up the previous question as i found that the plugin i used in last question does not work for me.

possible duplicate of Using jquery / javascript to create a popup confirm box — Lightness Races in Orbit
– Lightness Races in Orbit, Commented Mar 20, 2012 at 16:04

Community · Accepted Answer · 2020-06-20 09:12:55Z

1

i had done this by giving the id to the HTML element itself with data (HTML5 ref) sweet to use with jQuery. After this you can do an ajax call optional to delete server-side in the database.

Example

<a data-id="<?php echo $set[ListID]; ?>" class="delete-trigger" href='javascript:;'>Delete</a>

JS

$(function(){
    $("#delete-trigger").click(function() {
        var id = $(this).data('id');
        $.ajax({
            url: 'http://yoururl.com/delete.php?id=' + id,
            success: function(data) {
                console.log('deleted');
            }
        });
    });
});

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered Mar 20, 2012 at 15:57

e382df99a7950919789725ceeec126

6,0215 gold badges34 silver badges56 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Leo Chan Over a year ago

This ask the user whether to delete the list?

e382df99a7950919789725ceeec126 Over a year ago

no this is just the execution of deleting a "list". to ask the user for confirm just do: var booleanOfAnswer = confirm('your question'); - help for this, here

Mikhail · Accepted Answer · 2012-03-21 06:17:16Z

1

html

<a class="delete" data-listname="<?php echo $set['ListName']?>" href="delete.php?id=<?php echo $set['ListID']?>">Delete</a>

js

$(function(){
  $(".delete").click(function() {

    return confirm('Are you sure you want to delete ' + $(this).data('listname') + '?');

 });
});

edited Mar 21, 2012 at 6:17

answered Mar 20, 2012 at 15:51

Mikhail

2,5524 gold badges30 silver badges40 bronze badges

3 Comments

SSH This Over a year ago

Won't this refresh the page, not allowing the js to be run? Also, shouldn't # be .

Leo Chan Over a year ago

Sorry but I found that there is a flaw, if there are more than one link, one of them will not popup but directly go to the delete.php

Mikhail Over a year ago

Sorry, my mistake. Need to replace an ID selector with CLASS selector. I changed my answer

Collectives™ on Stack Overflow

Using plain jquery / javascript to create a popup confirm box

2 Answers 2

Example

2 Comments

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Example

2 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related