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

Question

Javascript Confirm popup, I want to show Yes, No button instead of OK and Cancel.

I have used this vbscript code:

<script language="javascript">
    function window.confirm(str) {
        execScript('n = msgbox("' + str + '","4132")', "vbscript");
        return (n == 6);
    }
</script>

this only works in IE, In FF and Chrome, it doesn't work.

Is there any workround to achieve this in Javascript?

I also want to change the title of popup like in IE 'Windows Internet Explorer' is shown, I want to show here my own application name.

I made a yes no dialog myself its really easy to customize: https://github.com/stein189/YesNoDialog You could try this one if you want to — Szenis, May 18 '15 at 09:06

score 89 · Accepted Answer · answered May 05 '09 at 07:53

Unfortunately, there is no cross-browser support for opening a confirmation dialog that is not the default OK/Cancel pair. The solution you provided uses VBScript, which is only available in IE.

I would suggest using a Javascript library that can build a DOM-based dialog instead. Try Jquery UI: http://jqueryui.com/

score 18 · Answer 2 · edited Jan 14 '13 at 13:37

18

The only way you can accomplish this in a cross-browser way is to use a framework like jQuery UI and create a custom Dialog:

jquery Dialog

It doesn't work in exactly the same way as the built-in confirm popup but you should be able to make it do what you want.

edited Jan 14 '13 at 13:37

Constantinius

32,691
7
72
83

answered May 05 '09 at 07:53

5

For clarity, it's not the ONLY way - you can write your own in Javascript of course, not that it would be the right thing to do. – LeonardChallis Sep 21 '12 at 21:41
1

@LeonardChallis but including a large library just for a modal div functionality is better? I don't think so – nicholaswmin Dec 29 '14 at 11:18

score 8 · Answer 3 · answered Dec 12 '11 at 08:39

You can also use http://projectshadowlight.org/jquery-easy-confirm-dialog/ . It's very simple and easy to use. Just include jquery common library and one more file only:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/blitzer/jquery-ui.css" type="text/css" />
<script src="jquery.easy-confirm-dialog.js"></script>

score 5 · Answer 4 · answered Nov 21 '14 at 08:40

5

Have a look at http://bootboxjs.com/

Very easy to use:

 bootbox.confirm("Are you sure?", function(result) {
  Example.show("Confirm result: "+result);
});

answered Nov 21 '14 at 08:40

Andzej Maciusovic

4,018
1
25
38

score 5 · Answer 5 · answered May 05 '09 at 07:53

5

You can't do this cross-browser with the confirm() function or similar. I highly suggest you use something like the jQuery UI dialog feature to create an HTML dialog box instead.

answered May 05 '09 at 07:53

cletus

599,013
161
897
938

score 4 · Answer 6 · answered Oct 18 '15 at 10:07

4

The featured (but small and simple) library you can use is JSDialog: js.plus/products/jsdialog

Here is a sample for creating a dialog with Yes and No buttons:

JSDialog.showConfirmDialog(
    "Save document before it will be closed?\nIf you press `No` all unsaved changes will be lost.",
    function(result) {
        // check result here
    },
    "warning",
    "yes|no|cancel"
);

JS Dialog demo screenshot

answered Oct 18 '15 at 10:07

Dan Spirit

157
5

1

Hey, where do you donwload this? – Gary Dec 04 '17 at 01:26
@Gary Links have defaulted to blue, underlined text for decades. Use your mouse to hover over the blue text in the first line of this answer and click the left button. – Abandoned Cart Dec 10 '19 at 18:16
premium plugins do not a programmer help – Chris Pink Feb 16 '20 at 10:37

score 3 · Answer 7 · answered Sep 04 '19 at 12:19

you can use sweetalert.

import into your HTML:

<script src="https://cdn.jsdelivr.net/npm/sweetalert2@8"></script>

and to fire the alert:

Swal.fire({
  title: 'Do you want to do this?',
  text: "You won't be able to revert this!",
  type: 'warning',
  showCancelButton: true,
  confirmButtonColor: '#3085d6',
  cancelButtonColor: '#d33',
  confirmButtonText: 'Yes, Do this!',
  cancelButtonText: 'No'
}).then((result) => {
  if (result.value) {
    Swal.fire(
      'Done!',
      'This has been done.',
      'success'
    )
  }
})

for more data visit sweetalert alert website

score 0 · Answer 8 · answered Apr 09 '15 at 09:59

1) You can download and upload below files on your site

<link href="/Style%20Library/css/smoothness/jquery.alerts.css" type="text/css" rel="stylesheet"/>

2) after that you can directly use below code

$.alerts.okButton = "yes"; $.alerts.cancelButton = "no";

in document.ready function.

Please try it will work.

Thanks

score 0 · Answer 9 · answered Nov 10 '21 at 10:57

0

Sweetalert2 provides different type of dialogs. You may also try for this. https://sweetalert2.github.io/

answered Nov 10 '21 at 10:57

Kalpesh Padhariya

1
1

Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Nov 10 '21 at 11:15
While this link may answer the question, it is better to include the essential parts of the answer here and provide the link for reference. Link-only answers can become invalid if the linked page changes. - [From Review](/review/late-answers/30305307) – Mario Petrovic Nov 10 '21 at 15:14

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

9 Answers9

Linked

Related