function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Varun99Varun99 

Refreshing output panel

Hi,

       How to Refresh output panel am using rerender in command button.

but it is not working. Is there any way to refresh my panel.

 

My page

===============

<apex:page>

<apex:form>

----------

--------

------------

<apex:outputPanel id="colourpanelid">
<apex:outputPanel id="colourpanel1" rendered="{!colourpanel}">
<apex:commandButton value="Back" action="{!back1}"/><br/><br/>
<apex:pageBlock >
<apex:repeat value="{!categories}" var="a1" >
<apex:commandlink value="Update" style="margin-left:400px;font-weight: bold;font-size:15px;" action="{!update1}">
<apex:param name="aid" value="{!a1.id}"/>
</apex:commandlink><br/>

<apex:outputText value="{!a1.Store_Name__c}" style="font-weight: bold;font-size:15px;"></apex:outputText>
<apex:commandlink action="{!popunpop}">
<apex:outputtext value="Populated:" style="margin-left:400px;font-weight: bold;font-size:12px;"/>&nbsp;<apex:outputtext value="{!Text(a1.populated__c)}" ></apex:outputtext>
&nbsp;&nbsp;&nbsp;
<apex:outputtext value="UnPopulated:" style="font-weight: bold;font-size:12px;"/>&nbsp;<apex:outputtext value="{!Text(a1.Unpopulated__c)}"></apex:outputtext>
</apex:commandlink>
<table cellspacing="0" cellpadding="0">
<tr>
<td class="tdgeneral2">Who Edited</td><td class="tdgeneral3"><apex:outputText value="{!a1.Who_Edited__c}"/></td>
<!--<td class="tdgeneral2">Last Edited</td>
<td class="tdgeneral3"><apex:outputText value="{!a1.Last_Edited__c}"/></td>-->
<td class="tdgeneral2">Last Edited</td>
<td class="tdgeneral3"><apex:outputText value="{0,date,dd'/'MM'/'yyyy}">
<apex:param value="{!a1.Last_Edited__c}"/>
</apex:outputText></td>
</tr>
<!--<tr>
<td class="tdgeneral2">Last Edited</td>
<td class="tdgeneral3">
<apex:outputtext value="{!a1.dateedited1}"/>
</td>
<td class="tdgeneral3">
<apex:outputText value="{0,date,dd'/'MM'/'yyyy}">
<apex:param value="{!a1.Last_Edited__c}"/>
</apex:outputText></td>
<td class="tdgeneral2"></td><td class="tdgeneral3"></td>
</tr>-->
<tr>
<td class="tdgeneral">Street Address </td><td class="tdgeneral1"><apex:outputText value="{!a1.Street_Address__c}"/></td>
<td class="tdgeneral">Cross Street </td><td class="tdgeneral1"><apex:outputText value="{!a1.Cross_Street__c}"/></td>
</tr>
<tr>
<td class="tdgeneral">Additional Address </td><td class="tdgeneral1"> <apex:outputText value="{!a1.Additional_Address__c}"/></td>
<td class="tdgeneral">Email Address </td><td class="tdgeneral1"> <apex:outputText value="{!a1.Email_Address__c}"/></td>
</tr>
<tr>
<td class="tdgeneral">District </td><td class="tdgeneral1"><apex:outputText value="{!a1.District__c}"/><br/></td>
<td class="tdgeneral">Lat_Long </td><td class="tdgeneral1"><apex:outputText value="{!a1.Lat_Long__c}"/><br/></td>
</tr>
<tr>
<td class="tdgeneral">City </td><td class="tdgeneral1"><apex:outputText value="{!a1.City__c}"/></td>
<td class="tdgeneral"> </td><td class="tdgeneral1"></td>
</tr>
<tr>
<td class="tdgeneral"> State </td><td class="tdgeneral1"><apex:outputText value="{!a1.State__c}"/></td>
<td class="tdgeneral"> </td><td class="tdgeneral1"></td>
</tr>
<tr>
<td class="tdgeneral">Post Code </td><td class="tdgeneral1"><apex:outputText value="{!a1.Post_Code__c}"/></td>
<td class="tdgeneral">Manager </td><td class="tdgeneral1"><apex:outputText value="{!a1.Manager__c}"/></td>
</tr>
<tr>
<td class="tdgeneral">Country </td><td class="tdgeneral1"><apex:outputText value="{!a1.Country__c}"/></td>
<td class="tdgeneral"> Description </td><td class="tdgeneral1"><apex:outputText value="{!a1.Description__c}"/></td>
</tr>
<tr>
<td class="tdgeneral">Phone Number </td><td class="tdgeneral1"><apex:outputText value="{!a1.Phone_Number__c}"/></td>
<td class="tdgeneral"> Notes </td><td class="tdgeneral1"><apex:outputText value="{!a1.Notes__c}"/></td>
</tr>
<tr>
<td class="tdgeneral">Fax Number </td><td class="tdgeneral1"><apex:outputText value="{!a1.Fax_Number__c}"/></td>
<td class="tdgeneral"> </td><td class="tdgeneral1"></td>
</tr>
</table>
</apex:repeat><br/>
<!--<apex:commandLink value="Previous" action="{!previous}" /> &nbsp;
<apex:commandLink value="Next" action="{!next}" /><br/>-->
<apex:image value="{!$Resource.Prev}" width="30" height="30">
<apex:actionSupport event="onclick" action="{!previous}" />
</apex:image>
<apex:image value="{!$Resource.Next}" width="29" height="29" style="margin-left:920px;">
<apex:actionSupport event="onclick" action="{!next}" />
</apex:image>
</apex:pageBlock>

</apex:outputPanel>
</apex:outputPanel>
<apex:outputPanel rendered="{!storecolourpanel}" >
<apex:commandButton value="Back" action="{!back1}"/>
<table border ="1" cellspacing="0" cellpadding="0" style="width:1125px">
<th class="headertab1">storeName</th>
<th class="headertab">Street<br/> Address</th>
<th class="headertab">Additional<br/> Address</th>
<th class="headertab">District</th>
<th class="headertab">City </th>
<th class="headertab">State </th>
<th class="headertab">PostCode</th>
<th class="headertab">Country</th>
<th class="headertab">Phone<br/>Number</th>
<th class="headertab">Fax<br/>Number</th>
<th class="headertab">Lat_Long</th>
<th class="headertab">Cross<br/>Street</th>
<th class="headertab">Manager</th>
<th class="headertab">Description</th>
<apex:repeat value="{!stores}" var="st">
<tr><td>{!st.store_name__c}</td>
<td style="{!IF(st.Street_address__C==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.Additional_address__C==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.District__c==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.City__c==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.State__C==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.Post_Code__c==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.Country__c==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.Phone_number__c==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.Fax_number__c==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.Lat_Long__c==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.Cross_street__C==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.Manager__c==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.Description__c==null,'background:red;','background:green;')}"></td>
</tr>
</apex:repeat>
</table>
</apex:outputPanel>
<apex:outputPanel rendered="{!storecolourpanel1}" >
<apex:commandButton value="Back" action="{!back2}"/>
<table border ="1" cellspacing="0" cellpadding="0" style="width:1125px">
<th class="headertab1">storeName</th>
<th class="headertab">Street<br/>Address</th>
<th class="headertab">Additional<br/>Address</th>
<th class="headertab">District</th>
<th class="headertab">City </th>
<th class="headertab">State </th>
<th class="headertab">PostCode</th>
<th class="headertab">Country</th>
<th class="headertab">Phone<br/>Number</th>
<th class="headertab">Fax<br/>Number</th>
<th class="headertab">Lat_Long</th>
<th class="headertab">Cross<br/>Street</th>
<th class="headertab">Manager</th>
<th class="headertab">Description</th>
<apex:repeat value="{!stores}" var="st">
<tr><td>{!st.store_name__c}</td>
<td style="{!IF(st.Street_address__C==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.Additional_address__C==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.District__c==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.City__c==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.State__C==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.Post_Code__c==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.Country__c==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.Phone_number__c==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.Fax_number__c==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.Lat_Long__c==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.Cross_street__C==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.Manager__c==null,'background:red;','background:green;')}"></td>
<td style="{!IF(st.Description__c==null,'background:red;','background:green;')}"></td>
</tr>
</apex:repeat>
</table>
</apex:outputPanel>
<apex:outputpanel id="updateid">
<apex:outputPanel id="updateid1" rendered="{!updatepanel}">
<apex:pageblock >

<center><apex:commandButton value="save" action="{!save1}" rerender="colourpanel,updateid"/>
<apex:commandButton value="Cancel" action="{!cancel}" immediate="true"/></center>
<apex:repeat value="{!edit}" var="a2" >

<!--Date Last Checked<apex:inputField value="{!a2.Last_Edited__c}"/>-->
<table cellspacing="0" cellpadding="0" align="center">
<tr>
<td class="tdgeneral2">Who Edited</td><td class="tdgeneral3"><apex:inputField value="{!a2.Who_Edited__c}"/></td>
<td class="tdgeneral2">Last Edited</td><td class="tdgeneral3"><apex:inputField value="{!a2.Last_Edited__c}"/></td>
</tr>
<tr>
<td class="tdgeneral2">Street Address </td><td class="tdgeneral3"><apex:inputfield value="{!a2.Street_Address__c}"/></td>
<td class="tdgeneral2">Cross Street </td><td class="tdgeneral3"><apex:inputfield value="{!a2.Cross_Street__c}"/></td>
</tr>
<tr>
<td class="tdgeneral2">Additional Address </td><td class="tdgeneral3"> <apex:inputfield value="{!a2.Additional_Address__c}"/></td>
<td class="tdgeneral2">Email Address </td><td class="tdgeneral3"> <apex:inputfield value="{!a2.Email_Address__c}"/></td>
</tr>
<tr>
<td class="tdgeneral2">District </td><td class="tdgeneral3"><apex:inputfield value="{!a2.District__c}"/><br/></td>
<td class="tdgeneral2">Lat_Long </td><td class="tdgeneral3"><apex:inputfield value="{!a2.Lat_Long__c}"/><br/></td>
</tr>
<tr>
<td class="tdgeneral2">City </td><td class="tdgeneral3"><apex:inputfield value="{!a2.City__c}"/></td>
<td class="tdgeneral2"> </td><td class="tdgeneral3"></td>
</tr>
<tr>
<td class="tdgeneral2"> State </td><td class="tdgeneral3"><apex:inputfield value="{!a2.State__c}"/></td>
<td class="tdgeneral2"> </td><td class="tdgeneral3"></td>
</tr>
<tr>
<td class="tdgeneral2">Post Code </td><td class="tdgeneral3"><apex:inputfield value="{!a2.Post_Code__c}"/></td>
<td class="tdgeneral2">Manager </td><td class="tdgeneral3"><apex:inputfield value="{!a2.Manager__c}"/></td>
</tr>
<tr>
<td class="tdgeneral2">Country </td><td class="tdgeneral3"><apex:inputfield value="{!a2.Country__c}"/></td>
<td class="tdgeneral2"> Description </td><td class="tdgeneral3"><apex:inputfield value="{!a2.Description__c}"/></td>
</tr>
<tr>
<td class="tdgeneral2">Phone Number </td><td class="tdgeneral3"><apex:inputfield value="{!a2.Phone_Number__c}"/></td>
<td class="tdgeneral2"> Notes </td><td class="tdgeneral3"><apex:inputfield value="{!a2.Notes__c}"/></td>
</tr>
<tr>
<td class="tdgeneral2">Fax Number </td><td class="tdgeneral3"><apex:inputfield value="{!a2.Fax_Number__c}"/></td>
<td class="tdgeneral2"> </td><td class="tdgeneral3"></td>
</tr>
</table>
</apex:repeat>
</apex:pageblock>
</apex:outputPanel>
</apex:outputPanel>
</apex:form>
</apex:page>

 

 

===============================

 

My save1 method:

 

public PageReference save1()
{

storelist1.clear();
storecolourpanel=false;
retailsearch=false;
Errorpanel=false;
Searchpanel=false;
storepanel=false;

for(store__C s1:storelist)
{
s1.last_edited__C=system.today();
storelist1.add(s1);

}
update storelist1;
colourpanel=true;
updatepanel=false;

 

return null;

}

 

 

 

Thank you.

 

 

PremanathPremanath

You can use the output panel for refreshing like this way..

But it's work on Mozilla only but not Crome.

 

 <apex:outputPanel >      
                         <apex:pageBlockSection >           
                               <apex:inputField value="{!Application__c.Qualification__c}"/>
                          </apex:pageBlockSection> 
                          <apex:actionSupport event="onchange" reRender="Sal" status="Ap"/>
                   </apex:outputPanel>                 
             </apex:pageBlockSection>
             
             <apex:outputPanel id="Sal">       
                   <apex:pageBlockSection title="Education Details" rendered="{!Application__c.Qualification__c=='BE/B-Tech'}" columns="4" >
                          <apex:inputField value="{!Application__c.CollegeName__c}"/><br/>
                          <apex:inputField value="{!Application__c.Branch__c}"/><br/>           
                          <apex:inputField value="{!Application__c.Email__c}"/><br/>
                          <apex:inputField value="{!Application__c.TotalSemisterMarks__c}"/><br/>
                          <apex:inputField value="{!Application__c.YearOfPassing__c}"/><br/>
                          <apex:inputField value="{!Application__c.State__c}"/><br/>
                          <apex:inputField value="{!Application__c.City__c}"/><br/>   
Kapil GoutamKapil Goutam

Premanath is correct. you can also use <apex:actionFunction> as below -

 

<apex:actionFunction name="JsMethod" action="{!ClassMethod}" rerender="pnlRefresh" status="actStatus">
</apex:actionFunction>
<apex:actionstatus id="actStatus">
<apex:facet name="start">
<span style="color:red;font-weight:bold;">Please wait ...</span>
<img src="/img/loading.gif" alt="." />
</apex:facet>
</apex:actionstatus>
<apex:outputPanel id="pnlRefresh">

   /**put the code/controls which you want to refresh **/
</apex:outputPanel>

 

Varun99Varun99

Hi,

          am using action function it doesn't show any button type.

 

how can it work. shall i remove command button?

 

 

Thanks for your reply.

Kapil GoutamKapil Goutam

Yes you can use HTML button too & can call Javascript method onclick event.

Varun99Varun99

Hi,

       how can i call this action function in button.

Can you please write any code.

 

 <center><apex:commandButton value="save" action="{!save1}" rerender="colourpanel,updateid"/>
<apex:commandButton value="Cancel" action="{!cancel}" immediate="true"/></center>

 

 

Thanks for your reply.

Kapil GoutamKapil Goutam

something like as below-

 

<input type="button" onclick="JsMethod();" />

 

OR

 

<apex:commandButton onclick="JsMethod();return false;" />

 

you will get an example in salesforce developer pdf too.