レコードの作成
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
このコンポーネントは、force:recordData の recordId 属性を設定しません。Lightning データサービスに、レコードの新規作成が見込まれることを伝達します。以下は、コンポーネントの init ハンドラにこのレコードが作成されています。
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 <!-- Display the new contact form -->
16 <div class="Create Contact">
17 <lightning:card iconName="action:new_contact" title="Create Contact">
18 <div class="slds-p-horizontal--small">
19 <lightning:input aura:id="contactField" label="First Name" value="{!v.simpleNewContact.FirstName}"/>
20 <lightning:input aura:id="contactField" label="Last Name" value="{!v.simpleNewContact.LastName}"/>
21 <lightning:input aura:id="contactField" label="Title" value="{!v.simpleNewContact.Title}"/>
22 <br/>
23 <lightning:button label="Save Contact" variant="brand" onclick="{!c.handleSaveContact}"/>
24 </div>
25 </lightning:card>
26 </div>
27
28 <!-- Display Lightning Data Service errors -->
29 <aura:if isTrue="{!not(empty(v.newContactError))}">
30 <div class="recordError">
31 {!v.newContactError}</div>
32 </aura:if>
33
34</aura:component>
ldsCreateController.js
doInit init ハンドラが、force:recordData コンポーネントの getNewRecord() をコールして、簡単なコールバックハンドラを渡します。このコールによって、コンポーネントのマークアップで取引先責任者フォームが使用する新しい空の取引先責任者レコードが作成されます。
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 ハンドラがコールされます。これは、「レコードの保存」 に記載のとおり、取引先責任者を保存して、ユーザインターフェースを更新する単純明快なアプリケーションです。