Apex Code Development You need to sign in to do that
Don't have an account?
Akshu I need help to save upadted record of vf page using custom controller with javascript function
**************************controller*********************
public class SignDemo{
public static String Lastname {get;set;}
public static Blob sign {get;set;}
public static String Firstname {get;set;}
public static String MailingStreet {get;set;}
public static String Email {get;set;}
public static Integer Phone {get;set;}
public static String recordId {get;set;}
public static String mode {get;set;}
public static String signUrl {get;set;}
public static Contact contact {get;set;}
public SignDemo() {
recordId = apexpages.currentpage().getparameters().get('id');
if(recordId != null){
contact = [Select id,LastName,FirstName,MailingCity,Account.Name,MailingStreet,MailingState,MailingPostalCode,Phone,Email
FROM Contact where id =:recordId];
}
mode = apexpages.currentpage().getparameters().get('mode');
system.debug('mode'+mode);
if(mode=='view'){
List<Attachment> myAtt = [Select id,name from Attachment where ParentId =:recordId and name = 'Sign.png' limit 1];
system.debug('myAtt '+myAtt );
signUrl = '/servlet/servlet.FileDownload?file='+myAtt[0].id;
}
}
public PageReference UpdateRecord1(){
try{
System.debug('@@@@UpdateRecord');
update contact;
}catch(Exception e){
System.debug('@@@@'+e.getMessage());
}
return null;
}
public static PageReference saveRecord(){
SignDemo.GenerateImage(Apexpages.currentPage().getParameters().get('base64File'),Apexpages.currentPage().getParameters().get('fileName'));
PageReference errorPage = new PageReference('/apex/SignDemo?id='+Apexpages.currentPage().getParameters().get('fileName')+'&mode=view');
errorPage.setRedirect(true);
return errorPage;
//return null;
}
//Create attachment and return id of the attachment.
public static void GenerateImage(string dataurl,String recID){
system.debug('@@GenerateImage');
List<Attachment> myAtt = [Select name from Attachment where ParentId =:recID and name = 'Sign.png' limit 1];
if(myAtt.size()>0){
Delete myAtt;
}
Attachment myAttach = new Attachment();
myAttach.name = 'Sign.png';
myAttach.ParentId =recID ; //Add ID of the parent object for the attachment (Account,Contact,etc..)
myAttach.body = ((Blob) EncodingUtil.base64Decode(dataurl.split(',')[1]));
insert myAttach;
}
}
public class SignDemo{
public static String Lastname {get;set;}
public static Blob sign {get;set;}
public static String Firstname {get;set;}
public static String MailingStreet {get;set;}
public static String Email {get;set;}
public static Integer Phone {get;set;}
public static String recordId {get;set;}
public static String mode {get;set;}
public static String signUrl {get;set;}
public static Contact contact {get;set;}
public SignDemo() {
recordId = apexpages.currentpage().getparameters().get('id');
if(recordId != null){
contact = [Select id,LastName,FirstName,MailingCity,Account.Name,MailingStreet,MailingState,MailingPostalCode,Phone,Email
FROM Contact where id =:recordId];
}
mode = apexpages.currentpage().getparameters().get('mode');
system.debug('mode'+mode);
if(mode=='view'){
List<Attachment> myAtt = [Select id,name from Attachment where ParentId =:recordId and name = 'Sign.png' limit 1];
system.debug('myAtt '+myAtt );
signUrl = '/servlet/servlet.FileDownload?file='+myAtt[0].id;
}
}
public PageReference UpdateRecord1(){
try{
System.debug('@@@@UpdateRecord');
update contact;
}catch(Exception e){
System.debug('@@@@'+e.getMessage());
}
return null;
}
public static PageReference saveRecord(){
SignDemo.GenerateImage(Apexpages.currentPage().getParameters().get('base64File'),Apexpages.currentPage().getParameters().get('fileName'));
PageReference errorPage = new PageReference('/apex/SignDemo?id='+Apexpages.currentPage().getParameters().get('fileName')+'&mode=view');
errorPage.setRedirect(true);
return errorPage;
//return null;
}
//Create attachment and return id of the attachment.
public static void GenerateImage(string dataurl,String recID){
system.debug('@@GenerateImage');
List<Attachment> myAtt = [Select name from Attachment where ParentId =:recID and name = 'Sign.png' limit 1];
if(myAtt.size()>0){
Delete myAtt;
}
Attachment myAttach = new Attachment();
myAttach.name = 'Sign.png';
myAttach.ParentId =recID ; //Add ID of the parent object for the attachment (Account,Contact,etc..)
myAttach.body = ((Blob) EncodingUtil.base64Decode(dataurl.split(',')[1]));
insert myAttach;
}
}
**********************vf page*****************
<apex:page controller="SignDemo" docType="html-5.0" showheader="false" sidebar="false" standardStylesheets="true">
<script src="https://github.com/soulwire/sketch.js/blob/master/js/sketch.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/mobomo/sketch.js/master/lib/sketch.min.js"></script>
<apex:form >
<html>
<head>
<style>
.form {
outline: none;
min-width:4px;
}
@page { size: A4 landscape; }
p.dotted {
border-style: dotted;
}
p.dashed {
border-style: dashed;
}
p.solid {
border-style: solid;
}
p.double {
border-style: double;
}
p.groove {
border-style: groove;
}
p.ridge {
border-style: ridge;
}
p.inset {
border-style: inset;
}
p.outset {
border-style: outset;
}
p.none {
border-style: none;
}
p.hidden {
border-style: hidden;
}
p.mix {
border-style: dotted dashed solid double;
}
.boxcss {
width: 220px;
padding: 10px;
border: 1px solid gray;
margin: 0;
}
p {
text-indent: 50px;
}
input {
border: 0;
outline: 0;
background: transparent;
border-bottom: 1px solid black;
}
.inputpick{
border: 0;
outline: 0;
background: transparent;
border-bottom: 1px solid black;
}
th {
text-align: center;
font-weight: bold;white-space: normal;font-weight: bold;
border: 1px solid black;
border-collapse: collapse;
body{
font-family: Tahoma, Verdana, Segoe, sans-serif;
font-weight: normal;
}
.logo {
float: left;
}
.header {
margin-top: 15px;
font-size: 16px;
text-align: center;
font-weight: bold;
}
.Sub-header-top{
font-size: 13px;
text-align: center;
font-weight: bold;
}
.content{
font-size:14px;
}
li{
margin-top:5px;
margin-bottom:5px;
}
.weight{
font-weight: bold;
}
}
</style>
</head>
<body>
<div style="width:70%; margin-top: 50px; margin-bottom:50px; margin-right: 80px; margin-left: 80px;">
<div class="container">
<ol type="1">
<li style="text-indent: 10px;">Trustee’s last name: <input type="text" id="LastName" class="form" placeholder="lname" value="{!contact.LastName}" onkeypress="this.style.width = ((this.value.length + 1) * 8) + 'px';"/> Trustee’s first name:<input type="text" id="FirstName" placeholder="fname" value="{!contact.FirstName}"/></li><br/>
<li style="text-indent: 10px;">Position on board (i.e., chair, treasurer, committee chair, member, etc.):------------------------------</li><br/>
<li style="text-indent: 10px;">Name of charter school(s):<apex:inputField value="{!contact.Account.Name}"/></li><br/>
<li style="text-indent: 10px;">Address of charter school(s):___________________________________________________________
____________________________________________________________ </li><br/>
<li style="text-indent: 10px;">Trustee’s Business Address:
<br/> Street :<input type="text" id="MailingStreet" placeholder="fname" value="{!contact.MailingStreet}"/>
<br/> City:<input value="{!contact.MailingCity}"/> State:<input value="{!contact.MailingState}"/> Zipcode:<input value="{!contact.MailingPostalCode}"/> </li><br/>
<li style="text-indent: 10px;"> Business phone:<input type="text" id="phone" placeholder="fname" value="{!contact.Phone}"/> Business Email:<input type="text" id="email" name="fname" value="{!contact.Email}"/></li><br/>
<li style="text-indent: 10px;">Is Trustee an employee of any charter school listed in response to Question 3?
<br/> ---------------------------------<br/>
<br/> If the answer is yes, please identify the charter school that employs the Trustee: ____________________________________________________________
</li><br/>
<li style="text-indent: 10px;"> Did you and/or an immediate family member have a financial interest in any charter school located in the Commonwealth of Massachusetts during the previous calendar year?<br/>
<br/> -----------------------------------------------<br/>
<br/>If the answer is yes, identify each such charter school below.
</li><br/>
</ol>
<table style="width:100% " >
<tr>
<td>
<apex:outputPanel rendered="{!mode == 'view'}">
<apex:image id="theImage" value="{!signUrl}" width="100" height="100"/>
</apex:outputPanel>
<apex:outputPanel rendered="{!mode == 'edit'}">
<canvas id="Sign" onclick="save()" style="border:2px solid; border-radius:10px 10px 10px 10px;height: 150px;width: 300px;background:white; border-color:lightgray" ></canvas>
<input type="button" value="Clear" onclick="clearSketch()" />
</apex:outputPanel>
</td>
<td><apex:outputText value="{0,date,MM/dd/yy}">
<apex:param value="{!today()}" />
</apex:outputText></td>
</tr>
<tr>
<td> Signature</td>
<td>Date</td>
</tr>
</table> <br/>
<div>Please retain a copy for your record</div><br/><br/>
<apex:outputPanel id="resultPanel" rendered="{!mode == 'view'}">
<apex:commandButton value="Download"/>
</apex:outputPanel>
<apex:outputPanel rendered="{!mode == 'edit'}">
<apex:commandButton onclick="save()" value="Save"/>
</apex:outputPanel>
<apex:actionFunction name="searchServer" action="{!saveRecord}" reRender="resultPanel">
<apex:param name="base64File" value="" />
<apex:param name="fileName" value="" />
<apex:param name="Firstname" assignTo="{!Firstname}" value="" />
<!--<apex:param name="" assignTo="{!}" value="" />
<apex:param name="" assignTo="{!}" value="" />
<apex:param name="" assignTo="{!}" value="" />
<apex:param name="" assignTo="{!}" value="" />
<apex:param name="" assignTo="{!}" value="" /> -->
</apex:actionFunction>
<script>
// $('id').css('width',((input.getAttribute('placeholder').length + 1) * 8) + 'px');
$(window).on('load', function () {
var mode = '{!mode}';
if(mode =='edit'){
clearSketch();
$('#Sign').sketch(); // associating sketch function with canvas.
}
});
// clear canvas on clear button.
function clearSketch(){
$('#Sign').replaceWith('<canvas id="Sign" style="border:2px solid; border-radius:10px 10px 10px 10px;height: 150px;width: 300px;background:white; border-color:lightgray"></canvas>');
$('#Sign').sketch();
}
function save(){
// Get Data URL from the canvas i.e. signed by the user.
var dataUrl = document.getElementById('Sign').toDataURL();
console.log("response",dataUrl);
var FName = document.getElementById('FirstName').value;
console.log("response",FName);
alert(FName);
var LName = document.getElementById('LastName').value;
console.log("response",LName);
var eEmail = document.getElementById('email').value;
console.log("response",eEmail);
var pPhone = document.getElementById('phone').value;
console.log("response",pPhone);
// use Remote Action function to generate image.
var recordid = '{!recordId}';
alert(recordid);
// action funcation with parameter
searchServer(dataUrl,recordid);
//searchServer(dataUrl,recordid);
}
</script>
</div>
</div>
</body>
</html>
</apex:form>
</apex:page>
What error you are facing here ?