Apex Code Development You need to sign in to do that
Don't have an account?
Aneesha Help with image rerender
I have a custom picklist and a dependant textbox on my page. I am using javascript function to populate the textbox with a value onchange of the picklist value. Now I want to rerender an image on the page whenever the value on the textbox is changed. How do i do that?
I have already tried using actionSupport with inputtext but no use.
<apex:pageBlockSectionItem >
<apex:selectList style="width:100px; height:20px;margin-left:5px;" size="1" id="selectedFld" value="{!selectedValue}" onchange="javascript:updateSelectValue(this.id, this.value)">
<apex:selectOptions value="{!inputField.selectOptions}" />
</apex:selectList>
<apex:outputPanel >
<apex:image id="img" value="{!if(selectedValue=='0', "/resource/1373951589000/Field_mandatory", "")}" height="{!if(selectedValue=='0', "20", "0")}" width="{!if(selectedValue=='0', "2", "0")}" style="vertical-align:top;" />
<apex:inputText value="{!selectedValue}" id="selectedFldValue" title="{!hoverText}" style="width:80px;" rendered="{!if(hasOtherSelect, true, false)}"/>
<!-- <apex:actionSupport event="onchange" rerender="img"/>-->
</apex:outputPanel>
</apex:pageBlockSectionItem>
Okay try by actionfunction
<script>
function callJS(){
callApex();
}
</script>
<apex:actionfunction name="callApex" rerender="img"/>
<apex:pageBlockSectionItem >
<apex:selectList style="width:100px; height:20px;margin-left:5px;" size="1" id="selectedFld" value="{!selectedValue}" onchange="javascript:updateSelectValue(this.id, this.value)">
<apex:selectOptions value="{!inputField.selectOptions}" />
</apex:selectList>
<apex:outputPanel >
<apex:outputPanel id="img">
<apex:image value="{!if(selectedValue=='0', "/resource/1373951589000/Field_mandatory", "")}" height="{!if(selectedValue=='0', "20", "0")}" width="{!if(selectedValue=='0', "2", "0")}" style="vertical-align:top;" />
</apex:outputPanel >
<apex:inputText value="{!selectedValue}" id="selectedFldValue" title="{!hoverText}" style="width:80px;" rendered="{!if(hasOtherSelect, true, false)}" onchange="callJS"/>
<!--<apex:actionSupport event="onchange" rerender="img"/>-->
</apex:outputPanel>
</apex:pageBlockSectionItem>
If this post is helpful please throw Kudos.If this post solves your problem kindly mark it as solution.
Thanks
All Answers
Try like this
<apex:pageBlockSectionItem > <apex:selectList style="width:100px; height:20px;margin-left:5px;" size="1" id="selectedFld" value="{!selectedValue}" onchange="javascript:updateSelectValue(this.id, this.value)"> <apex:selectOptions value="{!inputField.selectOptions}" /> </apex:selectList> <apex:outputPanel > <apex:outputPanel id="img"> <apex:image value="{!if(selectedValue=='0', "/resource/1373951589000/Field_mandatory", "")}" height="{!if(selectedValue=='0', "20", "0")}" width="{!if(selectedValue=='0', "2", "0")}" style="vertical-align:top;" /> </apex:outputPanel > <apex:inputText value="{!selectedValue}" id="selectedFldValue" title="{!hoverText}" style="width:80px;" rendered="{!if(hasOtherSelect, true, false)}"> <apex:actionSupport event="onchange" rerender="img"/> </apex:inputText> </apex:outputPanel> </apex:pageBlockSectionItem>If this post is helpful please throw Kudos.If this post solves your problem kindly mark it as solution.
Thanks
Okay try by actionfunction
<script>
function callJS(){
callApex();
}
</script>
<apex:actionfunction name="callApex" rerender="img"/>
<apex:pageBlockSectionItem >
<apex:selectList style="width:100px; height:20px;margin-left:5px;" size="1" id="selectedFld" value="{!selectedValue}" onchange="javascript:updateSelectValue(this.id, this.value)">
<apex:selectOptions value="{!inputField.selectOptions}" />
</apex:selectList>
<apex:outputPanel >
<apex:outputPanel id="img">
<apex:image value="{!if(selectedValue=='0', "/resource/1373951589000/Field_mandatory", "")}" height="{!if(selectedValue=='0', "20", "0")}" width="{!if(selectedValue=='0', "2", "0")}" style="vertical-align:top;" />
</apex:outputPanel >
<apex:inputText value="{!selectedValue}" id="selectedFldValue" title="{!hoverText}" style="width:80px;" rendered="{!if(hasOtherSelect, true, false)}" onchange="callJS"/>
<!--<apex:actionSupport event="onchange" rerender="img"/>-->
</apex:outputPanel>
</apex:pageBlockSectionItem>
If this post is helpful please throw Kudos.If this post solves your problem kindly mark it as solution.
Thanks