This is a visualforce form for Live Agent for salesforce. It is a prechat form that does server-side input validation based on the Lead object. It creates the lead and forwards the customer on to the chat. From the operator's perspective, they get the CRM chatlet to pop to the Lead. This relies on an Auto Number indexed field called transcriptLead__c to be in the Lead record to auto query on. Also see this trigger to set the lead owner https://gist.github.com/4264616
public class SalesPreChat {
public Lead theLead {get; set;}
public Lead leadInsert {get; set;}
public String endpoint {get; set;}
public String jsSubmitForm {get; set;}
public SalesPreChat() {
jsSubmitForm = '';
theLead = new Lead();
leadInsert = new Lead();
//get the querystring data passed in by the button. This is the liveagent form action
//EX: ?endpoint=https%3A%2F%2F1.la1a1.salesforceliveagent.com... etc..
endpoint = '';
PageReference pageRef = ApexPages.currentPage();
if (pageRef.getParameters() != null) {
if (pageRef.getParameters().containsKey('endpoint')) {
if (pageRef.getParameters().get('endpoint') != null) {
endpoint = pageRef.getParameters().get('endpoint');
}
}
}
}
public pagereference clickChat() {
PageReference pr = null;
theLead.Company = 'Enter Company';
theLead.Industry = 'Other';
theLead.LeadSource = 'Corporate Website, Live Chat';
insert theLead;
update theLead;
//requery the lead to get the autonumber var
List<Lead> leadList = new List<Lead>();
leadList = [SELECT
Id,
FirstName,
LastName,
Email,
LeadSource,
Company,
Industry,
transcriptLead__c
FROM Lead WHERE Id=:theLead.Id];
if (!leadList.isEmpty()) {
leadInsert = leadList[0];
}
jsSubmitForm = 'jQuery(\'#prechatForm\').submit();';
return pr;
}
static testMethod void doTest() {
String testEndpoint = 'https%3A%2F%2F1.la1a1.salesforceliveagent.com';
PageReference pg = Page.SalesChatPreChatSafari;
Test.setCurrentPage(pg);
ApexPages.currentPage().getParameters().put('endpoint', testEndpoint);
SalesPreChat spc = new SalesPreChat();
spc.theLead.FirstName = 'John';
spc.theLead.LastName = 'Smith';
spc.theLead.Email = 'johnsmith@test.com';
spc.clickChat();
}
}
<apex:page showHeader="false" cache="false" expires="0" standardstylesheets="false" controller="SalesPreChat" id="page">
<head>
<apex:includeScript value="{!URLFOR($Resource.jqueryValidation, 'lib/jquery-1.7.2.js')}"/>
<apex:includeScript value="{!URLFOR($Resource.placeholderJS, '/jQuery-html5-placeholder-master/html5placeholder.jquery.js')}"/>
<apex:outputPanel id="prechatJS">
<script>
jQuery.noConflict();
jQuery(function(){
jQuery("#page\\:prechatFormInput\\:FirstName").attr("placeholder", "First Name");
jQuery("#page\\:prechatFormInput\\:LastName").attr("placeholder", "Last Name");
jQuery("#page\\:prechatFormInput\\:Email").attr("placeholder", "Email Address");
jQuery(":input[placeholder]").placeholder();
{!jsSubmitForm}
});
</script>
</apex:outputPanel>
<style type="text/css">
body {
text-align: left;
font-family: Helvetica, Arial, 'Sans Serif';
}
td.header {
font-size: 16px;
font-weight: bold;
}
input.sales {
border: 1px solid #898989;
padding: 0;
margin: 0;
color: #707070;
border-style: solid;
width: 189px;
font-size: 15px;
line-height: 15px;
height: 15px;
padding-top: 8px;
padding-bottom: 7px;
padding-left: 8px;
padding-right: 8px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-webkit-box-shadow: inset 1px 2px 2px 0px #dddddd;
-moz-box-shadow: inset 1px 2px 2px 0px #dddddd;
box-shadow: inset 1px 2px 2px 0px #dddddd;
}
input.error {
border: 1px solid red;
background-color: #FEF5F1;
}
div.errorMsg {
margin-left: 10px;
font-size: 70%;
color: red;
display: inline-block;
}
label {
color: #707070;
font-size: 15px;
padding-top: 8px;
padding-bottom: 7px;
padding-left: 8px;
padding-right: 8px;
}
</style>
</head>
<body>
<div style="padding: 5px;" id="padDiv">
<apex:form styleClass="prechatFormInput" id="prechatFormInput">
<apex:outputPanel rendered="{!IF(jsSubmitForm=='', 'True', 'False')}">
<table cellpadding="8">
<tr>
<td class="header">
Find out what we can do for your organization.
</td>
</tr>
<tr>
<td>
<apex:inputField id="FirstName" value="{!theLead.FirstName}" required="true" styleClass="sales" />
</td>
</tr>
<tr>
<td>
<apex:inputField id="LastName" value="{!theLead.LastName}" required="true" styleClass="sales" />
</td>
</tr>
<tr>
<td>
<apex:inputField id="Email" value="{!theLead.Email}" required="true" styleClass="sales" />
</td>
</tr>
<tr>
<td>
<apex:commandButton reRender="prechatJS,prechatFormPanel,prechatFormInput" image="{!URLFOR($Resource.SalesChatNow)}" action="{!clickChat}" value="Chat Not" alt="Chat Now" id="prechat_submit" />
</td>
</tr>
</table>
</apex:outputPanel>
</apex:form>
</div>
<apex:outputPanel id="prechatFormPanel">
<form method='post' id='prechatForm' action="{!endpoint}">
<input type="hidden" name='liveagent.prechat:FirstName' value="{!theLead.FirstName}"/>
<input type="hidden" name='liveagent.prechat:LastName' value="{!theLead.LastName}"/>
<input type="hidden" name='liveagent.prechat:Email' value="{!theLead.Email}"/>
<input type="hidden" name='liveagent.prechat:LeadId' value="{!theLead.Id}"/>
<input type="hidden" name='liveagent.prechat:transcriptLead' value="{!leadInsert.transcriptLead__c}"/>
<input type="hidden" name="liveagent.prechat.query:transcriptLead" value="Lead,Lead.transcriptLead__c" />
<input type="hidden" name="liveagent.prechat.save:FirstName" value="FirstName__c" />
<input type="hidden" name="liveagent.prechat.save:LastName" value="LastName__c" />
<input type="hidden" name="liveagent.prechat.save:Email" value="Email__c" />
<input type="hidden" name="liveagent.prechat.save:LeadId" value="Lead" />
<input type="hidden" name="liveagent.prechat.save:transcriptLead" value="transcriptLead__c" />
</form>
</apex:outputPanel>
</body>
</apex:page>