Share via

Javascript Confirm popup Yes, No button instead of OK and Cancel?

  • Article

Question

Thursday, March 6, 2014 3:53 AM

Hi,

I wrote javascript for confirm popup like below:

var answer = confirm ("Are you sure you want to delete this item ?");

It is showing OK Cancel button popup , but I want to display Yes No buttons on popup insted of OK Cancel buttons...

Appreciate if anyone give proper solution.

Thank you.

Still I could not get proper solution.... Please any one help me solve this... need js solution not jquery..

All replies (5)

Thursday, March 6, 2014 7:39 AM âś…Answered | 1 vote

Hi Praveen

Keep the Dialog.html and MainPage.html under a single folder and run the mainpage.html from your IE and click the button. you will see the contents of the dialog.html in a modal popup window with Yes No buttons and message. 

Click Yes or No button in the modal popup window and it will close the dialog and show an alert based on which button u have clicked in the modal popup

Hope this helps.

Thursday, March 6, 2014 4:19 AM | 1 vote

Hi Praveen

There is not direct option in JavaScript to get Yes/No buttons in a Confirm dialog.

But, we can create a customized dialog box with our own HTML tags, controls and scripts and show it as a confirmation dialog using window.showModalDialog() function

Here is the sample HTML to demonstrate how to create a customized confirmation dialog.

Dialog.HTML (This contains the UI for the confirmation dialog. Message, Yes No buttons etc)

<!DOCTYPE>
<html>
<head>
<title>Confirmation Message</title>
<script language="javascript" type="text/javascript">
window.onload = function()
{
   var messageDiv = document.getElementById('dlgMessage');
   if ( messageDiv != null && typeof(messageDiv) != "undefined" )
     messageDiv.innerHTML = window.dialogArguments;
}
function confirmClick(args)
{
   window.returnValue = args;
   window.close();
}
</script>
</head>
<body>
<div id="dlgMessage">
</div>
<input type="button" value="Yes" id="btnYes" onclick="javascript:confirmClick('yes')"/>
<input type="button" value="No" id="btnNo" onclick="javascript:confirmClick('no');"/>
</body>
</html>

MainPage.HTML (From where the confirmation dialog will be shown. In your case, u can use the script in this html and customize it according to ur needs)

<!DOCTYPE>
<html>
<head>
<title>Main Page</title>
<script language="javascript" type="text/javascript">
function showConfirmDlg(message)
{
   var returnValue = window.showModalDialog("dialog.html",message,"dialogHeight:150px;dialogWidth:200px");

   if ( returnValue == 'yes' )
    alert('Yes button is clicked in the dialog');
   else
    alert('No button is clicked in the dialog');
}
</script>
</head>
<body>
<input id="btnConfirm" type="button" value="Confirm" onclick="javascript:showConfirmDlg('Do you want to continue?');" />
</body>
</html>

Hope this helps.

See this MSDN Link for more information on how to use and customize the showModalDialog() function

http://msdn.microsoft.com/en-us/library/ie/ms536759(v=vs.85).aspx

Thursday, March 6, 2014 5:17 AM | 1 vote

Hope below article can help u

http://www.mindfiresolutions.com/How-to-display-Javascript-YesNo-confirm-dialog-instead-of-OkCancel--307.php

Solution 7 on

http://www.codeproject.com/Questions/523738/JavascriptplusConfirmpluspopupplusYes-cplusNoplus

Thursday, March 6, 2014 5:34 AM

Hi Raghunathan,

Thank you for giving quick reply.. and thank you for giving lot of info about alerts.

I tried to execute your script(second one above)  by using notepad but which is showing 404 error. This is due to dialog.html page how can i rectify this.  

Thanks.

Thursday, March 6, 2014 6:24 AM

Hi Indrajeet, Thanks a lot.

little issue..

I placed the below script, which is working fine... But on the top of the alert window , it is showing "vbscript". I dont want this.. any idea to place some text instead of vbscript there?

    function window.confirm()
    {

        execScript('n = msgbox("Really, delete this thing ?","4132")', "vbscript");
        return(n == 6);
    }

Thanks