Rich inplaceInput editable mode rendering issue
buffe Oct 12, 2010 6:41 AMHi,
I'm using the rich inplace input in a modal panel. When I click on the component to make it editable the editable text box is appearing on top of the actual text(i.e the actual text is still visible under the input text box). But as the actual behaviour should be the editable text box coming in the place of the actual text. I'm not sure whats wrong there.
the code of the modal panel is
<rich:modalPanel id="propImageModal" autosized="true"> <f:facet name="header"> <h:panelGroup> <h:outputText value="Preview Image" /> </h:panelGroup> </f:facet> <f:facet name="controls"> <h:graphicImage value="/img/popup_close_btn.png" style="cursor:pointer" onclick="Richfaces.hideModalPanel('propImageModal')" /> </f:facet> <div id="imageDiv"><img id="modalImage" src="#{propCompletion.displayImage.imageUrl}" /></div> <table cellpadding="0" cellspacing="0" width="170"> <tr> <td height="3"></td> </tr> <tr> <td width="120" align="center"><a4j:form><rich:inplaceInput maxlength="50" onviewactivation="old = event.memo.oldValue;" layout="block" value="#{propCompletion.displayImage.name}" defaultLabel="Click to add title" id="editPropImageName" showControls="true"> <a4j:support action="#{propCompletion.saveDisplayImage}" reRender="editPropImageName" ajaxSingle="true" event="onviewactivated" onsubmit="if (event.memo.value == old) return false;" /> </rich:inplaceInput></a4j:form></td> <td width="50" align="right"></td> </tr> </table> <a4j:form> <div class="ButtonArea"><a4j:commandButton title="Delete" image="../img/bin_active.png" id="imagedelete" value="Delete" onclick="Richfaces.showModalPanel('confirmPropDelete');"/><a4j:commandButton style="border : 0px;" image="../img/bin_inactive.png" value="Delete" /></div> </a4j:form> </rich:modalPanel>
A sample screen shot of the modal panel is as below and I have highlited the text box in a red colour border.
Can any one help me on this