Here is an example describing Serializing and Deserializing a Account Object in Salesforce
- This example allows a user to select a Account and retrieve data
using JSON.
- The parseJson function executes a SOQL query to retrieve a Account
object.
- Using the JSON.serialize method the Account object is serialized to a
JSON formatted string.
- It is then passed to the Visualforce page.
- Using the JSON.parse Javascript function on the Visualforce page, we
are able to easily retrieve values and populate the respective HTML
controls.
VF Page
<apex:page docType="html-5.0" controller="AccountJSON" action="{!parseJson}"
showHeader="false" sidebar="false" standardStylesheets="false" >
<script type="text/javascript">
function parseJson() {
var sJSON = document.getElementById("inJSON").value;
var obj = JSON.parse(sJSON );
document.getElementById("idtitle").innerHTML = obj.Name;
document.getElementById("idphone").innerHTML = obj.Phone ;
document.getElementById("idfax").innerHTML = obj.Fax;
document.getElementById("idwebsite").innerHTML = obj.Website;
document.getElementById("accname").innerHTML = obj.Name ;
document.getElementById("accountnumber").innerHTML = obj.AccountNumber;
document.getElementById("annualrevenue").innerHTML = obj.AnnualRevenue;
document.getElementById("ownership").innerHTML = obj.Ownership;
document.getElementById("numberofemployees").innerHTML = obj.NumberOfEmployees;
}
</script>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="description" content=""/>
<meta name="author" content=""/>
<title>Account Details - Retrieve using JSON</title>
<!-- Bootstrap core CSS -->
<!-- Bootstrap core CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" />
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css"
rel="stylesheet" />
</head>
<body >
<apex:form >
<div class="container">
<div class="row">
<div class="col-md-9">
<h4>Select Account</h4>
<apex:selectList value="{!AccountSelected}" size="1" id="cityddlb"
styleClass="form-control" >
<apex:selectOptions value="{!AccountList}"/>
<apex:actionSupport event="onchange" reRender="strJSON" action="{!parseJson}"/>
</apex:selectList>
<button type="button" onclick="parseJson()" styleClass="btn btn-primary" >
Get Account Details</button>
</div>
</div>
</div>
<br/>
</apex:form>
<div class="container">
<div class="row" >
<div class="col-md-9">
<div class="panel panel-primary">
<div class="panel-body bg-primary">
<h2 class="panel-title" id="idtitle">Account name will be populated
here via JSON</h2><br/>
<div><small class="glyphicon glyphicon-th"></small> JSON below</div>
<apex:outputPanel id="strJSON">
<div> <input type="text" class="form-control" placeholder="Username"
id="inJSON" value="{!JSONtext}" /> </div>
</apex:outputPanel>
</div>
</div>
<div class="row">
<div class="col-md-6">
<ul class="list-group">
<li class="list-group-item list-group-item-info"><strong>Account Details
</strong></li>
<li class="list-group-item">Account Name: <span class="label label-primary"
id="accname"></span></li>
<li class="list-group-item">Account Number: <span class="label label-primary"
id="accountnumber"></span></li>
<li class="list-group-item">Annual Revenue: <span class="label label-success"
id="annualrevenue"></span></li>
<li class="list-group-item">Ownership: <span class="label label-success"
id="ownership"></span></li>
<li class="list-group-item">Number of Employees: <span class="label label-primary"
id="numberofemployees"></span></li>
</ul>
</div>
<div class="col-md-6">
<ul class="list-group">
<li class="list-group-item list-group-item-success"><strong>Important Information
</strong></li>
<li class="list-group-item"><small class="glyphicon glyphicon-phone"></small>
Phone:<span class="badge alert-info" id="idphone"> </span> </li>
<li class="list-group-item"><small class="glyphicon glyphicon-home"></small>
Fax: <span class="badge alert-info" id="idfax"></span> </li>
<li class="list-group-item"><small class="glyphicon glyphicon-file"></small>
Website: <span class="badge alert-info pull-right" id="idwebsite" ></span></li>
</ul>
</div>
</div>
</div>
</div>
</div> <!-- /container -->
<div class="container">
<footer>
</footer>
</div> <!-- /container -->
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
</apex:page>
Controller
public class AccountJSON
{
public String JSONtext {get;set;}
public Account VISacct {get;set;}
public String AccountSelected {get;set;}
public AccountJSON() { }
public void parseJson() {
String sAccName = 'Burlington Textiles Corp of America';
if (AccountSelected == null)
{
AccountSelected = sAccName ;
}
String soql = 'SELECT Name,AccountNumber,site,AccountSource, AnnualRevenue,
BillingAddress, Fax,Phone, Website, TickerSymbol, NumberofEmployees,
Ownership, SIC FROM Account WHERE name = :AccountSelected LIMIT 1';
Account acct = Database.Query(soql);
VISacct = acct ;
JSONtext = JSON.serialize(acct); }
public List<SelectOption> getAccountList() {
List<SelectOption> AllAccountNames = new List<SelectOption>();
string tempaccount;
List<Account> Accounts = [SELECT Name FROM Account];
For (Account ar : Accounts )
{
tempaccount= (string) ar.get('Name');
AllAccountNames.add(new SelectOption(tempaccount,tempaccount));
}
return AllAccountNames ; }
}
Source: - http://www.sandeeparora.org/2014/10/example-serialize-objects-into-json-strings-in-apex/
