Script error while opening a modal panel

[aish]

Hi,

On a web page, I have included a modal panel. When that web page is loaded, I could see the script error (at the bottom left of the browser) and when I click that script error, it says, "ModalPanel.Sizer.INITIAL_MIN is null or not an object". It looks like, due to this script error, when I click the link to open the modal panel, it is not opening the modal panel. Then, I refresh the web page (browser refresh) , the script error does not appear after this refresh and the modal panel opens fine when I select the link to the modal panel.

Could you please let me know why this script error is displayed? My environment is Richfaces 3.1.6, weblogic 9.2

Please let me know if you need additional information.

Thanks
Aish

[ilya_shaikovsky]

add your web.xml please. and describe you environment in more details. JSF facelets some third parties and so on.

[aish]

Hi Ilya,

I am copying my web.xml below. Also, apart from JSF chart creator, I am not using any other thing.

I am using IBM RAD 7 for my development which supports JSF 1.1.

Please let me know if you need additional information

Thanks
Aish

web.xml
=======

<?xml version="1.0" encoding="UTF-8"?>
<web-app id="WebApp_ID" version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">
<display-name>
TestSTI</display-name>
<context-param>

The location where state information is saved.
Valid values are 'server' (typically saved in HttpSession) and 'client' (typically
saved as a hidden field in the form.
Default is server.
<param-name>javax.faces.STATE_SAVING_METHOD</param-name>
<param-value>server</param-value>
</context-param>

<context-param>
<param-name>org.richfaces.SKIN</param-name>
<param-value>classic</param-value>
</context-param>

<display-name>RichFaces Filter</display-name>
<filter-name>richfaces</filter-name>
<filter-class>org.ajax4jsf.Filter</filter-class>

<filter-mapping>
<filter-name>richfaces</filter-name>
<servlet-name>Faces Servlet</servlet-name>
REQUEST
FORWARD
INCLUDE
</filter-mapping>
<context-param>

Comma-delimited list of context-relative resource paths under which the JSF implementation
will look for application configuration resources, before loading a configuration resource
named /WEB-INF/facesconfig.xml (if such a resource exists).
<param-name>javax.faces.CONFIG_FILES</param-name>
<param-value></param-value>
</context-param>
<context-param>

The default suffix for extension-mapped resources that contain JSF components.
Default is '.jsp'.
<param-name>javax.faces.DEFAULT_SUFFIX</param-name>
<param-value>.jsp</param-value>
</context-param>
<context-param>

Number of Views to be stored in the session when Server-Side State Saving is being used.
Default is 15.
<param-name>com.sun.faces.NUMBER_OF_VIEWS_IN_SESSION</param-name>
<param-value>15</param-value>
</context-param>
<context-param>

If set to true while server-side state saving is being used, a serialized representation
of the view is stored on the server. This allows for failover and sever clustering support.
Default is false. This parameter is not available in JSF 1.0.
<param-name>com.sun.faces.enableHighAvailability</param-name>
<param-value>false</param-value>
</context-param>
<context-param>

If set to true while client-side state saving is being used, reduces the number of bytes
sent to the client by compressing the state before it is encoded and written as a hidden field.
Default is false. This parameter is not available in JSF 1.0.
<param-name>com.sun.faces.COMPRESS_STATE</param-name>
<param-value>false</param-value>
</context-param>
<context-param>

Monitors Faces JSP files for modifications and synchronizes a running server with
the changes without restarting the server. If this parameter is set to false or
removed from the deployment descriptor, any changes made to Faces JSP files may
not be seen by the server until it is restarted. This parameter is usually set
to true while the Faces JSP files are being developed and debugged in order to
improve the performance of the development environment.
<param-name>com.ibm.ws.jsf.JSP_UPDATE_CHECK</param-name>
<param-value>true</param-value>
</context-param>
<context-param>

Load JSF runtime when the application server starts up. If this parameter is set to false or removed,
JSF runtime will be loaded and initialized when the first JSF request is processed.
This may disable custom JSF extensions, such as factories defined in the project.
<param-name>com.ibm.ws.jsf.LOAD_FACES_CONFIG_AT_STARTUP</param-name>
<param-value>true</param-value>
</context-param>
<context-param>

If set to true disables use of MultipartFacesContext, allowing underlying implementations to be used.
MultipartFacesContext is required when the FileUpload component is used, and can be disabled otherwise.
<param-name>com.ibm.faces.DISABLE_JWL_MULTIPART_CONTEXT</param-name>
<param-value>false</param-value>
</context-param>
<context-param>

Value, in milliseconds, to be used for Expires header for resources served by the JavaScript Resource Servlet.
Default is never (31536000000 milliseconds or 1 year).
<param-name>com.ibm.faces.RESOURCE_EXPIRE_MS</param-name>
<param-value>31536000000</param-value>
</context-param>
<context-param>

Defines the strictness of the conversion when converting from a string to a date.
The higher the value, the more exactly the value must conform to the format.
If 0 (liberal), all 'literals' are ignored while parsing a value, mis-ordered components will be rearranged,
any missing component is supplied using the current datetime, misspellings and incomplete spellings are allowed
(to the extent that they can be evaluated), 'E' and other non-unique components are ignored.
If 1 (strict), all 'literals' are ignored while parsing a value, any missing component is supplied using the current
datetime, misspellings and incomplete spellings are allowed (to the extent that they can be evaluated),
'E' and other non-unique components are ignored. For example if the pattern is MMMM dd, yyyy a user can enter 'Feb/02/04'
and it will be parsed as February 02, 2004.
If 2 (very strict), an exact match is required except long month names can be 'shortened' to the minimum number of unique
characters and 'E' and other non-unique components are ignored. Literals must match exactly.
Default is 1.
<param-name>com.ibm.faces.DATETIME_ASSIST_STRICTNESS</param-name>
<param-value>1</param-value>
</context-param>
<context-param>

Defines the strictness of the conversion when converting from a string to a number.
The higher the value, the more exactly the value must conform to the pattern.
For numbers, currently strictness levels of 0 and 1 are equivalent. If the strictness is 2,
if number is signed, the sign must be provided (otherwise it's assumed positive).
Default is 1.
<param-name>com.ibm.faces.NUMBER_ASSIST_STRICTNESS</param-name>
<param-value>1</param-value>
</context-param>
<context-param>

Defines the path for resources such as JavaScript libraries and images.
The value can be either:
1. An empty string. Context path of the current application will be used.
2. A path string. Example: /project13. A number. Specifies the number of nodes to use from the context path starting from the left.
Example: With a value of 1 if the context path is /screen/faces/SSID110267549/RID1102676
the path will be evaluated as /screen
Default is an empty string.
<param-name>com.ibm.faces.USE_UNENCODED_CONTEXT_PATH</param-name>
<param-value></param-value>
</context-param>
<context-param>

Sets a custom url-pattern for the JavaScript Resource servlet.
Should match servlet mapping setting for the JavaScript Resource servlet. If the default default mapping
value '/.ibmjsfres/*' is modified, this context-param should also be modified.

<param-name>com.ibm.faces.JS_RESOURCE_SERVLET_URL_PATTERN</param-name>
<param-value>/.ibmjsfres/*</param-value>
</context-param>
<context-param>

If set to true, forces JavaScript Resource Servlet to cache all resources on the server.
This can be useful when client-side caching is turned off.
<param-name>com.ibm.faces.JS_RESOURCE_SERVLET_CACHE</param-name>
<param-value>false</param-value>
</context-param>
<context-param>

Sets a custom charset mapping properties file similar to converter.properties in WAS.
<param-name>com.ibm.faces.ENCODING_MAPPING</param-name>
<param-value>converter.properties</param-value>
</context-param>
<context-param>

Number of Views to be stored in the session when Enhanced State Saving is being used.
Default is 15.
<param-name>com.ibm.faces.ENHANCED_SERVER_STATE_SAVING_SESSION_STORED_VIEWS</param-name>
<param-value>15</param-value>
</context-param>
<context-param>

If set to true, the entire JavaScript library, containing code for all components, will be included
in the generated pages as one file. If set to false or removed, multiple smaller JavaScript files will be
included, depending on the components used on the page.Default is false.
<param-name>com.ibm.faces.USE_HXCLIENT_FULL</param-name>
<param-value>false</param-value>
</context-param>

<listener-class>com.sun.faces.config.ConfigureListener</listener-class>


<servlet-name>TilesServet</servlet-name>
<servlet-class>
org.apache.struts.tiles.TilesServlet</servlet-class>
<init-param>
<param-name>definitions-config</param-name>
<param-value>/WEB-INF/tiles-defs.xml</param-value>
</init-param>
<load-on-startup>2</load-on-startup>


<servlet-name>Faces Servlet</servlet-name>
<servlet-class>
javax.faces.webapp.FacesServlet</servlet-class>
<load-on-startup>-1</load-on-startup>


<servlet-name>JavaScript Resource Servlet</servlet-name>
<servlet-class>
com.ibm.faces.webapp.JSResourceServlet</servlet-class>
<load-on-startup>-1</load-on-startup>

<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>/faces/*</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.faces</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>JavaScript Resource Servlet</servlet-name>
<url-pattern>/.ibmjsfres/*</url-pattern>
</servlet-mapping>
<context-param>
<param-name>tdsJNDI</param-name>
<param-value>STI_TDSDEVT</param-value>
</context-param>
<context-param>
<param-name>sdsJNDI</param-name>
<param-value>STI_OSTDEVT</param-value>
</context-param>
<context-param>
<param-name>dbNumRecordsFetch</param-name>
<param-value>5</param-value>
</context-param>

<welcome-file-list>
<welcome-file>index.html</welcome-file>
<welcome-file>index.htm</welcome-file>
<welcome-file>index.jsp</welcome-file>
<welcome-file>default.html</welcome-file>
<welcome-file>default.htm</welcome-file>
<welcome-file>default.jsp</welcome-file>
</welcome-file-list>

<error-page>
<exception-type>java.lang.Exception</exception-type>
/errorPage.faces
</error-page>

<error-page>
<error-code>500</error-code>
/errorPage.faces
</error-page>
<error-page>
<error-code>404</error-code>
/errorPage.faces
</error-page>
<resource-ref>
<res-ref-name>STI_TDSDEVT</res-ref-name>
<res-type>javax.sql.DataSource</res-type>
<res-auth>Container</res-auth>
</resource-ref>
<resource-ref>
<res-ref-name>STI_OSTDEVT</res-ref-name>
<res-type>javax.sql.DataSource</res-type>
<res-auth>Container</res-auth>
</resource-ref>


</web-app>

[nbelaevski]

Aish,

Are there are any errors in Firebug "Net" tab for the first page load?

[aish]

Hi,

I don't understand well what - Firebug "Net" tab - means? Could you please explain.

One thing I am able to say is that, until the page with the modal panel is loaded, I do not see this script error. This script error occurs as soon the as the page with it is loaded.

By looking at it, it looks like it expects some initialization value. As soon as I refresh the browser, this script error goes away.

Please suggest

Thanks
Aish

[nbelaevski]

Hello,

1. Install Firebug tool into Firefox
2. Open it and switch to "Net" tab. Enable it it necessary
3. Clear browser cache and reload the page

[sajeev_m_e]

Hi,

I had the exact same issue as well. I have installed firebug , it dosent show any error . The modal panel dosent display in FireFox as well. In IE it does show the error. This is the Debug result of the error from Internet explorer follows.

   

  A Page refersh fixes the issue . To replicate this issue i have to clean up the Java scripts from the cache

and then start up the application.

This is the snippet of code we are using

<a4j:form id="form1">

.........

<h:selectBooleanCheckbox

                                    rendered="#{reg.active and (not reg.detConfMode) and (reg.isUpdateOperator or reg.isAdminOperator) }"

                                    id="aCheck" value="false" readonly="true">

                                    <rich:componentControl for="panel" attachTo="aCheck"

                                        operation="show" event="onclick" />

                                </h:selectBooleanCheckbox>

.........................

..............

</a4j:form>

Richfaces Version : 3.3.2.SR1

IE Version : 6.0.2900

[todd_morgan]

I'm having this same issue.  Has anyone found a fix or a work around.  On initial load of the page I get this ModalPanel.Sizer being null.  After reload I'm good to go.  I see it in IE7 or IE8.  I'm on richfaces 3.3.3.Final.  In my case I'm inside a jetspeed portal running in weblogic 10. 

[sajeev_m_e]

This issue happens when you are using the  org.richfaces.LoadScriptStrategy  with value set to DEFAULT in web.xml.  The richfaces framework fails to load the required Js files , to display the Modal panel. As a workaround .

_________

We created a Modal panel tag in the first page that ever gets loaded in the application.

<

rich:modalPanel id="work_around_for_richfaces_modal_panel_non_render_issue"></rich:modalPanel>

This would force the framework to load the Js files required to render a Modal panel. And subsequently when time comes to display the Modal Panel , it get rendered as the required js files are already loaded into the users browser

_________

Also we made the following change to the jQuery.js suplied.

The fix involves changing the file JQuery.js . The JQuery.js was calling the DOM elements in a Way thats not Supported by Internet Explorer.

Java Script code change ..

Code Changed

From

if ( document.getElementsByClassName && document.documentElement.getElementsByClassName ) (function(){

var div = document.createElement("div");

div.innerHTML = "<div class='test e'></div><div class='test'></div>";

// Opera can't find a second classname (in 9.6)

if ( div.getElementsByClassName("e").length === 0 )

return;

// Safari caches class attributes, doesn't catch changes (in 3.2)

div.lastChild.className = "e";

if ( div.getElementsByClassName("e").length === 1 )

return;

Expr.order.splice(1, 0, "CLASS");

Expr.find.CLASS = function(match, context, isXML) {

if ( typeof context.getElementsByClassName !== "undefined" && !isXML ) {

return context.getElementsByClassName(match[1]);

}

};

})();

To

if ( document.getElementsByClassName && document.documentElement.getElementsByClassName ) (function(){

var div = document.createElement("div");

div.innerHTML = "<div class='test e'></div><div class='test'></div>";

if(!div.getElementsByClassName) {

div = $(div);

if(!div.getElementsByClassName) {

return;

}

}

// Opera can't find a second classname (in 9.6)

if ( div.getElementsByClassName("e").length === 0 )

return;

// Safari caches class attributes, doesn't catch changes (in 3.2)

div.lastChild.className = "e";

if ( div.getElementsByClassName("e").length === 1 )

return;

Expr.order.splice(1, 0, "CLASS");

Expr.find.CLASS = function(match, context, isXML) {

if ( typeof context.getElementsByClassName !== "undefined" && !isXML ) {

return context.getElementsByClassName(match[1]);

}

};

})();

[todd_morgan]

Thanks, the first trick cleared it up.  Can you explain the second part though.  What symptom were you having that this workaround fixed?

[sajeev_m_e]

i am glad the response helped. The second part may not be quite relevant, to the issue. Also we were using rich faces 3.3.2 and i think the jQuery packaged with richfaces 3.3.3 would have fixed the issue.  After we changed our org.richfaces.LoadScriptStrategy to DEFAULT , we started getting java script errors on IE and the Modal panel issue. The java script errors were not intrusive to our application but it was not quite right. The second part fixes the jQuery code that was generating Java script errors in IE.