Sign Up ›

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
karthic sankar 9karthic sankar 9 

how to pass argument to apex method in controller from JavaScript

Hi Experts,

Can u pls let me know how to pass argument from my VF page to controller, using javaScript?

My VF page

<apex:page controller="ViewQAAMController">
<apex:form >
<apex:actionFunction action="{!callMe}" name="callthisinJavaScript" reRender="a" />
<apex:pageBlock >

<apex:pageBlockTable value="{!BadgeList}" var="data" align="center" styleClass="table table-striped" >
<apex:column headerValue="MyValues">
<apex:outputLink value="{!data['Week__c']}" onclick="openWindow()">{!data['Week__c']}</apex:outputLink>
</apex:column>
</apex:pageBlockTable>
</apex:pageBlock>
</apex:form>
<script>
function openWindow(){
         window.open('/apex/AddQAAMWeeklyPlanner');
         alert(callthisinJavaScript());
         callthisinJavaScript();
        }
    </script>
</apex:page>

My controller:

public class ViewQAAMController {

    public PageReference MyMethod() {
        System.debug('I am called');
        pageReference pg = new pageReference('http://www.google.com/');
        pg.setRedirect(true);
        return pg;
    }
    
    public void callMe()
    {
        System.debug('I am called by JavaScript');
    }


    //public List<AggregateResult> BadgeList { get; set; }
   
    public List<AggregateResult> BadgeList
  {
      get
      {
          List<AggregateResult> badges = [select Week__c, max(createddate) apple from QAAM_Weekly_Planner__c Max group by Week__c order by max(createddate) desc LIMIT 10];
          return badges;
      }
      set;
  }
    
   }

I wanted to pass value: {!data['Week__c']} to my controller from JavaScript, pls let me know how to achieve this?

Regards
Karthic Sankar V P
Footprints on the MoonFootprints on the Moon
Hi Karthic, 
Do below changes in VF page and controller-

Chage 1 - VF Page
Add an id attrbute to all the VF tags leading towards <apex:outputLink> like below-  
<apex:page id="pg" controller="ViewQAAMController">
<apex:form id="form">
<apex:actionFunction action="{!callMe}" name="callthisinJavaScript" reRender="a" />
<apex:pageBlock lockid="pb">

<apex:pageBlockTable id="pbTable" value="{!BadgeList}" var="data" align="center" styleClass="table table-striped" >
<apex:column id="column" headerValue="MyValues">
<apex:outputLink id="outputLink" value="{!data['Week__c']}" onclick="openWindow()">{!data['Week__c']}</apex:outputLink>
</apex:column>
</apex:pageBlockTable>
</apex:pageBlock>
</apex:form>
<script>
function openWindow(){
         window.open('/apex/AddQAAMWeeklyPlanner');
         alert(callthisinJavaScript());
         callthisinJavaScript();
        }
    </script>
</apex:page>

Change 2 - Inside controller, simply traverse from <apex:page> to <apex:outputLink> to obtain the value - 
var outputLinkComponent = document.getElementById("pg:form:pb:pbTable:column:outputLink");
var outputLinkValue = outputLinkComponent.value();
Let me know if this helps!
karthic sankar 9karthic sankar 9
Hi Mate,

I can do that, but how that value is passed to the controller? its still in my JavaScript block right? please correct me if my understanding is wrong here

Regards
Karthic Sankar
Footprints on the MoonFootprints on the Moon
My bad, I read it as JS controller instead of Apex Controller.
Use <apex:param> inside <apex:outputLink> to pass valur from VF to Apex- 
<apex:outputLink id="outputLink" value="{!data['Week__c']}" onclick="openWindow()">
	<apex:param name="weekValue" value="{!data['Week__c']}" assignTo="{!<Your variable from Controller>}"/>
</apex:outputLink>
Refer this one - https://developer.salesforce.com/docs/atlas.en-us.pages.meta/pages/pages_compref_param.htm
Hope this helps!
WalgreensListens PortalWalgreensListens Portal
I am also looking for the solution regarding the same, kindly please provide a relevant answer to this. Thanks! WalgreensListens (https://www.logiguard.com/walgreenslistens/)
karthic sankar 9karthic sankar 9
Hi FootPrints on the Moon
Thanks for your reply, I tired but, I am  getting value as NULL.

22:05:26:018 USER_DEBUG [12]|DEBUG|I am called by JavaScriptnull

MY Contoller

public class ViewQAAMController {

    public PageReference MyMethod() {
        System.debug('I am called');
        pageReference pg = new pageReference('http://www.google.com/');
        pg.setRedirect(true);
        return pg;
    }
    
    public void callMe()
    {
        System.debug('I am called by JavaScript' + ValueFromVF);
        
    }


    public String valueFromVF { get; set; }
    //valueFromVF
   
    public List<AggregateResult> BadgeList
  {
      get
      {
          List<AggregateResult> badges = [select Week__c, max(createddate) apple from QAAM_Weekly_Planner__c Max group by Week__c order by max(createddate) desc LIMIT 10];
          return badges;
      }
      set;
  }
    
   }

My VF page:

<apex:page controller="ViewQAAMController">
<apex:form >
<apex:actionFunction action="{!callMe}" name="callthisinJavaScript" reRender="a" />
<apex:pageBlock >

<apex:pageBlockTable value="{!BadgeList}" var="data" align="center" styleClass="table table-striped" >
<apex:column headerValue="MyValues">
<apex:outputLink value="{!data['Week__c']}" onclick="openWindow()">{!data['Week__c']}</apex:outputLink>
<apex:param name="weekValue" value="{!data['Week__c']}" assignTo="{!valueFromVF}"/>
</apex:column>
</apex:pageBlockTable>
</apex:pageBlock>
</apex:form>
<script>
function openWindow(){
         window.open('/apex/AddQAAMWeeklyPlanner');
         alert(callthisinJavaScript());
         callthisinJavaScript();
        }
    </script>
</apex:page>


Please help, i have underlined the changes with Bold. 

Regards
Karthic

 
karthic sankar 9karthic sankar 9
Hi Guys,

I request anyone to please help?

I am stuck here.

Reagrds
Karthic
Footprints on the MoonFootprints on the Moon
Hey Karthic,
If you see the snippet I pasted, <apex:param> must be within <apex:outputLink> 
<apex:outputLink id="outputLink" value="{!data['Week__c']}" onclick="openWindow()">
	<apex:param name="weekValue" value="{!data['Week__c']}" assignTo="{!<Your variable from Controller>}"/>
</apex:outputLink>

Try changing accordingly, and let me know the result!
karthic sankar 9karthic sankar 9
Hi Footprints on the moon,

My bad Sorry.. I have tried as suggested, Still I am getting null value, please help.

Controller:

public class ViewQAAMController {
 
    //valueFromVF
   public String valueFromVF { get; set; }
    public List<AggregateResult> BadgeList
  {
      get
      {
          List<AggregateResult> badges = [select Week__c, max(createddate) apple from QAAM_Weekly_Planner__c Max group by Week__c order by max(createddate) desc LIMIT 10];
          return badges;
      }
      set;
  }
    
     public void CallThisMethod()
    {
        System.debug('The value from VF is '+valueFromVF);
        
    }
    
  
   }

Visual Force

<apex:page controller="ViewQAAMController">
<apex:form >
<apex:actionFunction action="{!CallThisMethod}" name="callthisinJavaScript" reRender="a" />
<apex:pageBlock >
<div align="center" draggable="false" >
<apex:commandButton value="New" onclick="openQAAM()" disabled="false"/>
</div>
<apex:pageBlockTable value="{!BadgeList}" var="data" align="center" styleClass="table table-striped" >
<apex:column headerValue="MyValues">
<apex:outputLink id="PBValue" value="{!data['Week__c']}" onclick="javascript:openWindow('{!$Component.PBValue}')">
<apex:param name="weekValue" value="{!data['Week__c']}" assignTo="{!valueFromVF}"/>
{!data['Week__c']}</apex:outputLink>
</apex:column>
</apex:pageBlockTable>
</apex:pageBlock>
</apex:form>
<script>
function openWindow(Arg){
    var str = document.getElementById('{!$Component.PBValue}');
    alert(str);
         window.open('/apex/AddQAAMWeeklyPlanner');
         callthisinJavaScript();    
        }
        
        function openQAAM()
        {
        window.open('/apex/AddQAAMWeeklyPlanner');
        }
    </script>
</apex:page>