Navigation Menu

Skip to content

Instantly share code, notes, and snippets.

@tyoshikawa1106

tyoshikawa1106/01_ JSRemotingFileUpload.page

Created January 25, 2016 18:25
Show Gist options
  • Star 3 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save tyoshikawa1106/6ba50544a8d4cbcd48de to your computer and use it in GitHub Desktop.
Save tyoshikawa1106/6ba50544a8d4cbcd48de to your computer and use it in GitHub Desktop.
Download ZIP
Raw
01_ JSRemotingFileUpload.page
<apex:page standardController="Account" extensions="JSRemotingFileUploadController" sidebar="false" id="page">
<head>
<apex:includeScript value="https://code.jquery.com/jquery-2.1.4.min.js" />
<apex:includeScript value="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular.min.js" />
<apex:includeScript value="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular-animate.min.js" />
<apex:includeScript value="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js" />
</head>
<body>
<div id="vf-page">
<apex:form id="form">
<div ng-app="myApp">
<div ng-controller="mainCtrl">
<apex:pageBlock mode="edit" id="block">
<!-- pageMessages -->
<apex:pageMessages id="msg" />
<!-- Message Box -->
<c:AngularAccountMessage />
<apex:pageBlockButtons location="bottom" id="buttons">
<apex:commandButton value=" Save " html-ng-click="doSave($event)" />
<apex:commandButton value=" Cancel " action="{!Cancel}" reRender="form" />
</apex:pageBlockButtons>
<apex:pageBlockSection title="Info" id="section">
<apex:inputField value="{!Account.Name}" id="accName" />
<apex:inputField value="{!Account.AccountNumber}" id="accNumber" />
</apex:pageBlockSection>
<apex:pageBlockSection columns="1" collapsible="false" title="添付ファイル">
<apex:pageBlockSectionItem >
<apex:outputLabel value="ファイル" />
<input type="file" name="attamentFile" id="attamentFile" />
</apex:pageBlockSectionItem>
</apex:pageBlockSection>
</apex:pageBlock>
</div>
</div>
</apex:form>
</div>
<apex:include pageName="JSRemotingFileUploadScript" />
</body>
</apex:page>
Raw
02_JSRemotingFileUploadScript.page
<apex:page >
<script type="text/javascript">
(function($j){
// フォーカスクリア
beenFocused = true;
// AngularJS
var myApp = angular.module('myApp', ['ngAnimate']);
myApp.controller('mainCtrl', ['$scope', '$sce', function($scope, $sce) {
// 保存ボタン処理
$scope.doSave = function(event) {
event.preventDefault();
var uploadFile = document.getElementById('attamentFile');
var file = uploadFile.files[0];
if (!file) {
alert('ファイルを選択してください。');
return false;
}
if (!file.type.match(/(image.*)/)) {
alert('Imageファイルを選択してください。');
return false;
}
var reader = new FileReader();
reader.onloadend = function() {
var dataURL = reader.result;
console.log(dataURL);
// 取引先情報を取得
var apexWrapper = {
account : helper.getAccountObject(),
fileName : file.name,
fileSize : file.size,
uploadFile : dataURL.match(/,(.*)$/)[1]
};
// 保存処理を実行
doSaveByApex(apexWrapper);
};
reader.readAsDataURL(file);
};
// 必須項目の未入力判定
$scope.isRequiredFieldInput = function(target) {
if (target) {
return true;
}
return false;
}
// 保存ボタンの処理
function doSaveByApex(apexWrapper) {
$scope.errorMessages = [];
// RemoteAction
JSRemotingFileUploadController.doSave(apexWrapper, function(result, event){
if(event.status) {
if (result.errorMessages.length > 0) {
// エラーメッセージを表示
$scope.errorMessages = result.errorMessages;
} else {
// 登録成功後に詳細ページに繊維
location.href = '/' + result.accountId;
}
} else {
alert(event.message);
}
$scope.$apply();
return false;
});
}
}]).filter('unsafe', function($sce) { return $sce.trustAsHtml; });
// Helper
helper = {
// 取引先オブジェクトを取得
getAccountObject: function() {
var accountName = document.getElementById('{!$Component.form.block.section.accName}').value;
var accountNumber = document.getElementById('{!$Component.form.block.section.accNumber}').value;
return {
Name: accountName,
AccountNumber: accountNumber
};
}
};
})(jQuery);
</script>
</apex:page>
Raw
03_ JSRemotingFileUploadController.cls
public with sharing class JSRemotingFileUploadController {
private static JSRemotingFileUploadHelper helper = new JSRemotingFileUploadHelper();
/**
* コンストラクタ
*/
public JSRemotingFileUploadController(ApexPages.StandardController stdController) {
}
/**
* 保存ボタン処理
*/
@RemoteAction
public static JSRemotingFileUploadResult doSave(JSRemotingFileUploadWrapper wrapper) {
Savepoint sp = Database.setSavepoint();
JSRemotingFileUploadResult result = new JSRemotingFileUploadResult();
try {
// 取引先情報取得
Account account = wrapper.account;
if (String.isEmpty(account.Name)) {
result.errorMessages.add('取引先名が未入力です。');
Database.rollback(sp);
return result;
}
// 取引先登録
insert account;
// 添付ファイル登録
Attachment attacment = helper.getAttachment(wrapper.fileName, wrapper.uploadFile, account.Id);
insert attacment;
// 登録IDセット
result.accountId = account.Id;
} catch(DmlException e) {
Database.rollback(sp);
result.errorMessages.add(e.getDmlMessage(0));
return result;
} catch(Exception e) {
Database.rollback(sp);
result.errorMessages.add(e.getMessage());
return result;
}
return result;
}
}
Raw
04_ JSRemotingFileUploadHelper.cls
public with sharing class JSRemotingFileUploadHelper {
/**
* コンストラクタ
*/
public JSRemotingFileUploadHelper() {
}
/**
* ファイル選択チェック
*/
public Boolean checkIsSelectFileError(Blob uploadFile) {
if(uploadFile == null){
return true;
}
return false;
}
/**
* ファイルサイズチェック
*/
public Boolean checkIsFileSizeError(Long fileSize) {
if(fileSize != null && fileSize > 1242880){
Decimal fileSizeView = this.converFileSizeMegaByte(fileSize);
return true;
}
return false;
}
/**
* ファイルサイズのMB変換
*/
public Decimal converFileSizeMegaByte(Long fileSize) {
Decimal result = 0;
if (fileSize != null) {
result = Decimal.valueOf(fileSize / 1048576).setScale(1);
}
return result;
}
/**
* ファイル拡張子を判定
*/
public Boolean checkFileTypeError(String fileName) {
Boolean isError = true;
if (fileName.endsWith('.xls')) {
isError = false;
} else if (fileName.endsWith('.xlsx')) {
isError = false;
} else if (fileName.endsWith('.doc')) {
isError = false;
} else if (fileName.endsWith('.docx')) {
isError = false;
} else if (fileName.endsWith('.pdf')) {
isError = false;
}
return isError;
}
/**
* 登録用の添付ファイル情報取得
*/
public Attachment getAttachment(String fileName, Blob uploadFile, Id parentId) {
if (String.isEmpty(parentId)) {
return new Attachment();
}
Attachment attachment = new Attachment(
Name = fileName
,Body = uploadFile
,ParentId = parentId
);
return attachment;
}
}
Raw
05_ JSRemotingFileUploadResult.cls
public with sharing class JSRemotingFileUploadResult {
public Id accountId {get; set;}
public List<String> errorMessages {get; set;}
/**
* コンストラクタ
*/
public JSRemotingFileUploadResult() {
this.accountId = null;
this.errorMessages = new List<String>();
}
}
Raw
06_ JSRemotingFileUploadWrapper.cls
public with sharing class JSRemotingFileUploadWrapper {
// 取引先
public Account account {get; set;}
// ファイル名
public String fileName {get;set;}
// ファイルオブジェクト
public Blob uploadFile {get;set;}
// ファイルサイズ
public Long fileSize {get; set;}
/**
* コンストラクタ
*/
public JSRemotingFileUploadWrapper() {
this.account = new Account();
this.fileName = '';
this.uploadFile = null;
this.fileSize = null;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment