Part of the EllisLab Network
   
 
jQuery Delete Confirmation
Posted: 31 January 2008 02:11 PM   [ Ignore ]  
Lab Assistant
RankRank
Total Posts:  251
Joined  08-05-2007

Hello,

I have a user list and want to create a pop-up asking the admin to confirm if they want to delete the user when they click on a link.

It seems jQuery is a popular Javascript library so I’m looking for something based on that. I’ve looked around google and the jQuery site for some sample code but haven’t had much luck.

If anyone knows any good resources I’d appreciate it.

Thanks.

 Signature 

CI Base - CodeIgniter Repository

Profile
 
 
Posted: 31 January 2008 02:25 PM   [ Ignore ]   [ # 1 ]  
Grad Student
Rank
Total Posts:  56
Joined  08-09-2007

Why not just a simple Javascript Confirm() ?

My “delete” link looks like this:

<a href="#" onclick="return deletechecked();">Delete checked messages</a>

Which points to this javascript function:

function deletechecked()
{
    
var answer = confirm("Delete selected messages ?")
    if (
answer){
        document
.messages.submit();
    
}
    
    
return false;  
}

Which submits the form, and the messages are deleted.

Profile
 
 
Posted: 31 January 2008 02:26 PM   [ Ignore ]   [ # 2 ]  
Sr. Research Associate
RankRankRankRankRank
Total Posts:  4839
Joined  07-14-2006

do you want the common modal window. The only thing you need is a class

$('.delete').click(function(){
  
var answer = confirm('Delete user');
  return
answer // answer is a boolean
});

If you want a full javascripted modal window check the modal plugins like blockUI

Profile
 
 
Posted: 31 January 2008 03:03 PM   [ Ignore ]   [ # 3 ]  
Lab Assistant
RankRank
Total Posts:  251
Joined  08-05-2007

Thanks guys.

To pass a variable could I just do:

<a href="#" onclick="return deletechecked('Are you sure you want to delete <?=$row->username ?>');">Delete checked messages</a>

Javascript

function deletechecked(message)
{
    
var answer = confirm(message)
    if (
answer){
        document
.messages.submit();
    
}
    
    
return false;  
}
 Signature 

CI Base - CodeIgniter Repository

Profile
 
 
Posted: 02 June 2008 01:27 PM   [ Ignore ]   [ # 4 ]  
Summer Student
Total Posts:  1
Joined  06-02-2008

Hi,

I’m new to CodeIgniter and I like it a lot.

xwero - 31 January 2008 02:26 PM

do you want the common modal window. The only thing you need is a class

$('[b].delete[/b]').click(function(){
  
var answer = confirm('Delete user');
  return
answer // answer is a boolean
});

 

Thank you xwero.
Using jQuery, I added in CI a class to anchor and it worked.

echo "<td>". anchor('controller/delete/'.$row->id,'Delete',array('class' => 'delete')) ."</td>";

The drawback is that is doesn’t show witch record removes.Maybe adding a ‘title’ to the anchor then showing this in javascript code could do it.

The good is that jQuery is unobtrusive.

PS: I figured out how to get with jQuery anchor attributes

jQuery function

$(document).ready(function(){
        
$('.delete').click(function(){
            
var answer = confirm('Delete '+jQuery(this).attr('title'));
                        
// jQuery(this).attr('title') gets anchor title attribute
            
return answer; // answer is a boolean
            
});
    
});

anchor in ci view file

echo "<td>". anchor('controller/delete/'.$row->id,'Delete',array('class' => 'delete', 'title'=>"$row->username")) ."</td>";
Profile
 
 
Posted: 19 November 2008 05:15 PM   [ Ignore ]   [ # 5 ]  
Lab Assistant
Avatar
RankRank
Total Posts:  127
Joined  11-16-2007

Hey guys, I’m doing something similar but I’d like to use better URLs instead of just href=”#”, anyone have any advice on that?

I tried jquery confirm, but I can’t get my parent TR to hide after I OK the delete:

$('a.delete').click(function(event) {

    
$.post($(this).attr('href'), function(data){
        
$(this).parent('tr').fadeOut('fast');
    
});

}).confirm();

anyone have any thoughts?

Profile
 
 
Posted: 19 November 2008 07:28 PM   [ Ignore ]   [ # 6 ]  
Lab Assistant
Avatar
RankRank
Total Posts:  254
Joined  07-16-2008

You can use any href as you wish. You just have to return false always. Taken from example earlier:

function deletechecked(message)
{
    
var answer = confirm(message)
    if (
answer){
        document
.messages.submit();
        return
false; // This line added
    
}
    
    
return false;  
}
Profile
 
 
Posted: 19 November 2008 07:36 PM   [ Ignore ]   [ # 7 ]  
Lab Assistant
Avatar
RankRank
Total Posts:  127
Joined  11-16-2007

Right on, thanks cahva!

Profile
 
 
Posted: 20 November 2008 04:32 PM   [ Ignore ]   [ # 8 ]  
Lab Assistant
Avatar
RankRank
Total Posts:  254
Joined  07-16-2008

Actually that line is not needed in that particular example because that indeed returns false always even if the confirm was cancelled(return false is outside the if). My bad. But anyways, the return always false was the point smile

Profile
 
 
   
 
 
Post Marker Legend
New Topic New posts Hot Topic Hot Topic with new posts New Poll New Poll Moved Topic Moved Topic Sticky Topic Sticky topic
Old Topic No new posts Hot Old Topic Hot Topic with no new posts Old Poll Old Poll Closed Topic Closed Topic Announcement Announcements
Theme
Change Theme
Visitor Statistics
The most visitors ever was 819, on March 11, 2010 11:15 AM
Total Registered Members: 120233 Total Logged-in Users: 59
Total Topics: 126365 Total Anonymous Users: 3
Total Replies: 664552 Total Guests: 480
Total Posts: 790917    
Members ( View Memberlist )