Hello,
I'm having some issues with an af:table bound to a view object. The table is displaying questions to be administered to students applying for a scholarship. New questions can be created via a popup.. new questions are committed when the user clicks a save button on the popup, and the table is refreshed.
The edit question popup uses af:inputText components to record most of the information for the new question being created. In particular, there is a field called "Question Text" - the display text for the question - which we put a 1000 character limit on. When typing in characters, at a certain point a scroll bar appears on the inputText component. I've noticed that after adding a few questions with the max # of characters, if I add a question, the question text of which doesn't have the max # of characters (and thus has a smaller scroll bar on the inputText component of my edit question popup) when I return to the main table, I lose functionality on my table scroll bar!
For example, any time I make 2 questions with 1000 characters, and then a 3rd question with only two lines of Question Text, the scroll bar on the main table disappears completely until refreshed.
Another time, I made 4 questions with a couple lines of Question Text, then 5 questions (#'s 5-9) with 1000 characters in the question text, then 3 questions that had just enough text to trigger a scroll bar in the inputText component of the Edit Question popup. When I would return to the table after creating questions 10-12, the most recent question would be in view... but if I scrolled to the top of the table and back down, I could only scroll down to question #9.
All of my created data IS there, and a refresh restores the functionality of the table scroll bar. But has anyone seen behavior like this or have any suggestions of table settings, or how to best return from the edit question pop up (maybe I should re-execute the table's VO and NOT try to maintain currency on the newly created row..?) that might fix this?
I'm including the code for my table and popup below just so you can see their settings. Of course, the components involved in this issue are part of a much larger system, so if there isn't enough information in this post to address the issue and you need any specific information (code from a backing bean/action listener method, etc..) just let me know!
Thanks for looking.
<af:panelCollection featuresOff="detach"
id="stuQPc"
partialTriggers=":::delQBtn :::appQCSave :::appQCCancel :::appQuestionSaveBtn :::appQuestionCancelBtn">
<f:facet name="menus"/>
<f:facet name="toolbar">
<af:toolbar id="t2">
<af:outputText value="#{pageFlowScope.mtnAppBean.currentAppName}"
id="ot20"/>
<af:spacer width="10"
height="10" id="s2"/>
<af:commandToolbarButton text="Create Student Question"
partialTriggers="stuQTbl"
clientComponent="true"
icon="/images/add-16x16.png"
disabled="#{ pageFlowScope.mtnAppBean.currentAppId==null}"
id="ctb3">
<af:showPopupBehavior popupId=":::appQuestionsPopup"/>
<af:clientAttribute name="csaIsMultiChoice"
value="No"/>
<af:clientAttribute name="csaIteratorBindingName"
value="AppQuestionStudentRefVO1Iterator"/>
<af:clientListener method="handleEvent"
type="click"/>
<af:serverListener type="csaCustomEvent"
method="#{schlrAppRequestBean.createEntity}"/>
</af:commandToolbarButton>
<af:commandToolbarButton text="Reorder Questions"
partialTriggers="stuQTbl"
clientComponent="true"
icon="/images/add-16x16.png"
disabled="#{pageFlowScope.mtnAppBean.currentAppId==null}"
id="studReorder">
<af:showPopupBehavior popupId=":::studentReorderPopup"/>
</af:commandToolbarButton>
</af:toolbar>
</f:facet>
<f:facet name="statusbar"/>
<af:table value="#{bindings.AppQuestionStudentRefVO1.collectionModel}"
var="row"
rows="#{bindings.AppQuestionStudentRefVO1.rangeSize}"
emptyText="#{bindings.AppQuestionStudentRefVO1.viewable ? 'No rows yet.' : 'Access Denied.'}"
fetchSize="#{bindings.AppQuestionStudentRefVO1.rangeSize}"
selectedRowKeys="#{bindings.AppQuestionStudentRefVO1.collectionModel.selectedRow}"
selectionListener="#{bindings.AppQuestionStudentRefVO1.collectionModel.makeCurrent}"
rowSelection="single"
id="stuQTbl"
columnStretching="last"
displayRow="selected">
<af:column sortProperty="CsaAppQuestionId" sortable="true"
headerText="#{bindings.AppQuestionStudentRefVO1.hints.CsaAppQuestionId.label}"
id="c6"
inlineStyle="vertical-align:top;">
<af:outputText value="#{row.bindings.CsaAppQuestionId.inputValue}"
id="ot21"
inlineStyle="vertical-align:top;">
<af:convertNumber groupingUsed="false"
pattern="#{bindings.AppQuestionStudentRefVO1.hints.CsaAppQuestionId.format}"/>
</af:outputText>
</af:column>
<af:column sortProperty="QuestionSeqNumber" sortable="true"
headerText="#{bindings.AppQuestionStudentRefVO1.hints.QuestionSeqNumber.label}"
id="c7"
inlineStyle="vertical-align:top;">
<af:outputText value="#{row.bindings.QuestionSeqNumber.inputValue}"
id="ot22"
inlineStyle="vertical-align:top;">
<af:convertNumber groupingUsed="false"
pattern="#{bindings.AppQuestionStudentRefVO1.hints.QuestionSeqNumber.format}"/>
</af:outputText>
</af:column>
<af:column sortProperty="QuestionText" sortable="true"
headerText="#{bindings.AppQuestionStudentRefVO1.hints.QuestionText.label}"
noWrap="false"
width="210"
headerNoWrap="false"
id="c8"
inlineStyle="vertical-align:top;">
<af:outputText value="#{row.bindings.QuestionText.inputValue}"
escape="false" converter="hyperlinkConverter"
id="ot23"
inlineStyle="vertical-align:top;"/>
</af:column>
<af:column sortProperty="NumberWordsInResponse" sortable="true"
headerText="#{bindings.AppQuestionStudentRefVO1.hints.NumberWordsInResponse.label}"
id="c9"
inlineStyle="vertical-align:top;">
<af:outputText value="#{row.bindings.NumberWordsInResponse.inputValue}"
rendered="#{row.bindings.QuestionType.attribute == '2017'}"
id="ot24"
inlineStyle="vertical-align:top;">
<af:convertNumber groupingUsed="false"
pattern="#{bindings.AppQuestionStudentRefVO1.hints.NumberWordsInResponse.format}"/>
</af:outputText>
</af:column>
<af:column sortProperty="ResponseRequireDisplayText"
sortable="true"
headerText="#{bindings.AppQuestionStudentRefVO1.hints.ResponseRequireDisplayText.label}"
id="c10"
inlineStyle="vertical-align:top;">
<af:outputText value="#{row.bindings.ResponseRequireDisplayText.inputValue}"
id="ot25"
inlineStyle="vertical-align:top;"/>
</af:column>
<af:column headerText="" id="c11"
inlineStyle="vertical-align:top;">
<af:panelGroupLayout layout="horizontal"
id="pgl2"
valign="top">
<af:commandButton text="Edit"
icon="/images/edit-16x16.png" id="editQ">
<af:showPopupBehavior popupId="::::appQuestionsPopup"/>
<af:clientAttribute name="csaIteratorBindingName"
value="AppQuestionStudentRefVO1Iterator"/>
<af:clientListener type="click" method="handleEvent"/>
<af:serverListener method="#{schlrAppRequestBean.editClicked}"
type="csaCustomEvent"/>
</af:commandButton>
<af:commandButton text="Delete"
icon="/images/delete-16x16.png"
id="cb6">
<af:showPopupBehavior
triggerType="action"
popupId="::::qdelpu"/>
<af:clientAttribute value="AppQuestionStudentRefVO1Iterator"
name="csaIteratorBindingName"/>
<af:clientListener method="handleEvent" type="click"/>
<af:serverListener method="#{schlrAppRequestBean.prepareForDelete}"
type="csaCustomEvent"/>
</af:commandButton>
<af:commandButton text=" Edit Choices "
rendered="#{row.QuestionType != '2017'}"
id="cb7">
<af:showPopupBehavior popupId="::::appQuestionChoice"/>
<af:clientAttribute name="csaIteratorBindingName"
value="AppQuestionStudentRefVO1Iterator"/>
<af:clientListener type="click" method="handleEvent"/>
<af:serverListener method="#{schlrAppRequestBean.editClicked}"
type="csaCustomEvent"/>
</af:commandButton>
</af:panelGroupLayout>
</af:column>
</af:table>
</af:panelCollection>
<af:popup id="appQuestionsPopup"
partialTriggers="tmplt:stuQPc"
contentDelivery="lazyUncached">
<af:dialog title="Student Question" type="none"
partialTriggers="appQuestionCancelBtn"
closeIconVisible="false" id="d8">
<f:facet name="buttonBar">
<af:panelGroupLayout layout="horizontal" halign="center"
id="pgl16">
<af:commandButton text="Save"
actionListener="#{schlrAppRequestBean.saveAppQuestion}"
id="appQuestionSaveBtn"
partialSubmit="true"/>
<af:commandButton text="Cancel"
id="appQuestionCancelBtn"
actionListener="#{schlrAppRequestBean.cancelPopup}"
immediate="true"
clientComponent="true"
partialSubmit="true">
<af:resetActionListener/>
</af:commandButton>
</af:panelGroupLayout>
</f:facet>
<af:panelFormLayout id="pfl2">
<af:inputText value="#{bindings.AppName.inputValue}"
label="#{bindings.AppName.hints.label}"
required="#{bindings.AppName.hints.mandatory}"
columns="#{bindings.AppName.hints.displayWidth}"
maximumLength="#{bindings.AppName.hints.precision}"
shortDesc="#{bindings.AppName.hints.tooltip}"
id="it11">
<f:validator binding="#{bindings.AppName.validator}"/>
</af:inputText>
<af:inputText value="#{bindings.CsaAppQuestionId.inputValue}"
label="#{bindings.CsaAppQuestionId.hints.label}"
required="#{bindings.CsaAppQuestionId.hints.mandatory}"
columns="#{bindings.CsaAppQuestionId.hints.displayWidth}"
maximumLength="#{bindings.CsaAppQuestionId.hints.precision}"
shortDesc="#{bindings.CsaAppQuestionId.hints.tooltip}"
readOnly="true" id="it12">
<f:validator binding="#{bindings.CsaAppQuestionId.validator}"/>
<af:convertNumber groupingUsed="false"
pattern="#{bindings.CsaAppQuestionId.format}"/>
</af:inputText>
<af:inputText value="#{bindings.QuestionSeqNumber.inputValue}"
label="#{bindings.QuestionSeqNumber.hints.label}"
required="#{bindings.QuestionSeqNumber.hints.mandatory}"
columns="#{bindings.QuestionSeqNumber.hints.displayWidth}"
maximumLength="#{bindings.QuestionSeqNumber.hints.precision}"
shortDesc="Order in which question will be displayed to applicant "
id="it13">
<f:validator binding="#{bindings.QuestionSeqNumber.validator}"/>
<af:convertNumber groupingUsed="false"
pattern="#{bindings.QuestionSeqNumber.format}"/>
</af:inputText>
<af:inputText value="#{bindings.NumberWordsInResponse.inputValue}"
label="#{bindings.NumberWordsInResponse.hints.label}"
required="#{bindings.NumberWordsInResponse.hints.mandatory}"
columns="#{bindings.NumberWordsInResponse.hints.displayWidth}"
maximumLength="#{bindings.NumberWordsInResponse.hints.precision}"
shortDesc="Maximum number of words allowed in the response "
disabled="#{bindings.QuestionType.attribute != '2017'}"
partialTriggers="questionTypeId" id="it14">
<f:validator binding="#{bindings.NumberWordsInResponse.validator}"/>
<af:convertNumber groupingUsed="false"
pattern="#{bindings.NumberWordsInResponse.format}"/>
</af:inputText>
<af:inputText value="#{bindings.QuestionText.inputValue}"
label="#{bindings.QuestionText.hints.label}"
required="#{bindings.QuestionText.hints.mandatory}"
columns="60"
maximumLength="#{bindings.QuestionText.hints.precision}"
shortDesc="Verbiage of question " rows="6"
id="it15">
<f:validator binding="#{bindings.QuestionText.validator}"/>
</af:inputText>
<af:panelLabelAndMessage label="#{bindings.ResponseRequire.label}"
showRequired="false" id="plam22">
<af:panelGroupLayout layout="horizontal"
shortDesc="Checkbox indicates a response is required "
id="pgl17">
<af:selectBooleanCheckbox label="#{bindings.ResponseRequire.label}"
id="responseRequire"
value="#{bindings.ResponseRequire.inputValue}"
simple="true"
autoSubmit="true"
shortDesc="Checkbox indicates a response is required "/>
<af:spacer width="5" height="10" id="s9"/>
<af:outputText value="(#{bindings.ResponseRequireDisplayText.inputValue})"
partialTriggers="responseRequire"
id="ot49"/>
</af:panelGroupLayout>
</af:panelLabelAndMessage>
<af:selectOneChoice value="#{bindings.QuestionType.inputValue}"
label="#{bindings.QuestionType.label}"
required="#{bindings.QuestionType.hints.mandatory}"
shortDesc="#{bindings.QuestionType.hints.tooltip}"
id="questionTypeId"
autoSubmit="true">
<f:selectItems value="#{bindings.QuestionType.items}"
id="si4"/>
</af:selectOneChoice>
<af:inputText value="#{bindings.AddedBy.inputValue}"
label="#{bindings.AddedBy.hints.label}"
required="#{bindings.AddedBy.hints.mandatory}"
columns="#{bindings.AddedBy.hints.displayWidth}"
maximumLength="#{bindings.AddedBy.hints.precision}"
shortDesc="#{bindings.AddedBy.hints.tooltip}"
id="it16">
<f:validator binding="#{bindings.AddedBy.validator}"/>
</af:inputText>
<af:inputDate value="#{bindings.AddedOn.inputValue}"
label="#{bindings.AddedOn.hints.label}"
required="#{bindings.AddedOn.hints.mandatory}"
shortDesc="#{bindings.AddedOn.hints.tooltip}"
id="id5">
<f:validator binding="#{bindings.AddedOn.validator}"/>
<af:convertDateTime pattern="#{bindings.AddedOn.format}"/>
</af:inputDate>
<af:inputText value="#{bindings.UpdatedBy.inputValue}"
label="#{bindings.UpdatedBy.hints.label}"
required="#{bindings.UpdatedBy.hints.mandatory}"
columns="#{bindings.UpdatedBy.hints.displayWidth}"
maximumLength="#{bindings.UpdatedBy.hints.precision}"
shortDesc="#{bindings.UpdatedBy.hints.tooltip}"
id="it17">
<f:validator binding="#{bindings.UpdatedBy.validator}"/>
</af:inputText>
<af:inputDate value="#{bindings.UpdatedOn.inputValue}"
label="#{bindings.UpdatedOn.hints.label}"
required="#{bindings.UpdatedOn.hints.mandatory}"
shortDesc="#{bindings.UpdatedOn.hints.tooltip}"
id="id6">
<f:validator binding="#{bindings.UpdatedOn.validator}"/>
<af:convertDateTime pattern="#{bindings.UpdatedOn.format}"/>
</af:inputDate>
</af:panelFormLayout>
</af:dialog>
</af:popup>