JavaScript error IE 7 MenuItem

billbarbour · 03 Aug 2010, 20:37

I upgraded to the 2.1 release yesterday and started seeing JavaScript error dialog pop up in IE 7 when I click on my menu item. The error is:

Code: Select all

Line: 55
Char: 143
Error: 'undefined' is null or not an object
Code: 0
URL: /webroot/primefaces_resources/2.1/jquery/jquery.js

I looked through the posts and I saw were I should add the ID attribute to the p:menuitem field. Here is my latest revision:

Code: Select all

<p:submenu>
  <f:facet name="label">
    <p:menuitem value="Quit" action="#{userBean.logout}" styleClass="quitMenuStyle" id="quitButton"/>
  </f:facet>
</p:submenu>

Should this be a valid issue or am I off my rocker?

Thank you!

04 Aug 2010, 11:06

Hi,

Can you replicate it at showcase menus as well?

Is this menu or menubar?

billbarbour · 04 Aug 2010, 14:05

It is a menubar. I no longer think this error is related to the menuitem though. It happens every time the page unloads, which is what that menu item does after invalidating the session. So if I just close the window I will see that JavaScript error. The quit on the menu bar in the show case works like a champ.

billbarbour · 04 Aug 2010, 17:12

I have tracked it down to the tabView component of my page. When I remove this JScript dialog box goes away. Here is what my tabView looked like:

Code: Select all

<p:tabView id="details">
    <p:tab id="tab1" title="Tab1" rendered="#{myBean.selected != null}">
        <!-- Panels and panelGrids in here -->
    </p:tab>
    <p:tab id="tab2" title="Tab2" rendered="#{myBean.selected != null}">
        <!-- datatable in here -->
    </p:tab>
 </p:tabView>

billbarbour · 04 Aug 2010, 21:20

I narrowed it down further to a tabView inside a layoutUnit:

Code: Select all

<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.prime.com.tr/ui">
    <f:view contentType="text/html">
    <h:head>
        <title>
            <ui:insert name="title">Litmus Paper</ui:insert>
        </title>
        <meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
    </h:head>
    <h:body>
        <h:form prependId="false">
        <p:layout fullPage="true">
            <p:layoutUnit position="top" height="42">
                <p:menubar id="toolBar">
                    <p:submenu>
                        <f:facet name="label">
                            <p:menuitem value="Quit" action="#{userBean.logout}"/>
                        </f:facet>
                    </p:submenu>
                </p:menubar>
            </p:layoutUnit>
            <p:layoutUnit position="center" height="42">
                <p:tabView id="details" cache="true" collapsible="false" dynamic="false">
                    <p:tab title="English" rendered="true">
                            <h:outputText value="Hello!"/>
                    </p:tab>
                    <p:tab title="Chinese" rendered="true">
                            <h:outputText value="Hello!"/>
                    </p:tab>
                </p:tabView>
            </p:layoutUnit>
        </p:layout>
        </h:form>
    </h:body>
    </f:view>
</html>

Then tried moving the form so that it was inside a layout unit:

Code: Select all

<h:body>
    <p:layout fullPage="true">
        <p:layoutUnit position="top" height="42">
            <h:form prependId="false">
                <p:menubar id="toolBar">
                    <p:submenu>
                        <f:facet name="label">
                            <p:menuitem value="Quit" action="#{userBean.logout}"/>
                        </f:facet>
                    </p:submenu>
                </p:menubar>
            </h:form>
        </p:layoutUnit>
        <p:layoutUnit position="center" height="42">
            <h:form prependId="false">
                A Tab View:
                    <p:tabView cache="true" collapsible="false" dynamic="false">
                    <p:tab title="English" rendered="true">
                            <h:outputText value="Hello!"/>
                    </p:tab>
                    <p:tab title="Chinese" rendered="true">
                            <h:outputText value="Hello"/>
                    </p:tab>
                </p:tabView>
            </h:form>
        </p:layoutUnit>
    </p:layout>
</h:body>

JavaScript error IE 7 MenuItem

Who is online