667
edits
Changes
no edit summary
<overlay id="firstxpcomchrome-overlay"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<stringbundleset id="stringbundleset">
<stringbundle id="firstxpcomchrome-strings" src="chrome://firstxpcomchrome/locale/firstxpcomchrome.properties"/>
* [http://developer.mozilla.org/en/docs/XUL:dialog dialog]
* [http://developer.mozilla.org/en/docs/XUL:grid grid]
* [http://developer.mozilla.org/en/docs/XUL:columns columns] and [http://developer.mozilla.org/en/docs/XUL:column column]
* [http://developer.mozilla.org/en/docs/XUL:row row]
* [http://developer.mozilla.org/en/docs/XUL:label label]
Let's return to the code we skipped in '''onMenuCommand''' related to the dialog:
<pre>
onMenuItemCommand: function(e) {
result = this.showDialog();
return params.out
},
</pre>
When the menu item is clicked, the dialog will be shown and the values the user enters returned. The '''showDialog''' function begins by packaging up IN (we use '''inn'' because '''in''' is a keyword in JavaScript) and OUT variables. This allows us to pass multiple variables from/to the dialog. In this case, we pass the value of our component's '''name''' attribute to the dialog, so it can be displayed in a textbox for editing. The '''out''' variable will contain the updated values as entered in the dialog's textboxes (the code to do this will be discussed shortly).
We actually display the dialog using '''window.openDialog''', which takes a URI to our dialog's XUL file, as well as a list of options (e.g., dialog is modal, resizable, etc.) and our '''params''' object, containing the inn and out variables. Execution will block until the user clicks OK or Cancel, or closes the window.
Here's the complete XUL file for our dialog, this time with the JavaScript added:
<pre>
