Error using rich:togglePanel
rajeshiv Jun 18, 2009 10:26 AMHi there,
Iam trying to use rich:togglePanel in my application. The code snippet that Iam using is as below :
<rich:togglePanel switchType="client" stateOrder="closed,tip1" id="togglePanel"> <f:facet name="closed"> <rich:toggleControl> <h:graphicImage id="togglePic" style="border-width:0" value="/images/tag.JPG" /> </rich:toggleControl> </f:facet> <f:facet name="tip1"> <h:panelGroup id="tip1Panel"> <h:panelGrid columns="1" border="0"> <h:outputText id="outputTip" value="This is tip 1" /> <rich:toggleControl value="x Close" switchToState="closed" styleClass="nav" /> </h:panelGrid> </h:panelGroup> </f:facet> </rich:togglePanel>
When the page is rendered the tag.jsp is rendered properly, when I click the image the toggle panle opens with the text "This is tip 1". However when I close the toggle panel by clicking the close toggle control the tag.jsp vanishes from the page and I get the following javascript error in the fire fox error console :
$(element) is null , and it is pointing to the appName/a4j.res/prototype.js.faces file, to line number 93 .
The line has the following code:
element._extended=true;return element;};Element.extend.cache={findOrStore:function(value){return this[value]=this[value]||function(){return value.apply(null,[this].concat($A(arguments)));}}};Element.Methods={visible:function(element){return $(element).style.display!='none';},toggle:function(element){element=$(element);Element[Element.visible(element)?'hide':'show'](element);return element;},hide:function(element){$(element).style.display='none';return element;},show:function(element){$(element).style.display='';return element;},remove:function(element){element=$(element);element.parentNode.removeChild(element);return element;},update:function(element,html){html=typeof html=='undefined'?'':html.toString();$(element).innerHTML=html.stripScripts();setTimeout(function(){html.evalScripts()},10);return element;},replace:function(element,html){element=$(element);html=typeof html=='undefined'?'':html.toString();if(element.outerHTML){element.outerHTML=html.stripScripts();}else{var range=element.ownerDocument.createRange();range.selectNodeContents(element);element.parentNode.replaceChild(range.createContextualFragment(html.stripScripts()),element);}
your help is highly appreciated, Iam kinda clueless as to what is happening.