Rendered not working. Need help. Urgent!!!

My requirement is there will be 2 pageblocksectionitems(new) will be added to the vf page and those will be hidden by default when the page loads initially.These changes will be moved to Production as-is(hidden). After sometime in the backend they will flip the FEE field value(not displayed on the page) to 5.99 then these 2 pageblocksectionitems should be displayed as per the below conditions.

I am setting the cardreaderfeeIndicator value to 'On' in my controller when the FEE is changed from FREE to 5.99.

I have added below condition rendered to the 2 pageblocksectionitems and now they are getting displayed when the page loads initially(when I change cardreaderfeeIndicator == 'On' for testing). I don't want that 2 happen. I want to display the 2 pageblocksectionitems as per the below conditons.

To display the 1st pageblocksectionitem the condition is cardreaderfeeIndicator == 'On' && Picklist A(cardreader) value is 'Yes'

To display the 1st pageblocksectionitem the condition is cardreaderfeeIndicator == 'On' && Picklist A(cardreader) value is 'No'

But Rendered is not working on the 2 pageblocksectionitems. Please let me know what's wrong with it.

<apex:pageBlockSectionItem id="cardreader" >
<apex:outputPanel >
<apex:outputLabel style="color:red">*</apex:outputLabel>
<apex:outputLabel value="Was card reader provided"/><br/> <apex:outputLabel value="to applicant:" />
</apex:outputPanel>
<apex:inputField value="{!NewSRSMPODLead.Card_Reader_at_Branch__c}" id="inputcardreader" onchange="checkYes('select');" style="width:250px" onkeypress="handleKeyPressSearch(event);" />
</apex:pageBlockSectionItem>
<apex:pageBlockSectionItem id="shipoption" >
<apex:outputPanel id="shipoptionSpan" >
<apex:outputLabel style="color:red">*</apex:outputLabel>
<apex:outputLabel value="Card reader shipping options:"/>
</apex:outputPanel>
<apex:outputPanel id="shipspann" >
<apex:selectList value="{!NewSRSMPODLead.Shipping_Options__c}" id="ShippingOptionsId" size="1" style="width:250px" onkeypress="handleKeyPressSearch(event);" >
<apex:selectOptions Value="{!ShippingOptions}"/>
</apex:selectList>

</apex:outputPanel>

</apex:pageBlockSectionItem>
<apex:pageBlockSectionItem id="emvQn" rendered="{!IF((cardreaderfeeIndicator == 'On' && NewSRSMPODLead.Card_Reader_at_Branch__c == 'Yes'),true,false)}">
<apex:outputPanel id="emvQSpan">
<apex:outputLabel style="color:red">*</apex:outputLabel>
<apex:outputLabel value="If you have a non-EMV"/><br/>
<apex:outputLabel value="compliant card reader, would" /><br/>
                       <apex:outputLabel value="you like to purchase an"/><br/>
<apex:outputLabel value="EMV-compliant card reader:" />
</apex:outputPanel>
<apex:outputPanel id="emvQOSpan">
<apex:selectList Value="{!ReaderOption}" id="ReaderOptionsId" onchange="Readerdef('select');" size="1" style="width:250px" onkeypress="handleKeyPressSearch(event);">
<apex:selectOption itemValue="None" itemLabel="--None--" />
<apex:selectOption itemValue="Yes" itemLabel="Yes"/>
<apex:selectOption itemValue="No" itemLabel="No" />
</apex:selectList>
</apex:outputPanel>
</apex:pageBlockSectionItem>
<apex:pageBlockSectionItem id="emvOpn" rendered="{!IF((cardreaderfeeIndicator == 'On' && NewSRSMPODLead.Card_Reader_at_Branch__c == 'No'),true,false)}">
<apex:outputPanel id="emvOpnSpan">
<apex:outputLabel style="color:red">*</apex:outputLabel>
<apex:outputLabel value="Reader Type:"/>
</apex:outputPanel>
<apex:outputPanel id="emvReadSpan">
<apex:selectList Value="{!NewSRSMPODLead.Reader_Type__c}" id="ReaderTypeId" size="1" style="width:250px" onkeypress="handleKeyPressSearch(event);">
<apex:selectOption itemValue="None" itemLabel="--None--" />
<apex:selectOption itemValue="EMV Card Reader" itemLabel="EMV"/>
<apex:selectOption itemValue="MSR Card Reader" itemLabel="MSR"/>
<apex:selectOption itemValue="Not Applicable" itemLabel="No thanks"/>
</apex:selectList>
</apex:outputPanel>
</apex:pageBlockSectionItem>

Javascript function on change of Picklist A
function checkYes(type){
var shipping = '{!shippingindicator}';
var cardInd = '{!cardreaderfeeIndicator}';
if(type == 'init' && shipping == 'false'){
document.getElementById("{!$Component.thePage.theform.thepageblck.thepageblkSec.shipoption.shipoptionSpan}").style.display ="none";
document.getElementById("{!$Component.thePage.theform.thepageblck.thepageblkSec.shipoption.shipspann}").style.display ="none";
}
else{
if(type == 'init' && shipping == 'true'){
document.getElementById("{!$Component.thePage.theform.thepageblck.thepageblkSec.shipoption.shipoptionSpan}").style.display ="block";
document.getElementById("{!$Component.thePage.theform.thepageblck.thepageblkSec.shipoption.shipspann}").style.display ="block";
}
else{
var chk = document.getElementById("{!$Component.thePage.theform.thepageblck.thepageblkSec.cardreader.inputcardreader}");
if(type != 'init' && chk.value == 'No' && shipping == 'true'){
document.getElementById("{!$Component.thePage.theform.thepageblck.thepageblkSec.shipoption.shipoptionSpan}").style.display ="block";
document.getElementById("{!$Component.thePage.theform.thepageblck.thepageblkSec.shipoption.shipspann}").style.display ="block";
}
else if(type != 'init' && chk.value == '' && shipping == 'true'){
document.getElementById("{!$Component.thePage.theform.thepageblck.thepageblkSec.shipoption.shipoptionSpan}").style.display ="block";
document.getElementById("{!$Component.thePage.theform.thepageblck.thepageblkSec.shipoption.shipspann}").style.display ="block";
}
else{
document.getElementById("{!$Component.thePage.theform.thepageblck.thepageblkSec.shipoption.shipoptionSpan}").style.display ="none";
document.getElementById("{!$Component.thePage.theform.thepageblck.thepageblkSec.shipoption.shipspann}").style.display ="none";
}
}
}
   }

Please ping/email me @sivais040@gmail.com.

Thanks
Kumar

March 29, 2015
·
Like
0
·
Follow
1

Best Answer chosen by SivaG

Mudasir Wani
Hi Kumar,
The reason why it is not displaying is that the section should be rendered on page load then only you can show or hide the section.
To show and hide the section you need to use reRender attribute.

Solution to your problem.

I suggest you to add a button to do show hide on button click and add reRender="emvQn,emvOpn"
I suppose you have a custom controller with save method because reRender is not supported on apex:inputField
<apex:commandButton action="{!save}" value="Save" id="theButton" reRender="emvQn,emvOpn"/>

reRender is not supported on apex:inputField
Refer to --http://www.salesforce.com/docs/developer/pages/Content/pages_compref_inputField.htm
<apex:inputField value="{!NewSRSMPODLead.Card_Reader_at_Branch__c}" id="inputcardreader" onchange="checkYes('select');" style="width:250px" onkeypress="handleKeyPressSearch(event);" />

Wrap your sections in a panel and that panel should load during page load.

Your code should look like
<apex:outputPanel >
Your page block sections here
</apex:outputPanel >

Please mark this as solution if this solves your problem, So that if anyone has this issue this can help.

March 29, 2015
·
Like
0
·
Dislike
0

You need to sign in to do that.

Need an account? Sign Up

Have an account? Sign In

Dismiss

Browse by Topic

Welcome to Support!

Show

sorted by

Rendered not working. Need help. Urgent!!!

You need to sign in to do that.