🐴
Apex,Salesforce:apex:commandButtonの後にJavascriptを実行したい
概要
ボタン押した後にJSを使って色々やりたい。
ページリロードさせたいとか、そんなときに役立つ。
解説
解説と言ってもひとことで終わるんだけど…w
<apex:commandButton action="{!save}" Value="保存" oncomplete="pageReload();"/>
oncomplete を設定すればJSのFunctionが呼べる。
サンプルのソースは以下の流れ。
- 保存ボタンをクリックしたらApexの PageReference save を呼び出してレコードを保存する
- Visualforceページに記載したJS pageReload()を呼ぶ。
- pageReload()がページをリロードする
ソースコード:Apex
public class CustomControllerTest {
public Id accountId; //親取引先のID
public List<Contact> con {get;set;} //対象の取引先責任者リスト
public Account account {get;set;}
//コンストラクタ
public CustomControllerTest(ApexPages.StandardSetController controller) {
accountId = ApexPages.currentPage().getParameters().get('id');
con = [Select id, Name,firstName,LastName from Contact where accountId = :accountId ];
account = [Select id , Name from Account where id = :accountId Limit 1];
}
//保存処理
public PageReference save() {
upsert account;
upsert con;
String prevURL = '/' + accountId;
PageReference pageRef = new PageReference(prevURL);
return null;
}
public PageReference fullsave() {
String parameter = System.currentPageReference().getParameters().get('parameter');
upsert account;
upsert con;
String prevURL = '/' + accountId;
PageReference pageRef = new PageReference(prevURL);
return null;
}
}
ソースコード:Visualforce
<apex:page standardController="Account" recordSetVar="Lists" extensions="CustomControllerTest">
<apex:form >
<apex:pageBlock title="取引先編集画面">
<table>
<thead>
<th>id</th>
<th>Name</th>
</thead>
<apex:repeat value="{!account}" var="hoge">
<tr>
<td>
<apex:inputField value="{!hoge.Id}" /> </td>
<td>
<apex:inputField value="{!hoge.Name}" /> </td>
</tr>
</apex:repeat>
</table>
<apex:commandButton action="{!save}" Value="保存" oncomplete="pageReload();"/>
<apex:commandButton action="{!cancel}" Value="キャンセル" /> </apex:pageBlock>
<apex:pageBlock title="取引先責任者編集画面">
<table>
<thead>
<th>id</th>
<th>FirstName</th>
<th>LastName</th>
</thead>
<apex:repeat value="{!con}" var="fuga">
<tr>
<td>
<apex:inputField value="{!fuga.Id}" /> </td>
<td>
<apex:inputField value="{!fuga.FirstName}" /> </td>
<td>
<apex:inputField value="{!fuga.LastName}" /> </td>
</tr>
</apex:repeat>
</table>
<apex:commandButton action="{!save}" Value="保存" />
<apex:commandButton action="{!cancel}" Value="キャンセル" /> </apex:pageBlock>
</apex:form>
<script>
function pageReload(){
location.reload();
}
</script>
</apex:page>
Discussion