Sign Up ›

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
gogz_sfdcgogz_sfdc 

How can I call a jQuery function after a ReRender?

Hi Guys,

 

I'm working through some app development and I've hit a snag. I have some jQuery code which is called using the .ready() function in jQuery. This all works fine until the point I have a ReRender and the DOM is redrawn my code no longer works.

 

Here's my page:

 

 

<apex:page standardController="Handover__c" extensions="HandoverExtension" sidebar="false">
	<apex:includeScript value="{!URLFOR($Resource.JQueryUI, 'jQueryUI/js/jquery-1.5.1.min.js')}"  />
	<script>
		$j = jQuery.noConflict();
		$j(document).ready(function(){
			$j("td.ItemTextCol").find("a").each(function(){
				if($j(this).text().length > 40){
					$j(this).attr("title", $j(this).attr("href"));
					$j(this).text("Long URL Replaced");
				}
			});
		});
	</script>
	<apex:form >
<apex:outputpanel id="ItemLists">
	<apex:pageblock title="Handover Items" mode="detail">
            <apex:actionStatus id="updateStatus">
       		<apex:facet name="start">
       			<apex:outputPanel >
       				<apex:image url="/img/loading.gif"/>
       				<apex:outputtext value=" Working..."/>
       			</apex:outputPanel>
       		</apex:facet>
   		</apex:actionStatus>
		<apex:pageblocktable value="{!Items.handoveritems}" var="i">
				<apex:commandLink action="{!i.activate_deactivate}" rerender="ItemLists" rendered="{!NOT(Items.hasActivate)}" status="updateStatus"> 
					<apex:image url="{!URLFOR($Resource.handover_images, 'HandoverImages/Delete.png')}" alt="Deactivate this Handover Item" title="Deactivate this Handover Item"/>
				</apex:commandLink>
			</apex:column>
			<apex:column Headervalue="Summary" styleClass="ItemTextCol">
				<apex:outputField value="{!i.item.Summary__c}" styleClass="ItemText"/>
			</apex:column>
			<apex:column headerValue="Current Status" >
				<apex:outputField value="{!i.item.Current_Status__c}" />
		</apex:pageblocktable> 
	</apex:pageblock>
	</apex:outputpanel>
</apex:form> 
</apex:page>

Now this all works until the point where I click on the CommandLink and there is a partial page refresh.  

 

Anyone know what I can do here? 

 

How can I call the jQuery code again after the partial page refresh? 

 

alexbalexb

Try using the oncomplete attribute.

 

It's in the docs here:

http://www.salesforce.com/us/developer/docs/pages/Content/pages_compref_commandLink.htm
Prafull G.Prafull G.

put your onready event 's code with in the function and then use this function within the onready event and call the same at commandlink's onComplete action.

 

something like

 

document.ready(function()  {

   sampleMethod();

});

 

function sampleMethod() {// your code here}

 

<apex:commandLink action="{!i.activate_deactivate}" rerender="ItemLists" rendered="{!NOT(Items.hasActivate)}" status="updateStatus" onComplete="sampleMethod();">
lakslaks

Hi crmtech,

 

I had a similar scenario. And your suggestion helped to fix it.

Thank you :-)

 

 

Regards,

Lakshmi.