Click here to Skip to main content
Rate this: bad
good
Please Sign up or sign in to vote.
See more: C# Javascript
What can I use during confirmation with the user in web application.
 
like we use messagebox in windows app.
 
For e.g
 
if i want to delete any record from data-table then it should ask "Are YOU Sure you Want to Delete Record?" and the prompt should say yes and no, not OK and Cancel.
Posted 14-Jan-10 2:59am
Edited 6-May-13 3:11am
v3
Page 1 of 2

Rate this: bad
good
Please Sign up or sign in to vote.

Solution 13

u can make Custom Javascript Alert and Confirm Dialog boxes, and change the button text on dialog boxes.
 
for this reffer:
http://theinfiniteloopblog.com/programming/jscript/custom-javascript-alert-and-confirm-dialog-boxes/
  Permalink  
v4
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 12

You'd have to fake it using an overlay something like this. This solution won't operate the same way as the onclick="return... method, but it would work with some adaptation.
(you'll have to improve this yrself to make it useable I'm only tying this free hand here for the forum as a suggestion, so it's only pseudocode).
Def. replace the innerHTML and documentGetElement... with JQuery functions and accessors to make sure it's cross browser compatible, and check the syntax!!
 
CSS
<style>
	.confbox
	{
		visibility:hidden;
		width:300px;height:300px;
		z-index:999;
		position:absolute;
		display:block;
		top:30%;
		left:30%; //adjust the top and left values in the js to better position the box
	}
</style>
 
HTML
<div id="myConfirmBoxName" class="confbox"><h3></h3><p></p><span></span></div>
<a href="#" önclick="myConfirmbox.open();">delete this article</a>
 
Javascript:
var confirmBox = function(_id)
{
	this.id = _id;
	this.title = 'My dialog';
	this.text = 'Set this value to set the body text';
	this.options = new Array();
	this.domElement = document.getElementById(_id);
	this.visible = false;
	
	this.addOption = function(txt,val)
	{
		var o = [txt,val];
		options.push(o);
	}
	
	this.setContent = function(title,body)
	{
		this.domElement.getElementsByTagName('h3')[0].innerHTML = title;
		this.domElement.getElementsByTagName('p')[0].innerHTML = body;
		this.domElement.getElementsByTagName('span')[0].innerHTML = '';/delete/article/321/
		this.domElement.getElementsByTagName('h3')[0].innerHTML = title;
		this.domElement.getElementsByTagName('p')[0].innerHTML = body;
		this.domElement.getElementsByTagName('span')[0].innerHTML = '';
		for (var i=2; i<options.length();i++;)
		{
			txt = options[i][0]; //text to show
			val = options[i][1]; //action to perform. how you handle / process this depends how complex you want to get! callbacks etc... it's up to you.
			link = '<a href="'+val+'" önclick="document.getElementById(\'+this.id+\'">'+txt+'</a>';
			this.domElement.getElementsByTagName('span')[0].innerHTML += link;
		}
	}
	this.open = function(destination)
	{
		this.setContent();
		if (this.visible)
		{
			//Add a function here to UNlock the underlying webpage
			//Add a function here to center the box
			this.domElement.style.visibility = "visible";
			} else {
				//Add a function here to LOCK the underlying webpage
				this.domElement.style.visibility = "hidden";
			}
			visible = !visible;
		}
	}
}
 
/*and when you are ready to attach the script to the confirm box, ex. after DOM load event or similar, call this:*/
 
var myConfirmBox = new confirmBox('myConfirmBoxName');
myConfirmbox.title = 'the title i want to use';
myConfirmbox.text = 'the text body I want to show';
myConfirmbox.addOption('Yes',"www.codeproject.com"); 
myConfirmbox.addOption('No',"www.facebook.com");
 
use javascript:yourfunction(); in the addOption val to call a function instead of running a link. if you want 'true/false' to be return to the calling function you cuold add a callback handler to the confirmBox pseudo-class, or re-write the setContent() function to handle the way the links are created in a different way...
  Permalink  
v3
Comments
Member 3509080 at 9-Jun-12 0:05am
   
This could have been a good solution except it's riddled with errors...
1. Get rid of all things to do with visibility. It's easier to control it (and less buggy) with display:none or display:inline, whether it's CSS, JavaScript, or jQuery.
2. Get rid of this.domElement and replace it with just "document" (no quotes). Doing this.domElement the way you have it is like doing document.getElementById(_id).getElementsByTagName and you don't do it that way - you go after the element directly, either by tag name or ID, not both.
3. Wherever you have "options" you need "this." in front of it.
4. You didn't declare the variables "txt", "val", or "link".
5. Need to replace the "o" in "onclick" - it has the one with the 2 dots above it and that's something else entirely and not recognized by Javascript.
6. myConfirmbox needs to be "myConfirmBox" or "myconfirmBox", throughout. Javascript is case-sensitive.
7. myConfirmbox.text needs to be myConfirmbox.body. Text is undefined.
8. In .setContent, where you have title and body, it needs to be this.title and this.body.
9. The link HTML is wrong. I redid it to just:
link = ''+txt+'';
Otherwise the href value will append onto your current URL and it won't redirect right. You also need "http://" in front, not just start it with "www" in the addOptions.
10. "visible = !visible" can go away.
11. In the loop, this.options.length needs to not have parens on it, and the i++ does not get a semi-colon. var i needs to start at 0, not 2.
12. Remove or comment out "delete/article/321/", it serves no purpose
13. Remove "destination" from the open function. You're not passing anything into this function.
 
I spent an hour just debugging all of this because it's probably the only solution that would let someone be able to actually show a box with "Yes" and "No" cross-browser and it seems very customizable on the surface, though I had issues getting a border around it. Here is my code:
 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>MessageBox</title>
<style type="text/css">
.confbox
{
width:300px;
height:300px;
z-index:999;
position:absolute;
top:30%;
left:30%; !adjust the top and left values in the js to better position the box
border:1px solid black;
}
</style>
 

<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript">
var confirmBox = function(_id)
{
this.id = _id;
this.title = 'My dialog';
this.text = 'Set this value to set the body text';
this.options = new Array();

this.addOption = function(txt,val)
{
var o = [txt,val];
this.options.push(o);
}

this.setContent = function(title,body)
{
var link = "";
var txt = "";
var val = "";
 
document.getElementsByTagName('span')[0].innerHTML = '';
document.getElementsByTagName('h3')[0].innerHTML = this.title;
document.getElementsByTagName('p')[0].innerHTML = this.body;
for (var i=0; i<this.options.length;i++)
{
txt = this.options[i][0]; //text to show
val = this.options[i][1]; //action to perform. how you handle or process this depends how complex you want to get! callbacks etc... it's up to you.
link = ''+txt+'';
document.getElementsByTagName('span')[0].innerHTML += link + '   ';
}

}
this.open = function()
{
this.setContent();
if (this.visible)
{
//Add a function here to UNlock the underlying webpage
//Add a function here to center the box
$('#myConfirmBox').attr('style', 'border:none');
$('#myConfirmBox').attr('style', 'display:none');
} else {
//Add a function here to LOCK the underlying webpage
$('#myConfirmBox').attr('style', 'border:2px solid black');
$('#myConfirmBox').attr('style', 'display:inline');
$('this').css('background-color','lightblue');
}
}
}

 
/*and when you are ready to attach the script to the conf
Member 3509080 at 9-Jun-12 0:06am
   
irm box, ex. after DOM load event or similar, call this:*/

var myConfirmBox = new confirmBox('myConfirmBoxName');
 
myConfirmBox.title = 'the title i want to use';
myConfirmBox.body = 'the text body I want to show';
myConfirmBox.addOption('Yes',"http://www.codeproject.com");
myConfirmBox.addOption('No',"http://www.facebook.com");
 
</script>
 
</head>
<body>
Member 3509080 at 9-Jun-12 0:08am
   
It didn't do the link code right above. It should be:
link = '<a href="'+val+'" target="blank">'+txt+'</a>';
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 3

Hi,
 
For adding a delete prompt on a datatable (looks like its going to be a datagrid in UI), you would need to bind the javascript to prompt for this alert during the ItemDataBound event of the datagrid.
 
Thus,
in this event, while the data is binded row by row - add something like:
LinkButton l = (LinkButton)e.Row.FindControl("LinkButton1"); 
l.Attributes.Add("onclick", "javascript:return " +
    "confirm('Are you sure you want to delete this record')"); 
Alternatively,
if the link button in ItemTemplate of datagrid has OnclientClick event exposed (which is present in ASP.NET2.0 onwards), you can add something like:
OnClientClick = 'return confirm("Are you sure you want to delete this entry?");' 
Now its done.
 
Thanks,
Sandeep.
  Permalink  
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 2

This[^] article might help. Smile | :)
  Permalink  
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 5

Hi Amit,
 
This is another issue/question of yours.
 
here is the solution:
One can achieve it - having Yes/No instead of Ok/Cancel using vbScripts.
 
Please find the link below that has all the options and will help you out:
http://www.perlscriptsjavascripts.com/js/alertboxes.html[^]
 
Sandeep.
  Permalink  
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 6

"thanks to all bt d problm is that confirmation box does not provide
Yes/NO rather Ok/Cancel.....and caption"
 
You'll need to write your own code to do that. Javascript is not as rich as C#, so your options are limited. Basically, OK/Cancel is the same as yes/no, tho, seems like a lot of work for a small reward.
  Permalink  
Comments
bandi.ramesh at 16-Feb-13 2:03am
   
you are correct
Minhazur Rahman at 17-Apr-14 10:17am
   
I think you have got the question wrong. All he need is to trigger an event and use confirm() in java script then he can do anything he likes.
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 7

basically, if you're sure your webapp will be accessed via IE, this will do :
 
http://www.webdeveloper.com/forum/showthread.php?t=73124[^]
 
but if you're looking for a cross-browser solution, there isnt one! so, as Mr.Graus said, you'll have to do it yourself, and I agree with him on "Big trouble, small reward" thing.
 
-------------------
Regards
 
H.Maadani
  Permalink  
v3
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 8

I dont think we can change basic functionalty of confirm box.Instead We can go for VB Script Msg Box.
Like if we want Yes & No instead of Ok & Cancel,
Code is...
Var c=MsgBox("Are u want to delete?",4,"Title");
if(c==6)//Yes Option
Some delete operation
else
Some code//value returned would b 7
  Permalink  
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 1

you can still use javascript alert I guess!
 
http://www.w3schools.com/JS/js_popup.asp[^]
 
-----------------
Regards
 
H.Maadani
  Permalink  
v2
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 14

Hi,
 
You can use jquery for this.
$.prompt("Are You Sure, You Want To Delete ?", { buttons: { Yes: true, No: false }, focus: 0, prefix: 'ValidationMsg', callback: caalbackfunction });

function caalbackfunction (v,m,f){
    if(v){
    // Yes Part
    }
    else {
    // No Part
    }
}
 
Happy Coding
Smile | :)
  Permalink  
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 10

In case you want to get inputs from the user (prompt) use this link[^]. However, for just 'Yes/No' confirmation check this link[^].
  Permalink  
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 11

I hope the following helps: -
 
<html>
<head>
<title>confirm before delete</title>
 
<script language="JavaScript" type="text/javascript">
<!--
function confirmDelete() {
if (confirm("Really delete this article?")) {
return true;
} else {
return false;
}
}
//-->
</script>
 
</head>
 
<body>
 
<form id="form1" name="form1">
<h3>List of articles</h3>
<table border=1 cellpadding=3>
<tr>
<td>article 321</td>
<td><a href="/delete/article/321/" onClick="return confirmDelete();">delete this article</a></td>
</tr>
<tr>
<td>article 322</td>
<td><a href="/delete/article/322/" onClick="return confirmDelete();">delete this article</a></td>
</tr>
</table>
</form>
 
</body>
</html>
 

and also try going to the following link. I am sure you will like it and get what you want.
 
http://www.htmlite.com/JS006.php[^]
 
Hope this is helpful. Let me know
 
--
AJ
  Permalink  
Comments
Prince Antony G at 1-Dec-11 7:07am
   
its only gives ok /cancel.Did u check it?
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 15

It might should help you
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
 
<style type="text/css">
a {
    color:#000;
 }
</style>
 
<script type="text/javascript">
 
   var test=0;
   var obj;
   var obj1;
 
window.onload=function() {
 
   obj=document.getElementById('anc');
   obj1=document.getElementById('cfm');
 
obj.onclick=function() {
   conFirm();
   return false;
  }
 }
function conFirm() {
if(test==0){
   obj.innerHTML='confirm?';
   test++;
   return false;
 }
if(test==1){
   obj1.innerHTML=
   '<a href="'+obj.href+'" onclick="conFirm()">Yes<\/a> |'+
   ' <a href="#" onclick="conFirm();return false;">No<\/a>';
   test++;
   return false;
 }
if(test==2) {
   obj.innerHTML='google.com';
   obj1.innerHTML='';
   test=0;
   return true;
  }
 }
</script>
 
</head>
<body>
 
<div>
<a id="anc" href="http://www.google.com/">google.com</a>
</div>
 
<div id="cfm"></div>
 
</body>
</html>
  Permalink  
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 16

use javascript confirm it will fulfill your requirement. as i understand your question
 
example
 
BtnDelete.Attributes.Add("onclick","return confirm('Are you sure you want to delete this record');");
  Permalink  
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 17

01.function ModalPopupsYesNoCancel() {
02.    ModalPopups.YesNoCancel("idYesNoCancel1",
03.        "Confirm close of document",
04.        "<div style='padding: 25px;'><p>You are about to close this document.<br/>" +
05.        "If you don't save this document, all information will be lost.</p>" +
06.        "<p><b>Close document?</b></p></div>",
07.        {
08.            onYes: "ModalPopupsYesNoCancelYes()",
09.            onNo: "ModalPopupsYesNoCancelNo()",
10.            onCancel: "ModalPopupsYesNoCancelCancel()"
11.        }
12.    );
13.}
14.function ModalPopupsYesNoCancelYes() {
15.    alert('You pressed Yes');
16.    ModalPopups.Close("idYesNoCancel1");
17.}
18.function ModalPopupsYesNoCancelNo() {
19.    alert('You pressed No');
20.    ModalPopups.Cancel("idYesNoCancel1");
21.}
22.function ModalPopupsYesNoCancelCancel() {
23.    alert('You pressed Cancel');
24.    ModalPopups.Cancel("idYesNoCancel1");
25.}
  Permalink  
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 20

Check out these links:
 
http://www.worldofwebcraft.com/blog.php?id=1.
http://dev.sencha.com/deploy/ext-4.0.0/examples/message-box/msg-box.html
 
They have examples of several different dialog boxes. There is one that has Yes/No buttons and another that has Yes/No/Cancel. The different dialog boxes are displayed based on the button id. Look at the source for the page and also the JavaScript code to see how it's done.
  Permalink  
v3
Comments
Richard MacCutchan at 17-Apr-13 9:10am
   
Why are you answering a question that was posted more than three years ago and already has plenty of answers?
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 21

check this link
 
make-javascript-alert-yes-no[^]
  Permalink  
v2
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 22

Simply use onclientclick property;
<asp:button id="Button1" runat="server" onclick="Button1_Click" xmlns:asp="#unknown">
onclientclick="javascript:confirm("Are YOU Sure you Want to Delete Record?");" Text="Button" />
  Permalink  
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 23

Just add the kLib.js,kLib-overlay.js and kLib-overlay.css in your project then you can use the kAlert() and kConfirm() functions.
See an example here[^]
 
For making it a Yes/No confirmation box just change the innerHTML of the buttons
by adding lines:
c.ok.innerHTML = "Yes";
c.cancel.innerHTML = "No";
where c is the object returned by kConfirm();
 
You can get more info on how to use kLib here kLib: Fast, Small, and Easy[^].
  Permalink  
v3
Comments
CHill60 at 12-Jun-13 18:58pm
   
This question is over 3 years old and already had 22!!!! solutions posted. All that will happen is that you will attract downvotes.
Oh and it's a link to your own article. What a surprise
Anshu Krishna at 12-Jun-13 19:19pm
   
I am sorry that I didn't notice the Yes/No criteria.
But that can very easily be rectified.
If you have seen the example then you might have noticed that kConfirm() does return a reference to the buttons.
So just by adding 2 line after line 4 like:
 
4. var c = kConfirm("Demo kConfirm\nPlease click a button");
5. c.ok.innerHTML = "Yes";
6. c.cancel.innerHTML = "No";
you can solve that problem too.
 
And as far as the matter of 3 years is concerned, giving an answer here does not just mean that it will only help the person who is asking it.
If some other person in future is in the same situation then this discussion can be very helpful too him.
 
I am giving this solution despite all the other 22 solutions because I believe it is easier and better suited. And the idea can even be used for other similar problems with little modifications.
 
Please try to be more constructive here.
This is CodeProject not YouTube.
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 26

// You can write the below code in javascript function, which will create a confirm message box for you.
var result =window.confirm('Are you sure you want to delete ?');
console.log(result); //print result.
//After this you can use the (result) variable which gives (true/false) based upon user selection of (yes/no)

  Permalink  
Comments
ThePhantomUpvoter at 7-Sep-13 7:27am
   
Do you really think that after 3 years, he is still waiting for an answer?
Page 1 of 2
1 2

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
0 OriginalGriff 5,170
1 DamithSL 4,357
2 Maciej Los 3,750
3 Kornfeld Eliyahu Peter 3,470
4 Sergey Alexandrovich Kryukov 2,851


Advertise | Privacy | Mobile
Web03 | 2.8.141216.1 | Last Updated 7 Sep 2013
Copyright © CodeProject, 1999-2014
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100