-
How to take List of Account into a JavaScript variable on a Salesforce Visualforce page?
I want to take Account billing address in a JavaScript array variable, how to do it?
-
4 Replies
-
Hello Shariq,
JavaScript variable in Visualforce page
A simple example :
Visualforce :
<apex:page controller=”javascriptLearning”>
<script>
alert(‘{!lstAssignToArray}’);
var myList = new Array();
myList = ‘{!lstAssignToArray}’;
alert(myList);
</script>
</apex:page>Apex Controller:
public with sharing class javascriptLearning {
public List<String> lstAssignToArray {get;set;}public javascriptLearning()
{
lstAssignToArray = new List<String>();
lstAssignToArray.add(‘ABC’);
lstAssignToArray.add(‘DEF’);
lstAssignToArray.add(‘GHI’);
lstAssignToArray.add(‘JKL’);
lstAssignToArray.add(‘MNO’);
lstAssignToArray.add(‘PQR’);
lstAssignToArray.add(‘STU’);
lstAssignToArray.add(‘VWX’);
lstAssignToArray.add(‘YZ’);
}
}This works for me and in my alerts, I see that array has those values from the list!
- [adinserter block='9']
-
Hi Radhakrishna,
Can you do this for Account List, Please give the example.
-
You can take list of Account by using @RemoteAction:
Apex Class
public class AccountRemoteActionController {
public String accountName { get; set; }
public static List<Account> accounts { get; set; }public AccountRemoteActionController(){}
@RemoteAction
global static List<Account> getAccount(String accountName){
String updatedAccName = ‘%’+accountName+’%’;
accounts = [select id, name, phone, type, numberofemployees from Account where name LIKE :updatedAccName];
System.debug(‘Account Size : ‘+accounts.size());
return accounts;
}
}VF Page
<apex:page controller=”AccountRemoteActionController”>
<script>
function getAccountJS(){
var accountNameJS = document.getElementById(‘accName’).value;
AccountRemoteActionController.getAccount(accountNameJS,
function(result, event){
if(event.status){
for(var i=0; i < result.length; i++){
document.getElementById(“{!$Component.theBlock.thePageBlockSection.theFirstItem.accId}”).innerHTML = result[i].Id;
document.getElementById(“{!$Component.theBlock.thePageBlockSection.theSecondItem.accNam}”).innerHTML = result[i].Name;
document.getElementById(“{!$Component.theBlock.thePageBlockSection.theThirdItem.accPhone}”).innerHTML = result[i].Phone;
}
}else if(event.type === ‘exception’){
document.getElementById(“errors-js”).innerHTML = event.message;
}else{
document.getElementById(“errors-js”).innerHTML = ‘No Records Found..’;
}
},{escape : true});
}
</script>
Account Name : <input id=”accName” type=”text” />
<button onclick=”getAccountJS()”>Get Account</button>
<div id=”errors-js”></div><apex:pageBlock id=”theBLock”>
<apex:pageBlockSection id=”thePageBlockSection” columns=”4″>
<apex:pageBlockSectionItem id=”theFirstItem”>
<apex:outputText id=”accId”/>
</apex:pageBlockSectionItem>
<apex:pageBlockSectionItem id=”theSecondItem” >
<apex:outputText id=”accNam” />
</apex:pageBlockSectionItem>
<apex:pageBlockSectionItem id=”theThirdItem” >
<apex:outputText id=”accPhone” />
</apex:pageBlockSectionItem>
</apex:pageBlockSection>
</apex:pageBlock>
</apex:page>Hope this will help you .
Thanks
-
I found this interesting topic today. Using remote action will open a different thread. I believe, The following approach will help –
In your javascript code parse the get set variable in the following way-
var accListTemp='{!accountList}'; var accList = JSON.parse(accListTemp);Here in accList you will get a list of objects in javascript. You will get a JSON parsing error if you use the get set variable as a list of sobject. It will be better if you return a JSON from apex code and parse in Javascript.
public list<Account> getaccountList {get;set;} public String accountList {get;set;} public getaccountList(){ getaccountList = [Select Id, Name from Account]; accountList = JSON.serialize(getaccountList); }Thanks.
Log In to reply.
