{"id":64413,"date":"2007-07-20T00:53:00","date_gmt":"2007-07-20T00:53:00","guid":{"rendered":"https:\/\/blogs.technet.microsoft.com\/heyscriptingguy\/2007\/07\/20\/how-can-i-create-a-custom-dialog-box\/"},"modified":"2007-07-20T00:53:00","modified_gmt":"2007-07-20T00:53:00","slug":"how-can-i-create-a-custom-dialog-box","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/scripting\/how-can-i-create-a-custom-dialog-box\/","title":{"rendered":"How Can I Create a Custom Dialog Box?"},"content":{"rendered":"

\"Hey, \n

Hey, Scripting Guy! How can I create a custom dialog box that presents the user with two options, and then runs the appropriate subroutine based on the option they chose?

— AM <\/P>\"Spacer\"\"Hey,\"Script<\/A> \n

Hey, AM. Well, today is another day, which is good; after all, yesterday was anything but<\/I> a banner day here in the scripting world, at least not when it comes to important things like baseball and softball. Yesterday morning, for example, the Scripting Editor and her softball team were shellacked 14-2 in a game called after 4 innings due to the \u201cmercy rule.\u201d That was tough: the Scripting Editor is a tad bit competitive, so she wasn\u2019t too pleased about getting beat. On the bright side, however, she did have a fantastic view of the game, particularly of all those ground balls that whizzed by her as she stood in the spot where a real<\/I> second baseman would normally stand. Fortunately, she wasn\u2019t hurt; she didn\u2019t get close enough to any of those ground balls to actually get hit.<\/P>\n\n<\/THEAD>\n\n\n
\n

Note to the Scripting <\/B>Ed<\/B>itor<\/B>. Just a little good-natured sports humor there. You know how much we all really love you.<\/P><\/TD><\/TR><\/TBODY><\/TABLE>\n

<\/DIV>\n\n<\/THEAD>\n\n\n
\n

Ed<\/B>itor\u2019s Note<\/B>. The part about not getting close to those ground balls isn\u2019t true; the Scripting Editor has the bruised shin to prove it. And the part about the good-natured sports humor, well \u2026 the Scripting Editor is well aware of what the rest of the Scripting team thinks of her. Rest assured the feeling is mutual.<\/P><\/TD><\/TR><\/TBODY><\/TABLE>\n

<\/DIV>\n

Later that day the Scripting Son and his baseball team were shellacked in both ends of a doubleheader, 7-0 and 9-1. The Scripting Son didn\u2019t have any ground balls whiz by him; unfortunately that\u2019s about the only thing that went right for him and the team. (If you\u2019re not a baseball fan we can tell you this much: getting a combined total of 5 hits in two games is not the recommended way to win a doubleheader.) <\/P>\n

The net result? During the day the Scripting Editor was in a bad mood, so she didn\u2019t have much to say and pretty much went the entire day without bugging the Scripting Guy who writes this column. That night, the Scripting Son was in a bad mood, so he didn\u2019t have much to say and pretty much went the entire evening without bugging the Scripting Guy who writes this column <\/P>\n

You know, come to think of it, maybe it wasn\u2019t such a bad day after all.<\/P>\n

Of course, when things are at their darkest there\u2019s only one recourse: you must put your faith in a higher power. You know, a higher power like a Scripting Guy who writes a column that explains how you can create a custom dialog box that presents a user with multiple options and then runs the appropriate subroutine based on the option they chose:<\/P>

Set objExplorer = CreateObject(“InternetExplorer.Application”)<\/p>\n
objExplorer.Navigate “file:\/\/\/c:\\scripts\\test.htm”\nobjExplorer.ToolBar = 0\nobjExplorer.StatusBar = 0\nobjExplorer.Width = 400\nobjExplorer.Height = 250\nobjExplorer.Visible = 1<\/p>\n
Do While (objExplorer.Document.All.ButtonClicked.Value = “”)\n    Wscript.Sleep 250\nLoop<\/p>\n
strSelection = objExplorer.Document.All.ButtonClicked.Value<\/p>\n
objExplorer.Quit<\/p>\n
Wscript.Sleep 250<\/p>\n
Select Case strSelection\n    Case “Option 1” \n        Wscript.Echo “You selected Option 1.”\n    Case “Option 2” \n        Wscript.Echo “You selected Option 2.”\n    Case “Option 3” \n        Wscript.Echo “You selected Option 3.”\n    Case “Cancelled”\n        Wscript.Quit\nEnd Select\n<\/PRE>\n
We\u2019ll explain how this script works in just a moment; before we do that, however, we have a few other things to talk about. First, neither VBScript nor Windows Script Host provides a built-in method for creating custom dialog boxes; you can kind of, sort of create custom message boxes, but even then you\u2019re limited to using a finite set of buttons<\/B><\/A>. Therefore, we need to cheat a little in order to do this: we need to create an HTML file that displays our options, and then have our script call this HTML file rather than call a custom dialog box. In fact, that\u2019s what this line of code is for:<\/P>
objExplorer.Navigate “file:\/\/\/c:\\scripts\\test.htm”\n<\/PRE>\n
But more on that in a minute. For now, let\u2019s take a look at that HTML file (C:\\Scripts\\Test.htm):<\/P>
<SCRIPT language=”VBScript”>\n    Sub OKClicked\n        If UserOption(0).Checked Then\n            ButtonClicked.Value = “Option 1”\n        End If\n        If UserOption(1).Checked Then\n            ButtonClicked.Value = “Option 2”\n        End If\n        If UserOption(2).Checked Then\n            ButtonClicked.Value = “Option 3”\n        End If\n    End Sub<\/p>\n
    Sub CancelClicked\n        ButtonClicked.Value = “Cancelled”\n    End Sub\n<\/SCRIPT><\/p>\n
<BODY>\n    <input type=”radio” name=”UserOption” checked=True>Option 1<BR>\n    <input type=”radio” name=”UserOption”>Option 2<BR>\n    <input type=”radio” name=”UserOption”>Option 3<P>\n    <input type=”Button” value=”OK” onClick=”OKClicked”>\n    <input type=”Button” value=”Cancel” onClick=”CancelClicked”>\n    <input type=”hidden” name=”ButtonClicked”>\n<\/BODY>\n<\/PRE>\n
What we\u2019ve got here is an HTML file that displays three radio buttons; that\u2019s what these HTML tags do:<\/P>
<input type=”radio” name=”UserOption”>Option 1<BR>\n<input type=”radio” name=”UserOption”>Option 2<BR>\n<input type=”radio” name=”UserOption”>Option 3<P>\n<\/PRE>\n
In case you\u2019re wondering, we decided to go with radio buttons for one simple reason: that gives us a little more flexibility (adding additional radio buttons makes for a cleaner user interface than adding a bunch of additional push buttons). Do you need just two<\/I> options? That\u2019s fine; simply delete the tag for the third radio button (the one labeled Option 3<\/I>). Need four options? That\u2019s also fine; just copy the tag for Option 3, paste it to the end of list, and change the label to Option 4<\/I>. Pretty simple stuff when you get right down to it.<\/P>\n\n<\/THEAD>\n\n\n
\n
Note<\/B>. OK, so if you haven\u2019t done much work with HTML maybe this isn\u2019t<\/I> all that simple. In that case, you might want to check out the HTA Developers Center<\/B><\/A> for an introduction to working with HTML.<\/P><\/TD><\/TR><\/TBODY><\/TABLE>\n
<\/DIV>\n
In addition to our radio buttons we also have a pair of regular old buttons, one labeled OK<\/B> and the other labeled Cancel<\/B>:<\/P>
<input type=”Button” value=”OK” onClick=”OKClicked”>\n<input type=”Button” value=”Cancel” onClick=”CancelClicked”>\n<\/PRE>\n
As you can see, if and when someone clicks the OK<\/B> button we\u2019re going to run a subroutine named OKClicked; if and when someone clicks the Cancel<\/B> button we\u2019re going to run a subroutine named CancelClicked. And don\u2019t worry; we\u2019ll discuss those two subroutines in just a second.<\/P>\n
Before we can do that, however (and yes, there are<\/I> a lot of twists and turns to today\u2019s column, aren\u2019t there?) we need to discuss this line of code:<\/P>
<input type=”hidden” name=”ButtonClicked”>\n<\/PRE>\n
What we\u2019re doing here is adding a hidden control to our HTML page: the control won\u2019t be visible onscreen, but we can still do things like assign it a value. Why do we need a hidden control on our page? Well, technically we don\u2019t; we could have used a different approach in solving this problem. However, using a hidden control makes this whole task much easier to carry out. We have a hidden control that has no value. As you\u2019ll see, our script periodically checks the value of this hidden control. As soon as a value does<\/I> get assigned to the control the script knows that we\u2019ve made a selection in our \u201cdialog box\u201d and then goes ahead and takes action based on that selection.<\/P>\n
Which, again, is something we\u2019ll explain in just a moment.<\/P>\n
Let\u2019s assume that a user has started your script, something which causes the \u201cdialog box\u201d to appear onscreen. He or she selects one of the radio button options and then clicks OK<\/B>. What happens at that point?<\/P>\n
Well, as we noted, clicking the OK<\/B> button causes the OKClicked subroutine to run. Inside that subroutine we simply execute a series of If Then statements to determine which radio button was selected (or, in HTML parlance, which button was checked):<\/P>
If UserOption(0).Checked Then\n    ButtonClicked.Value = “Option 1”\nEnd If\n<\/PRE>\n
If you\u2019re wondering how this works, all our radio buttons have the same name (UserOption); that\u2019s how we ensure that the buttons work together as a group. In turn, each individual button in a group is automatically assigned an index number: the first button in the group is button 0, the second button is button 1, and so on. All we\u2019re doing here is saying this: If the first button is checked then assign Option 1<\/I> to the value of our hidden control (ButtonClicked). We then repeat this same bit of code for each possible selection.<\/P>\n
What if the user clicks the Cancel<\/B> button? Well, in that case we run a different subroutine (CancelClicked) and assign the value Cancelled<\/I> to the hidden control<\/P>
Sub CancelClicked\n    ButtonClicked.Value = “Cancelled”\nEnd Sub\n<\/PRE>\n
And that\u2019s basically it for the HTML file. Now \u2013 finally! \u2013 let\u2019s turn our attention to the script, which starts out by creating an instance of the InternetExplorer.Application<\/B> object:<\/P>
Set objExplorer = CreateObject(“InternetExplorer.Application”)\n<\/PRE>\n
After we\u2019ve created an instance of Internet Explorer we then use the Navigate<\/B> method to open the file C:\\Scripts\\Test.htm; we configure the size of the Internet Explorer window (hiding the tool bar and status bar while we\u2019re at it); then we make the whole thing appear on screen by setting the Visible<\/B> property to 1:<\/P>
objExplorer.Navigate “file:\/\/\/c:\\scripts\\test.htm”\nobjExplorer.ToolBar = 0\nobjExplorer.StatusBar = 0\nobjExplorer.Width = 400\nobjExplorer.Height = 250\nobjExplorer.Visible = 1\n<\/PRE>\n
At this point we start doing some real<\/I> work. To begin with, we have to make sure the script pauses until the user makes a selection in the HTML file. With that in mind we use this line of code to periodically check the value of the ButtonClicked control:<\/P>
Do While (objExplorer.Document.All.ButtonClicked.Value = “”)\n    Wscript.Sleep 250\nLoop\n<\/PRE>\n
If ButtonClicked has no value (that is, if the value equals \u201c\u201d, an empty string) we simply pause the script for 250 milliseconds and then try again. This continues until the user finally clicks either the OK<\/B> or the Cancel<\/B> button.<\/P>\n\n<\/THEAD>\n\n\n
\n
Note<\/B>. What if the user simply closes the Internet Explorer window? That\u2019s going to generate an error and the script will terminate. If you\u2019d prefer that the script come to a more graceful termination you could include some error handling to check for and respond to that condition. But that\u2019s more than we wanted to do today.<\/P><\/TD><\/TR><\/TBODY><\/TABLE>\n
<\/DIV>\n
As soon as the value of the ButtonClicked control has changed we store that value in a variable named strSelection, then call the Quit<\/B> method to dismiss our instance of Internet Explorer:<\/P>
strSelection = objExplorer.Document.All.ButtonClicked.Value<\/p>\n
objExplorer.Quit\n<\/PRE>\n
From there we pause for 250 milliseconds (giving Internet Explorer a chance to close), then use the following Select Case block to take action based on the user\u2019s selection:<\/P>
Select Case strSelection\n    Case “Option 1” \n        Wscript.Echo “You selected Option 1.”\n    Case “Option 2” \n        Wscript.Echo “You selected Option 2.”\n    Case “Option 3” \n        Wscript.Echo “You selected Option 3.”\n    Case “Cancelled”\n        Wscript.Quit\nEnd Select\n<\/PRE>\n
Obviously these aren\u2019t particularly exciting<\/I> actions, but, needless to say, you can replace our code with pretty much anything you want.<\/P>\n
And there you have it, AM. It\u2019s a bit of a workaround and it\u2019s not quite as elegant as creating a true custom dialog box. But it works.<\/P>\n
For now, though, it\u2019s time to head to Stanwood High School and another Scripting Son doubleheader. Will it be another quiet night at the Scripting Home? We\u2019ll soon find out.<\/P>\n
And no, we won\u2019t discuss the Scripting Editor\u2019s team and its chances of redeeming itself. After all, even a higher power is helpless in the face of some<\/I> things.<\/P><\/p>\n","protected":false},"excerpt":{"rendered":"
Hey, Scripting Guy! How can I create a custom dialog box that presents the user with two options, and then runs the appropriate subroutine based on the option they chose?— AM Hey, AM. Well, today is another day, which is good; after all, yesterday was anything but a banner day here in the scripting world, […]<\/p>\n","protected":false},"author":595,"featured_media":87096,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[1],"tags":[17,3,167,5],"class_list":["post-64413","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-scripting","tag-internet-explorer","tag-scripting-guy","tag-using-the-internet","tag-vbscript"],"acf":[],"blog_post_summary":"
Hey, Scripting Guy! How can I create a custom dialog box that presents the user with two options, and then runs the appropriate subroutine based on the option they chose?— AM Hey, AM. Well, today is another day, which is good; after all, yesterday was anything but a banner day here in the scripting world, […]<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/scripting\/wp-json\/wp\/v2\/posts\/64413","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devblogs.microsoft.com\/scripting\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devblogs.microsoft.com\/scripting\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/scripting\/wp-json\/wp\/v2\/users\/595"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/scripting\/wp-json\/wp\/v2\/comments?post=64413"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/scripting\/wp-json\/wp\/v2\/posts\/64413\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/scripting\/wp-json\/wp\/v2\/media\/87096"}],"wp:attachment":[{"href":"https:\/\/devblogs.microsoft.com\/scripting\/wp-json\/wp\/v2\/media?parent=64413"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/scripting\/wp-json\/wp\/v2\/categories?post=64413"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/scripting\/wp-json\/wp\/v2\/tags?post=64413"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}