Apex Code Development You need to sign in to do that
Don't have an account?
HugoNow Problem passing parameter to controller from Javascript - PLEASE HELP!
Hi,
I have a nice problem that I am not able to figure out. The requirement is to call a JS when pressing a button. The button passes a parameter to the javascript and I want to be able to read that parameter in the controller to generate a string. Then use that generated string in the VF page. I use multiple buttons (depending on the functionality) and somehow, there is an AJAX refresh problem I can't put my finger on.
The problem is easily reproducable using the code here. To reproduce: press the first and second button one after the other multiple times, you will see that sometimes, the alert message does not correspond to the button. It seems like it shown the last value. But sometimes, it works. Can't figure out a pattern.
Please help!
<apex:page controller="ActionFunctionDemoController">
<apex:form >
<apex:outputPanel id="jspanel">
<script>
function onControllerReturn() {
alert('{!Msg}')
}
</script>
</apex:outputPanel>
<apex:actionFunction name="doControllerSend" action="{!SendParam}" rerender="jspanel" >
<apex:param name="param" value="" />
</apex:actionFunction>
<apex:commandButton onclick="doControllerSend('Param 1');" oncomplete="onControllerReturn()" value="Send Param 1"/>
<apex:commandButton onclick="doControllerSend('Param 2');" oncomplete="onControllerReturn()" value="Send Param 2"/>
</apex:form>
</apex:page>
public class ActionFunctionDemoController{
public ActionFunctionDemoController() {}
public String Msg {get; set;}
public PageReference SendParam() {
String param = ApexPages.currentPage().getParameters().get('param');
Msg = 'Param='+param;
return null;
}
}
Hey HugoNow,
You are close but you need a slight change in approach on the controller (you want to pass in a value to the controller from javascript -> fromJS
and you want the update to happen in your alert after the ajax call has completed (which is why you are seeing sometimes the right value depending on how fast the response came from the call....)
So here is the code you need for your page:
<apex:page controller="ActionFunctionDemoController">
<script>
function sendToController(param) {
doControllerSend(param);
}
</script>
<apex:form >
<apex:outputPanel id="jspanel">
<script>
alert('{!Msg}');
</script>
</apex:outputPanel>
<apex:actionFunction name="doControllerSend" action="{!SendParam}" rerender="jspanel" >
<apex:param name="x" value="x" assignTo="{!fromJS}" />
</apex:actionFunction>
<apex:commandButton oncomplete="sendToController('Param 1');" value="Send Param 1"/>
<apex:commandButton oncomplete="sendToController('Param 2');" value="Send Param 2"/>
</apex:form>
</apex:page>
And the controller:
public class ActionFunctionDemoController{
public String Msg {get; set;}
public String fromJS { get; set; }
public ActionFunctionDemoController() {
}
public PageReference SendParam() {
Msg = 'Param='+fromJS;
return null;
}
}
This way, you pass your parameter value from the button click -> javascript function -> actionFunction -> Parameter -> controller.fromJS
And the button click only calls the update of your jspanel after your command button action has completed (oncomplete)
Cheers