function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
tbfan6789tbfan6789 

New to Salesforce and Javascript

Is it possible to call a PageRefence method from a Salesforce class in a Javascript function? The Javascript is on a customized visualforce page.

Deepu8Deepu8

yes, you can do that by using the action:function component or by making an ajax call making your pagereference method as a webservice.

tbfan6789tbfan6789

That's what I thought, but I guess I don't understand the action function component or ajax that well.

 

Here is what I am working on. I have a VisualForce Page that has two radio buttons, PDF and Email (Used input type="radio") and a command button called Submit.

 

What I have now is once the user selects the PDF radio and click Submit, I have a javascript function that will open a new window and generate the customized PDF. As far as the Email option, I have a Page Reference method inside the apex controller extension that will attach the pdf to an e-mail and send it to a specific user.

 

What I would like is in that same Javascript function that opens the new window to also call the PageReference method depending on which radio button was selected. Could you give me an example on how either the action function or ajax could accomplish that? Please let me know if you need more information.

Deepu8Deepu8
Here is how you call the action functionI guess you know where to add these. When you click the command button it would call the javascript function where yoyu can decide what to call , whether to render the pdf or the apex method. If it is apex method call the apex function as shown above and give the reference of your apex method in the actionfunction. That would solve the problem Thanks, Sandeep peddireddy
tbfan6789tbfan6789

I think you were trying to show me how to enter the action function but I don't see it on your post.

 

Anyway, to help out here is the action function I have on the Visual Force Page:

 

<apex:actionFunctionname="submitAction"action="{!submitAction}"rerender=""/>

 

Here are the radio inputs and the apex command submit button:

 

<divstyle="text-align: center">

PDF:

<inputtype="radio" value="Print" name="radioOption" id="radioOption" onclick="togglePrintEmailState();"/>&nbsp;&nbsp;

Email:

<inputtype="radio" value="Email" name="radioOption" id="radioOption" onclick="togglePrintEmailState();"/>

</div>

 

<apex:commandButton value="Submit" onclick="open_or_email();"/>

 

And here is the Javascript function:

 

functionopen_or_email()

{

     if ($("input[@radioOption]:checked").val() == "Email")

       {

              submitAction;

       }

     else if ($("input[@radioOption]:checked").val() == "Print")

      {

               window.open("{!PDF_URL}");

       }

}

 

Hopefully it was formatted here correctly. When I select Email and hit submit nothing happens. I think I'm missing something in the apex command button but I'm not sure what exactly. Does the action function need apex:param as well?

Deepu8Deepu8
Dude you are not calling the correct javascript function. And properly define the javascript function. See the below example how I have called the functionThansks, Sandeep Peddireddy
tbfan6789tbfan6789

Sorry, I'm not sure I understand. Do you mean the function is misssing the script tags? The tags are there in the code (<script type="text/javascript"> </script> and the function is at the top of the visual force page (also included <apex:includeScriptvalue="{!$Resource.jquery}"/>). I should probably post the entire code.

 

<apex:page title="All Payer Summary" standardController="Account" extensions="AllPayersContExt" sidebar="false">
<style type="text/css">
a:focus {
	outline: none;
}

.multiSelect {
	width: 230px;
	border-width: 3px;
	border-radius: 8px;
	border-color: #6C83D1;
}

.page_navigation {
	font-family: tahoma;
	font-size: 11px;
	float: right;
}

.page_navigation a {
	text-decoration: none;
	padding: 3px 5px;
	margin: 0 2px;
	background-color: #D6F0F9;
	color: blue;
	display: block;
	float: left;
	text-align: center;
}

.page_navigation .active_page {
	background-color: white;
	color: black;
}
</style>
	<apex:stylesheet value="{!$Resource.MyServicesStyles}" />
	<apex:includeScript value="{!$Resource.jquery}" />
	<apex:includeScript value="{!$Resource.pajinate}" />
	<script type="text/javascript">
                        
    var printEmailState = "Print";
                        
    function confirmCancel()
    {
    	if(confirm('Are you sure you want to Cancel?'))
        	cancel();
    }

 	function togglePrintEmailState() 
    {      	
 		var ele=document.getElementById('emailOptions');
		printEmailState = $("input[@name=radioOption]:checked").val();

    	if (printEmailState == "Email")
    	{
      		ele.style.display="block";
    	}	
    	else
    	{
      		ele.style.display="none";
    	}
    }
    	 
    function open_or_email()
    {	   		
    	if ($("input[@radioOption]:checked").val() == "Email")
    	{
    		submitAction;
    	}
    	else if ($("input[@radioOption]:checked").val() == "Print")
    	{
    		window.open("{!PDF_URL}");	
    	}		
	}
	</script>

	<apex:pagemessages id="pMsg" rendered="{!EmailError || hasError}" />
	<apex:form id="form1" rendered="{!NOT(hasError)}">
		<apex:actionFunction name="submitAction" action="{!submitAction}" rerender=""/>
		<apex:pageblock >
			<apex:outputPanel >
				<center>
					<apex:outputText value="Payer Next Step Document"
						style="text-align:center;font-size:16pt;color:#236FBD;font-style:normal;font-weight:bold;" />
					<br />
				</center>
				<apex:pageblockSection title="Payer Summary" columns="1"
					collapsible="true">
					<apex:pageBlockTable id="PayerTable" value="{!PayerList}"
						var="payer">
						<apex:column headerValue="{!$ObjectType.Payer__c.fields.Name.label}">
							<apex:outputField value="{!payer.Payer__r.Name}" />
						</apex:column>
						<apex:column headerValue="{!$ObjectType.Account_Payer__c.fields.Payer_ID__c.label}">
							<apex:outputField value="{!payer.Payer_ID__c}" />
						</apex:column>
						<apex:column headerValue="{!$ObjectType.Payer__c.fields.NPD_ID__c.label}">
							<apex:outputField value="{!payer.Payer__r.NPD_ID__c}" />
						</apex:column>
						<apex:column headerValue="{!$ObjectType.Account_Payer__c.fields.Service__c.label}">
							<apex:outputField value="{!payer.Service__c}" />
						</apex:column>
					</apex:pageBlockTable>
				</apex:pageblockSection>

				<apex:pageBlockSection >
					<apex:pageBlockSectionItem >

					</apex:pageBlockSectionItem>

					<!-- empty selectItem-->
					<apex:pageBlockSectionItem />
				</apex:pageBlockSection>

				<div style="text-align: center">
					Print: <input type="radio" value="Print" name="radioOption" id="radioOption" onclick="togglePrintEmailState();" />
					&nbsp;&nbsp;
					Email: <input type="radio" value="Email" name="radioOption" id="radioOption" onclick="togglePrintEmailState();" />
					<!-- 
				<apex:selectRadio id="radioOption" value="{!selectedValue}" onclick="togglePrintEmailState(this.value);">
            		<apex:selectOptions id="PoE" value="{!PrintorEmail}"/>
            	</apex:selectRadio><p/>
            	-->
				</div>

				<apex:pageBlockSection >
					<apex:pageBlockSectionItem >

					</apex:pageBlockSectionItem>

					<!-- empty selectItem-->
					<apex:pageBlockSectionItem />
				</apex:pageBlockSection>

				<div id="emailOptions" style="text-align:center;display:none;">
					<apex:outputText value="Enter e-mail below." id="theEmailDes" />
					<apex:inputText value="{!Email_Input}" id="theEmailInput" />
				</div>

				<apex:pageBlockSection >
					<apex:pageBlockSectionItem >

					</apex:pageBlockSectionItem>

					<!-- empty selectItem-->
					<apex:pageBlockSectionItem />
				</apex:pageBlockSection>
				
				<center>
					<apex:commandButton action="{!submitAction}" value="Submit"
						onclick="open_or_email();"/>
					
					<apex:commandButton action="{!cancel}" value="Cancel"
						onclick="return confirmCancel()" immediate="true" />
				</center>

			</apex:outputPanel>
		</apex:pageblock>
	</apex:form>
</apex:page>

 

 

Also I can't see the example on your post.