How to dynamically change menu item disabled status from XUL overlay?

How To
1

I’ve created an overlay.xul to add my extension menu items to the Tools menu. I want to have one of the items default to being disabled unless the current editing tab is loaded with a file that has a".pg6" file name extension, in which case it will be set to not disabled (enabled) when the Tools menu is opened.

I’ve tried the following in my overlay.xul file…

<overlay>...
                    <menu id="qpl_menu_build" label="&qpl_menu_build.label;" accesskey="&qpl_menu_build.accesskey;" disabled="true" >
                        <menupopup>
                            <menuitem ...
...

<script>
function IsAPg6() {
	el = document.getElementById("qpl_menu_build");
	if(/\.pg6/.test(ko.views.manager.currentView.koDoc.displayPath))
	{
		el.setAttribute('disabled', 'false');
	}
	else
	{
		el.setAttribute('disabled', 'true');

	}
}

// add event listener to table
var el = document.getElementById("qpl_menu_build");
el.addEventListener("DOMMenuItemActive", IsAPg6, false);
</script>
</overlay>

But the ‘el’ object is null when I try to add an event listener to the menu.

How can I get a handle to the menu object? And, perhaps, is there a better way to do this?

2

But el object isn’t null in function IsAPg6?

3

You pretty much never want to set an attribute to false; due to ridiculous reasons, you want to remove it instead (i.e. el.removeAttribute('disabled');). (Yes, that links goes to the HTML spec; the reason is similar.)

There’s also a whole complex system for updating commands that you might want to look into.

4

Thanks for the suggestion. After a bit of trial and error, I was able to use the XUL tag commandset to basically add a listener for the focus event, and when that occurred go check the file extension of the current document. Since I don’t know what can cause a focus event, I’m just checking everytime and then enabling/disabling my menu item, which is probably overkill. Here’s what I ended up with in my overlay.xul file…

...
<commandset>
    <commandset id="cmd_qpl_menu_build_isapg6" commandupdater="true" events="focus" oncommandupdate="IsAPg6();"/>
    <command id="cmd_qpl_menu_build" />
</commandset>
...
                    <menu id="qpl_menu_build_options" label="&qpl_menu_build.label;" accesskey="&qpl_menu_build.accesskey;" command="cmd_qpl_menu_build" >
                        <menupopup>

...

  
<script>
function IsAPg6() {
    var node = document.getElementById("cmd_qpl_menu_build");

    if (node) {
        if(/\.pg6/.test(ko.views.manager.currentView.koDoc.displayPath))
              node.removeAttribute("disabled");
        else
              node.setAttribute("disabled", "true");
    }
    else {
        Components.utils.reportError('IsAPg6: Cannot ID cmd_qpl_menu_build');
    }
}
</script>
</overlay>