suggestionbox problem in Internet Explorer
poesys Mar 26, 2010 8:00 PMI'm having a problem with a suggestionbox component having problems in Internet Explorer but working fine in Firefox. I'd appreciate any suggestions for possible issues that might cause the problem before I dive in and try to get a minimally reproducing example.
The problem: when the user starts typing, the suggestionBox appears, the user selects a row, the input text field fills in and the action happens (filling in other fields), then the suggestionBox doesn't disappear, it just hangs there and does nothing. I have other suggestion boxes in modal panels, if I bring them up they don't appear at all--the suggestionBox functionality doesn't work anymore.
On Firefox, this works as expected, no problems at all. The box disappears and the rest of the form functions as usual.
I did see another forum thread here where nested forms were the problem; that's not the issue here. There's a single form for the main page and each modalPanel has a separate form around a data table in the panel, and I've looked at the generated HTML and there's no nesting.
Here's the segment of code for the main suggestionBox:
<rich:suggestionbox suggestionAction="#{geneSubmission.suggestLoci}" var="l" for="locus" minChars="5" eventsQueue="locusQueue" ignoreDupResponses="true" fetchValue="#{l.name}" nothingLabel="No locus found" width="100" height="300"> <h:column> <h:outputText value="#{l.name}" /> </h:column> <a4j:support event="onselect" action="#{geneSubmission.setLocusSymbol}" reRender="symbol, fullName"> <f:setPropertyActionListener value="#{gene}" target="#{geneSubmission.selectedGene}" /> <f:setPropertyActionListener value="#{l.name}" target="#{gene.locus}" /> </a4j:support> </rich:suggestionbox>
Here's the complete code for the form (not including the code for the modal panels which are outside this form), which includes the above component as the for="locus" component attached to the locus input text field:
<h:form> <a4j:outputPanel id="submissionPanel"> <h:panelGrid columns="2" columnClasses="field,field"> <h:panelGrid columns="1"> <h:inputText id="articleId" required="true" requiredMessage="Must enter article id" value="#{geneSubmission.articleId}"> <a4j:support event="onblur" ajaxSingle="true" reRender="articleMessage,submitButton"> <f:setPropertyActionListener value="#{login.communityId}" target="#{geneSubmission.communityId}" /> </a4j:support> <h:outputLabel for="articleId" styleClass="fieldLabel"> <h:outputText value="*Article Id:" /> </h:outputLabel> <rich:toolTip mode="client" value="Required: The DOI or PubMed id of the article from which you are annotating the genes." styleClass="tooltip" /> </h:inputText> <h:panelGroup id="articleMessage"> <h:message for="articleId" styleClass="errorMessage" /> </h:panelGroup> </h:panelGrid> <h:selectOneRadio id="articleType" value="#{geneSubmission.articleType}" layout="pageDirection" styleClass="radioLabel"> <f:selectItem itemValue="doi" itemLabel="Digital Object Identifier (DOI)" /> <f:selectItem itemValue="pubmed" itemLabel="Pubmed ID" /> </h:selectOneRadio> </h:panelGrid> <rich:dataTable id="locusTable" rows="0" value="#{geneSubmission.genes}" var="gene"> <rich:column> <f:facet name="header"> <h:panelGrid id="locusNameHeader" rowClasses="headerLabel,exampleTableHeader,tooltip" columns="1"> <h:outputText value="*Locus Name" /> <h:outputText value="AT2G23380" /> <rich:toolTip mode="client" value="Required: AGI locus name, the field will autocomplete the name after you type 5 characters" /> </h:panelGrid> </f:facet> <h:panelGrid id="locusField" columns="1" rowClasses="field"> <h:inputText id="locus" value="#{gene.locus}" required="true" requiredMessage="Must enter locus name" size="9"> <a4j:support event="onblur" ajaxSingle="true" reRender="locusMessage,submitButton"> <f:setPropertyActionListener value="#{login.communityId}" target="#{geneSubmission.communityId}" /> </a4j:support> </h:inputText> <h:panelGroup id="locusMessage"> <h:message for="locus" styleClass="errorMessage" /> </h:panelGroup> <rich:suggestionbox suggestionAction="#{geneSubmission.suggestLoci}" var="l" for="locus" minChars="5" eventsQueue="locusQueue" ignoreDupResponses="true" fetchValue="#{l.name}" nothingLabel="No locus found" width="100" height="300"> <h:column> <h:outputText value="#{l.name}" /> </h:column> <a4j:support event="onselect" action="#{geneSubmission.setLocusSymbol}" reRender="symbol, fullName"> <f:setPropertyActionListener value="#{gene}" target="#{geneSubmission.selectedGene}" /> <f:setPropertyActionListener value="#{l.name}" target="#{gene.locus}" /> </a4j:support> </rich:suggestionbox> </h:panelGrid> </rich:column> <rich:column> <f:facet name="header"> <h:panelGrid id="symbolHeader" rowClasses="headerLabel,exampleTableHeader,tooltip" columns="1"> <h:outputText value="Symbol" /> <h:outputText value="CLF" /> <rich:toolTip mode="client" value="Primary symbol for locus; enter new symbol if needed" /> </h:panelGrid> </f:facet> <h:panelGrid id="symbolField" columns="1" rowClasses="field"> <h:inputText value="#{gene.symbol}" id="symbol" size="5"> </h:inputText> <rich:suggestionbox suggestionAction="#{geneSubmission.suggestSymbols}" var="s" for="symbol" minChars="2" eventsQueue="symbolQueue" ignoreDupResponses="true" fetchValue="#{s.symbol}" nothingLabel="No symbols found" width="350" height="300"> <h:column> <f:facet name="header">Symbol</f:facet> <h:outputText value="#{s.symbol}" /> </h:column> <h:column> <f:facet name="header">Full Name</f:facet> <h:outputText value="#{s.fullName}" /> </h:column> <a4j:support event="onselect" reRender="symbol, fullName"> <f:setPropertyActionListener value="#{gene}" target="#{geneSubmission.selectedGene}" /> <f:setPropertyActionListener value="#{s.fullName}" target="#{gene.fullName}" /> </a4j:support> </rich:suggestionbox> <rich:message for="symbol" styleClass="errorMessage" /> </h:panelGrid> </rich:column> <rich:column> <f:facet name="header"> <h:panelGrid id="symbolFullNameHeader" rowClasses="headerLabel,exampleTableHeader,tooltip" columns="1"> <h:outputText value="Symbol Full Name" /> <h:outputText value="CURLY LEAF" /> <rich:toolTip mode="client" value="Full name of symbol; enter new full name if needed" /> </h:panelGrid> </f:facet> <h:panelGrid id="fullNameField" columns="1" rowClasses="field"> <h:inputText value="#{gene.fullName}" id="fullName" size="20" maxlength="200"> </h:inputText> <rich:message for="fullName" styleClass="errorMessage" /> </h:panelGrid> </rich:column> <rich:column> <f:facet name="header"> <h:panelGrid id="annotationsHeader" rowClasses="headerLabel,exampleTableHeader,tooltip" columns="1"> <h:outputText value="*Add Information" /> <h:outputText value="Click links below to add..." /> <rich:toolTip mode="client" value="Required: At least one annotation of this gene from the article" /> </h:panelGrid> </f:facet> <h:panelGrid columns="1" columnClasses="annotationLink"> <a4j:commandLink value="Molecular Function#{gene.functionCount}" id="functionLink" onclick="#{rich:component('functionPanel')}.show()" styleClass="annotationLink" reRender="functionText, functionTable"> <f:setPropertyActionListener value="#{gene}" target="#{geneSubmission.selectedGene}" /> </a4j:commandLink> <a4j:commandLink value="Biological Process#{gene.processCount}" id="processLink" onclick="#{rich:component('processPanel')}.show()" styleClass="annotationLink" reRender="processText, processTable"> <f:setPropertyActionListener value="#{gene}" target="#{geneSubmission.selectedGene}" /> </a4j:commandLink> <a4j:commandLink value="Subcellular Localization#{gene.componentCount}" id="componentLink" onclick="#{rich:component('componentPanel')}.show()" styleClass="annotationLink" reRender="componentText, componentTable"> <f:setPropertyActionListener value="#{gene}" target="#{geneSubmission.selectedGene}" /> </a4j:commandLink> <a4j:commandLink value="Expression#{gene.expressionCount}" id="expressionLink" onclick="#{rich:component('expressionPanel')}.show()" styleClass="annotationLink" reRender="expressionText, expressionTable"> <f:setPropertyActionListener value="#{gene}" target="#{geneSubmission.selectedGene}" /> </a4j:commandLink> <a4j:commandLink value="Interacting Partner/s#{gene.locusCount}" id="partnerLink" onclick="#{rich:component('partnerPanel')}.show()" styleClass="annotationLink" reRender="partnerText, partnerTable"> <f:setPropertyActionListener value="#{gene}" target="#{geneSubmission.selectedGene}" /> </a4j:commandLink> <a4j:commandLink value="Other#{gene.otherCount}" id="otherLink" onclick="#{rich:component('otherPanel')}.show()" styleClass="annotationLink" reRender="otherText, otherTable"> <f:setPropertyActionListener value="#{gene}" target="#{geneSubmission.selectedGene}" /> </a4j:commandLink> </h:panelGrid> </rich:column> </rich:dataTable> <h:panelGrid columns="3"> <a4j:commandButton id="submitButton" value="Save to Database" disabled="#{!geneSubmission.valid}" reRender="submissionPanel" oncomplete="#{rich:component('savedPanel')}.show()" action="#{geneSubmission.submitAnnotations}"> <a4j:support event="onclick"> <f:setPropertyActionListener value="#{login.communityId}" target="#{geneSubmission.communityId}" /> </a4j:support> </a4j:commandButton> <a4j:commandButton value="Clear Form" immediate="true" ajaxSingle="true" reRender="articleId, articleType, locusTable, submitButton, functionPanel, processPanel, componentPanel, expressionPanel, partnerPanel, otherPanel" action="#{geneSubmission.cancelAnnotations}" /> <a4j:commandButton value="Add Another Locus" type="button" immediate="true" ajaxSingle="true" action="#{geneSubmission.addLocus}" reRender="locusTable,submitButton" /> </h:panelGrid> </a4j:outputPanel> </h:form>