Creating Yes/No dialog box in pure JavaScript

Question

I have some code that uses confirm() to prompt the user to answer a Yes or No question.

Unfortunately, my client absolutely insists that the buttons must say "Yes" and "No" instead of "OK" and "Cancel".

Even more unfortunately, I absolutely cannot use jQuery as this is a very large project and I work for a very large company and including jQuery would require full regression testing.

What's the best way to go about this? Links or code samples would be greatly appreciated!

`Questions asking us to recommend or find a tool, library or favorite off-site resource are off-topic for Stack Overflow` — Reinstate Monica Cellio, Oct 03 '13 at 15:55
There is no way to do this in pure JS without building your own dialog box. Why are you unable to use jQuery for new functionality and leave everything else the way it currently is? — Justin Wood, Oct 03 '13 at 15:56
Use http://labs.abeautifulsite.net/archived/jquery-alerts/demo/ — Hackerman, Oct 03 '13 at 15:56
I am not looking for a tool, library, or off-site resource. Indeed, I am looking for a pure JavaScript solution that does not require any of those things. — Don Moore, Oct 03 '13 at 15:57
I agree with dandavis. It's not going to be easy, but at least it's a start: [window.showModalDialog](https://developer.mozilla.org/en-US/docs/Web/API/window.showModalDialog?redirectlocale=en-US&redirectslug=DOM%2Fwindow.showModalDialog) — Scott Mermelstein, Oct 03 '13 at 16:00
Thanks, dandavis! I wasn't aware of that method, I think that's a great start. — Don Moore, Oct 03 '13 at 16:02
@JanZyka - I'd argue that this isn't a duplicate of that question, since the solutions to that question reference jQuery. — Chris Forrence, Oct 03 '13 at 16:07
I believe he wouldn't ask if he has read the referenced question so I think it's duplicate. Just my opinion :) — Jan Zyka, Oct 03 '13 at 16:09
@JanZyka - That's a fair point, and the questions _are_ asking for the same thing. — Chris Forrence, Oct 03 '13 at 16:16

dandavis · Answer 1 · 2013-10-03T16:24:35.970

5

you should edit the html on the linked page (change to yes/no) and put it on your own site to actually collect values, but the following js works in IE, FF, and chrome. It's not modal in chrome, but at least the JS waits for the dialog to close, so it's a drop-in replacement (synchronous) for confirm/prompt/whatever...

showModalDialog("http://danml.com/pub/prompt.html", "hello" ,"world")

edited Oct 03 '13 at 16:24

answered Oct 03 '13 at 16:03

dandavis

16,370
5
40
36

Just 18 more +1s, and you'll get a gold badge for this answer. :-) – Scott Mermelstein Oct 03 '13 at 16:04
it's a shame that showModalDialog isn't better known. it had issues in single-digit-version chrome, but that was a long time ago, and it even works in IE7... – dandavis Oct 03 '13 at 16:05
You may want to submit your answer to the duplicated question as it seems to be making good point! – Jan Zyka Oct 03 '13 at 16:19
1

According to this link, showModalDialog is now deprecated: https://developer.mozilla.org/en-US/docs/Web/API/Window.showModalDialog – Bryan Larson Jul 30 '14 at 18:53
@BryanLarson: i know; chrome is pulling the plug any version now. my, how things change in 9 months... – dandavis Jul 30 '14 at 20:35

score 0 · Answer 2 · answered Oct 03 '13 at 15:57

Copy the style/html of jqueryUI dialog , and attach two events (yes /no) and put the code of "visible/notvisible" there and you will have your own dialog , for sure it is not general porpuse dialog , unless you want to add more code to make it more flexible

Creating Yes/No dialog box in pure JavaScript

2 Answers2