Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Alert with several option with jQuery

I want make a alert that after click on button delete ask did you want delete this? with two options: ok and cancel. If user clicks on ok the value is deleted. If the user clicks on cancel don't delete the value.

Like this in this site:

Stackoverflow confirmation dialog for post deletion vote

How to do this with jQuery?

like image 201
Jennifer Anthony Avatar asked Oct 06 '11 18:10

Jennifer Anthony


4 Answers

If you want to style your alert, check this plugin: jquery-alert-dialogs. It's very easy to use.

jAlert('This is a custom alert box', 'Alert Dialog');

jConfirm('Can you confirm this?', 'Confirmation Dialog', function(r) {
     jAlert('Confirmed: ' + r, 'Confirmation Results');
});

jPrompt('Type something:', 'Prefilled value', 'Prompt Dialog', function(r) {
    if( r ) alert('You entered ' + r);
});

UPDATE: the oficial site is currently offline. here is another source

like image 100
Ricardo Binns Avatar answered Oct 06 '22 16:10

Ricardo Binns


<a href="#" id="delete">Delete</a>

$('#delete').click(function() {
   if (confirm('Do you want to delete this item?')) {
      // do delete item
   }
});

Code: http://jsfiddle.net/hP2Dz/4/

like image 39
Samich Avatar answered Oct 06 '22 17:10

Samich


In JavaScript, that type of box is confirm, not alert. confirm returns a boolean, representing whether the user responded positively or negatively to the prompt (i.e. clicking OK results in true being returned, whereas clicking cancel results in false being returned). This is applicable to jQuery, but also in JavaScript more broadly. You can say something like:

var shouldDelete = confirm("Do you want to delete?");
if (shouldDelete) {
  // the user wants to delete
} else {
  // the user does not want to delete
}
like image 34
Jon Newmuis Avatar answered Oct 06 '22 17:10

Jon Newmuis


Might not be jquery but is the simple principle that you could use

<html>
<head>
<script type="text/javascript">
function show_confirm()
{
var r=confirm("vote ");
if (r==true)
  {
  alert("ok delete"); //you can add your jquery here
  }
else
  {
  alert(" Cancel! dont delete"); //you can add your jquery here
  }
}
</script>
</head>
<body>

<input type="button" onclick="show_confirm()" value="Vote to delete?" /> <!-- can be changed to object binding with jquery-->

</body>
</html>Vot
like image 29
isJustMe Avatar answered Oct 06 '22 17:10

isJustMe