Confirm box with button "yes" "no" without jquery and VBscript

Question

Possible Duplicate:
Javascript Confirm popup Yes, No button instead of OK and Cancel

Please someone help me to make a confirm box with button "Yes" and "No" without using jquery or VB.Script. I have searched a lot but I got all of the answers with jquery but that is not my requirement.

I have to call another function from confirmbox function. The code I am using below

HTML

<a href="#" onlick="show_confirm('<?php echo $cat_id; ?>')">Delete</a>

And Javascript

<script type="text/javascript">
function show_confirm(cat_id)
{
  var conf = confirm("Are you sure you want to delete the file");
  if (conf ==true)
  {
    deleteCatagory(cat_id);
  }
}

function deleteCatagory(cat_id)
{
  var obj = document.getElementById("file_"+cat_id);
  callAjax(cat_id,obj);
}
</script>

@SalmanA exactly - perhaps the problem is that confirm() uses ok/cancel and the asker wants yes/no..? — Ashley Strout, May 12 '12 at 19:26
I have seen that but they suggested either jquery or VB script which I don't want as I have some crossbrowser support — Jhilom, May 12 '12 at 19:31
I don't how these people closed it. The poster mentioned without VB script and jquery. But the suggested duplicate questioned was solved by either jquery or vbscript. — Jhilom, May 13 '12 at 20:47

score 2 · Answer 1 · answered May 12 '12 at 19:34

Very simple. You'll have to custom code an HTML box that has a Yes and No button. The Yes button executes the code and hides the box, the No button just hides the box. Something as simple as this would do:

HTML

<div id="confirmation">
Are you sure you want to delete the category?<br>
<input type="button" onclick="deleteCategory(document.getElementById('catID').value);this.parentNode.style.display='none';" value="Yes">
<input type="button" onclick="this.parentNode.style.display='none';" value="No">
<input type="hidden" id="catID" value="0">
</div>

CSS

<style type="text/css">
<!--
#confirmation {
display: none;
position: absolute;
top: 50%;
left: 50%;
background-color: white;
border: 2px solid white;
padding: 3px;
text-align: center;
width: 200px;
height: 50px;
}
</style>

Updated show_confirm():

function show_confirm(catID) {
    document.getElementById('catID').value=catID;
    document.getElementById('confirmation').style.display='block';
}

score 0 · Answer 2 · answered May 12 '12 at 19:32

0

You need to create it yourself, this: http://dev.sencha.com/deploy/ext-4.0.0/examples/message-box/msg-box.html seems to have a way to do it but this is from 5 minutes of googling. Others suggest using a div to do it, which is my personal preference.

answered May 12 '12 at 19:32

Greg Flynn

1,694
2
14
15

I don't want jquery I mentioned on the title – Jhilom May 12 '12 at 19:39
who said anything about jQuery... – Greg Flynn May 12 '12 at 19:41

Koen Peters · Answer 3 · 2012-05-12T19:44:52.733

-1

If you're fine with the "Ok" or "Cancel" options the confirm box gives you, you only need to fix the typo in your call. I'd do it like this

<a href="JavaScript:void(0);" onclick="show_confirm('<?php echo $cat_id; ?>');">Delete</a>

If you however want to change the default text then you're out of luck with the default confirm popup. You'll have to come up with a html based "popup".

edited May 12 '12 at 19:44

answered May 12 '12 at 19:35

Koen Peters

12,798
6
36
59

He asked about how to make a confirm box with "Yes" and "No" option. And you are giving him different suggestion about other thing – Jhilom May 17 '12 at 10:21
You are right. I was just pointing out the error in the code he provided – Koen Peters May 17 '12 at 10:37

Confirm box with button "yes" "no" without jquery and VBscript

3 Answers3