Find your content:

Search form

You are here

How to pass specific value in apex:repeat to a javascript function?

 
Share

Is there a client-side way of passing a value from within an apex:repeat to a javascript function?

Basically, my list is iterated, with each unique itemLat / itemLon, and I'd need to pass the specific lat/lon back to a javascript function for some processing. Any ideas on how to approach this?

The reason I'd want to do this is because I have a separate JS function that does some JS remoting, so ideally, i'd like to just pass the new params to that function so it can do it's work in the controller, but with the new lat/lon as the starting parameters.

   <apex:repeat var="frm" id="searchResult" value="{!newSearchList}">
     <div id="search-item">
       <p style="font-size:12px">
         <apex:outputLink value="javascript:void(0)" onclick="setCoords(itemLat, itemLon);" id="itemLink">
         <b>{!frm.Customer_gne__r.Name}</b>
           <apex:param name="itemLat" value="{!frm.Test_Lat__c}"/>
           <apex:param name="itemLon" value="{!frm.Test_Lon__c}"/>
         </apex:outputLink><br/>
         {!frm.Primary_Address_gne__r.Name}, {!frm.Primary_Address_gne__r.City_vod__c}<br/>
         {!frm.Primary_Address_gne__r.Phone_vod__c}<br/>
       </p>
     </div>
   </apex:repeat>

  //Snippet
  function setCoords(passedLat,passedLon) {
    alert("testing the alert!" + passedLat + "    " + passedLon);
  }

Solved:

<apex:repeat var="frm" id="searchResult" value="{!newSearchList}">
<div id="search-item">
  <p style="font-size:12px">
         <apex:outputLink value="javascript:void(0)" 
                          onclick="getControllerData({!frm.Test_Lat__c},{!frm.Test_Lon__c},'All',100,10)" 
                          id="itemLink">
         <b>{!frm.Customer_gne__r.Name}</b>
       </apex:outputLink><br/>
       {!frm.Primary_Address_gne__r.Name}, {!frm.Primary_Address_gne__r.City_vod__c}<br/>
       {!frm.Primary_Address_gne__r.Phone_vod__c}<br/>
      </p>
</div>
</apex:repeat> 

Attribution to: tsalb

Possible Suggestion/Solution #1

This is what I did

<apex:page controller="FindYourPlaceController" showHeader="false" standardstylesheets="false">
    <apex:repeat value="{!Organizations}" var="organization" id="Institutions">
        <h3 class="letters" onclick="loadContent('{!organization.OrgType}', '{!organization.Id}')">
            <a class="data" 
               id="{!organization.OrgType}-{!organization.Name}" 
               name="{!organization.OrgType}-{!organization.Name}" 
               href="#{!organization.OrgType}-{!organization.Name}">
                {!organization.Name}
            </a>
        </h3>
        <div id="{!organization.OrgType}_{!organization.Id}"></div>
    </apex:repeat>
</apex:page>

function loadContent(type, id) {
    var elem = '#' + type + '_' + id;
    if(j(elem).html().length == 0) {
     showProgress('#' + type + '_', id);
     j.get('findyourplace/FindYourPlaceInstitutionInfo?instid=' + id, function(data) {
      data = data.substring(data.lastIndexOf('<\/script>') + 9);
      data = data.replace('</html>', '');
         j(elem).html(data);
         j('.hide').hide();
     });
    }
   }

Attribution to: fourq

Possible Suggestion/Solution #2

Try using jQuery to navigate the DOM when you click the link.

Instead of putting the items into a URL argument link with your <apex:outputLink>, maybe try using <apex:hiddenInput> and than when the link is clicked pick up the closest instances of both of these values:

$(this).siblings(...)

To find the nearest elements...don't know exactly how the DOM try will work out but if you post some we can help with javascript


Attribution to: jordan.baucke

Possible Suggestion/Solution #3

If you just need to pass params to a JS function, something like this works - the repeat iterates over a list of accounts, and passes the name and id to a function:

<apex:page controller="pnc_testaccount">
<apex:form>
 <apex:repeat var="frm" id="searchResult" value="{!Accounts}">
     <div id="search-item">
       <p style="font-size:12px">
         <apex:commandLink value="Click for test:" onclick="setCoords('{!frm.Name}', '{!frm.Id}');" id="itemLink">
         <b>{!frm.Name}</b>
         </apex:commandLink><br/>
         </p>
     </div>
   </apex:repeat>
</apex:form>

 <script>
   function setCoords(sName, sId) {
    alert("testing the alert!" + sName + "    " + sId);
  }
</script>

</apex:page>

Attribution to: BritishBoyinDC
This content is remixed from stackoverflow or stackexchange. Please visit https://salesforce.stackexchange.com/questions/2227

My Block Status

My Block Content