How to Use apex:param in Salesforce Visualforce With Real Examples

What’s that one tag that surprisingly solves several interaction problems for the developers in Visualforce?

Like if they want to pass dynamic IDs, capture row values from tables, and send parameters through action functions.

How would they do it?

That’s where apex:param quietly does the job. It can help you pass values from a Visualforce page to an Apex controller.

Let’s understand how this tag works with working examples.

What is the <apex:param> Tag?

The <apex:param> acts as a messenger between your Visualforce page and your Apex controller. It becomes useful when you want to:

• pass row-specific data from a table
• Send dynamic values through buttons or links
• call Apex from JavaScript
• trigger partial page updates with parameters

Parents Component of apex:param 

The apex:param tag can’t work on its own, and it always needs a parent that actually triggers the action. The tags that support apex:param as a child element are:

• <apex:actionFunction>
• <apex:actionSupport>
• <apex:commandLink>
• <apex:outputLink>
• <apex:outputText>
• <flow:interview>

For apex:param, the value attribute must always be specified, and with it, either the assignedto or name attribute is also required.

What are the meanings of these attributes, and how are they used? I am going to explain in the next part with an example.

Apex Class

public class paramtest {
    public string value { get; set;}
    
    public void testdirect(){
        system.debug(value);
    }
    public void testinput(){
        value = apexpages.currentPage().getParameters().get('inpval');
        system.debug(value);
    }
}

This apex class does not have much use, and the only important piece of code in it is the first line of the function testinput().

The getParameters() gets all the parameters and makes a map out of them, with the key being the name of the parameter. This name is the same name used in the apex:param attribute.

How apex:param Works in Visualforce?

<apex:page controller="paramtest" docType="html-5.0">
<apex:form>

<apex:commandbutton action="{!testdirect}" reRender="test" value="Static value">
<apex:param assignTo="{!value}" value="The static value that was set from vf page"/>
</apex:commandbutton><br/>
<input type="text" id="testinput"/>
<input type="button" onclick="testinputJS()" value="Dynamic Value" class="btn"/>
<apex:outputPanel id="test">
<apex:outputText value="{!value}"/>
</apex:outputPanel>
<apex:actionFunction action="{!testinput}" name="passToController" rerender="test">
<apex:param value="" name="inpval"/>
</apex:actionFunction>
</apex:form>
<script>
function testinputJS(){
var str = document.getElementById('testinput').value;
if(str.length >4){
str= str.substring(0,4);
}
passToController(str);
}
</script>
</apex:page>

In the VF page, we have used <apex:param> at two places, one in the commandbutton and the other in the ActionFunction.

The <apex:param>, which is in the command button, has a value specified to it and is also assigned to a variable in the controller.

This value will be passed to the variable in the controller if the button is clicked. This type of parameter passing is helpful when you are using it in a table over iterated values.

The other is with ActionFunction, where the name of the value is specified; however, if the value is not specified, and left blank.

Here we will have to manually get the data and store it in a variable, like I had done earlier in the VF page.

Output

The output of both actions will be like:

That’s all about using the apex:param tag. It won’t revolutionize your development process, but it really solves the passing of values from Visualforce to Apex without any hassle.

Support

Our team can audit, optimize, and redesign your Salesforce setup for reliability and speed. Reach out at [email protected].

Need dedicated expertise? Hire Webkul Salesforce developers to stabilize and future-proof your org.