Lightning コンポーネント開発者ガイド
jレコードの作成
Lightning データサービスを使用してレコードを作成する場合は、recordId を割り当てずに、force:recordData を宣言します。次に、force:recordData の getNewRecord 関数をコールして、レコードテンプレートを読み込みます。最後に、新しいレコードに値を適用し、force:recordData の saveRecord 関数をコールしてレコードを保存します。
- getNewRecord をコールして、レコードテンプレートから空のレコードを作成します。このレコードは、フォームのバッキングストアとして使用できます。あるいは、その値を保存用のデータに設定することもできます。
- saveRecord をコールして、レコードを確定させます。この点は、「レコードの保存」に記載されています。
レコードテンプレートから空のレコードの作成
レコードテンプレートから空のレコードを作成する場合、force:recordData タグに recordId は設定できません。recordId がなければ、Lightning データサービスが既存のレコードを読み込むことがありません。
コンポーネントの init または別のハンドラで、force:recordData の getNewRecord をコールします。getNewRecord は次の引数を取ります。
| 属性名 | 型 | 説明 |
|---|---|---|
| objectApiName | String | 新しいレコードのオブジェクト API 参照名。 |
| recordTypeId | String | 新しいレコードのレコードタイプの 18 文字の ID。 指定されていない場合は、ユーザのプロファイルで定義したオブジェクトのデフォルトのレコードタイプが使用されます。 |
| skipCache | Boolean | レコードテンプレートを、クライアント側の Lightning データサービスキャッシュではなく、サーバから読み込むかどうか。デフォルトは false です。 |
| callback | Function | 空のレコードの作成後に呼び出される関数。この関数は引数を受け取りません。 |
getNewRecord は結果を返しません。空のレコードを準備して、targetRecord 属性に割り当てるだけです。
レコードの作成
次の例は、Lightning データサービスを使用したレコードの作成の要点を示しています。この例は、取引先レコードの Lightning ページに追加されることを意図しています。
ldsCreate.cmp
1<aura:component implements="flexipage:availableForRecordHome, force:hasRecordId">
2
3 <aura:attribute name="newContact" type="Object"/>
4 <aura:attribute name="simpleNewContact" type="Object"/>
5 <aura:attribute name="newContactError" type="String"/>
6
7 <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
8
9 <force:recordData aura:id="contactRecordCreator"
10 layoutType="FULL"
11 targetRecord="{!v.newContact}"
12 targetFields="{!v.simpleNewContact}"
13 targetError="{!v.newContactError}" />
14
15 <div class="slds-page-header" role="banner">
16 <p class="slds-text-heading--label">Create Contact</p>
17 </div>
18
19 <!-- Display Lightning Data Service errors -->
20 <aura:if isTrue="{!not(empty(v.newContactError))}">
21 <div class="recordError">
22 <ui:message title="Error" severity="error" closable="true">
23 {!v.newContactError}
24 </ui:message>
25 </div>
26 </aura:if>
27
28 <!-- Display the new contact form -->
29 <div class="slds-form--stacked">
30 <lightning:input aura:id="contactField" name="firstName" label="First Name"
31 value="{!v.simpleNewContact.FirstName}" required="true"/>
32
33 <lightning:input aura:id="contactField" name="lastname" label="Last Name"
34 value="{!v.simpleNewContact.LastName}" required="true"/>
35
36 <lightning:input aura:id="contactField" name="title" label="Title"
37 value="{!v.simpleNewContact.Title}" />
38
39 <lightning:button label="Save contact" onclick="{!c.handleSaveContact}"
40 variant="brand" class="slds-m-top--medium"/>
41 </div>
42
43</aura:component>
ldsCreateController.js
1({
2 doInit: function(component, event, helper) {
3 // Prepare a new record from template
4 component.find("contactRecordCreator").getNewRecord(
5 "Contact", // sObject type (objectApiName)
6 null, // recordTypeId
7 false, // skip cache?
8 $A.getCallback(function() {
9 var rec = component.get("v.newContact");
10 var error = component.get("v.newContactError");
11 if(error || (rec === null)) {
12 console.log("Error initializing record template: " + error);
13 return;
14 }
15 console.log("Record template initialized: " + rec.sobjectType);
16 })
17 );
18 },
19
20 handleSaveContact: function(component, event, helper) {
21 if(helper.validateContactForm(component)) {
22 component.set("v.simpleNewContact.AccountId", component.get("v.recordId"));
23 component.find("contactRecordCreator").saveRecord(function(saveResult) {
24 if (saveResult.state === "SUCCESS" || saveResult.state === "DRAFT") {
25 // record is saved successfully
26 var resultsToast = $A.get("e.force:showToast");
27 resultsToast.setParams({
28 "title": "Saved",
29 "message": "The record was saved."
30 });
31 resultsToast.fire();
32
33 } else if (saveResult.state === "INCOMPLETE") {
34 // handle the incomplete state
35 console.log("User is offline, device doesn't support drafts.");
36 } else if (saveResult.state === "ERROR") {
37 // handle the error state
38 console.log('Problem saving contact, error: ' + JSON.stringify(saveResult.error));
39 } else {
40 console.log('Unknown problem, state: ' + saveResult.state + ', error: ' + JSON.stringify(saveResult.error));
41 }
42 });
43 }
44 }
45})[取引先責任者を保存] ボタンがクリックされると、handleSaveContact ハンドラがコールされます。これは、「レコードの保存」 に記載のとおり、取引先責任者を保存して、ユーザインターフェースを更新する単純明快なアプリケーションです。