You need to sign in to do that
Don't have an account?
Naishadh
VisualForce JavasScript issue
Hi, In my visualforce page, I want to call apex method through javascript. Following is the code for the same. Code is working fine for Save1 button but not for Save button. Both the button call the same javascript method.
Please guide.
VisualForce Page
<apex:page controller="apexVFJavascript" tabStyle="Opportunity" >
<apex:form >
<apex:actionFunction name="customAction" action="{!customAction}" rendered="true" rerender="myStatus" >
<apex:param name="firstParam" value="" assignTo="{!first}"/>
<apex:param name="secondParam" value="" assignTo="{!second}"/>
</apex:actionFunction>
</apex:form>
<apex:form >
<apex:pageBlock >
<apex:commandButton onclick="doAction()" id="Save" title="Save" value="Save"/> <!-- not working for this button -->
<apex:outputPanel onclick="doAction()" styleClass="btn">Save</apex:outputPanel> <!-- working for this -->
</apex:pageBlock>
<script>
function doAction() {
customAction('1','2');
}
</script>
</apex:form>
<apex:outputPanel id="out">
<apex:outputText value="Hello "/>
<apex:actionStatus startText="requesting..." id="myStatus">
<apex:facet name="stop">{!first} - {!second}</apex:facet>
</apex:actionStatus>
</apex:outputPanel>
</apex:page>
Component Class
public class apexVFJavascript {
private String first='one',second='two';
public void setFirst(String s) {
this.first = s;
}
public String getFirst() {
return first;
}
public void setSecond(String s) {
this.second = s;
}
public String getSecond() {
return this.second;
}
public PageReference customAction() {
Apexpages.addMessage(new Apexpages.Message(Apexpages.Severity.FATAL,'Error Message'));
System.debug(first);
System.debug(second);
return null;
}
}
Got the solution. Here is the solution.
<apex:page controller="apexVFJavascript" tabStyle="Opportunity" >
<apex:form >
<apex:actionFunction name="customAction" action="{!customAction}" rendered="true" rerender="myStatus" >
<apex:param name="firstParam" value="" assignTo="{!first}"/>
<apex:param name="secondParam" value="" assignTo="{!second}"/>
</apex:actionFunction>
<apex:pageBlock title="Test" id="pageBlockId">
<apex:commandButton onclick="return doAction1()" action="{!customAction}" id="Save" title="Save" value="Save"/>
<apex:outputPanel onclick="doAction()" styleClass="btn">Save</apex:outputPanel>
<script>
function doAction() {
customAction('1','2');
}
function doAction1() {
document.getElementById('{!$Component.firstParam}').value = '11';
document.getElementById('{!$Component.secondParam}').value = '22';
return true;
}
</script>
</apex:pageBlock>
<apex:inputhidden id="firstParam" value="{!first}"/>
<apex:inputhidden id="secondParam" value="{!second}"/>
<apex:outputPanel id="out">
<apex:outputText value="Hello "/>
<apex:actionStatus startText="requesting..." id="myStatus">
<apex:facet name="stop">{!first} - {!second}</apex:facet>
</apex:actionStatus>
</apex:outputPanel>
</apex:form>
</apex:page>
All Answers
I have tried your suggestion but no change in output. When I clicked on command button, it just refresh the page.
Sorry! no change in output. Please guide.
Id of command button : j_id0:j_id5:j_id6:Save
Id of outputPanel button : j_id0:j_id5:j_id6:j_id7
Got the solution. Here is the solution.
<apex:page controller="apexVFJavascript" tabStyle="Opportunity" >
<apex:form >
<apex:actionFunction name="customAction" action="{!customAction}" rendered="true" rerender="myStatus" >
<apex:param name="firstParam" value="" assignTo="{!first}"/>
<apex:param name="secondParam" value="" assignTo="{!second}"/>
</apex:actionFunction>
<apex:pageBlock title="Test" id="pageBlockId">
<apex:commandButton onclick="return doAction1()" action="{!customAction}" id="Save" title="Save" value="Save"/>
<apex:outputPanel onclick="doAction()" styleClass="btn">Save</apex:outputPanel>
<script>
function doAction() {
customAction('1','2');
}
function doAction1() {
document.getElementById('{!$Component.firstParam}').value = '11';
document.getElementById('{!$Component.secondParam}').value = '22';
return true;
}
</script>
</apex:pageBlock>
<apex:inputhidden id="firstParam" value="{!first}"/>
<apex:inputhidden id="secondParam" value="{!second}"/>
<apex:outputPanel id="out">
<apex:outputText value="Hello "/>
<apex:actionStatus startText="requesting..." id="myStatus">
<apex:facet name="stop">{!first} - {!second}</apex:facet>
</apex:actionStatus>
</apex:outputPanel>
</apex:form>
</apex:page>