Create parent record and associated child(ren) record on the same page

ksumner

I need to create a parent record (for example, account) and one or more child records (for example, contacts) all on one page.  The page has a field editor for the parent and a table for the contacts.  I want to be able to click the save button and the parent will be created and then the contacts will be created and associated with the newly created account record.

How can I accomplish this?

Skuidward Tentacles (Raymond)

Do you have a specific number of child records? If so you should be able to use an action sequence. You would disable/remove standard save buttons. You would add either a page title component or a navigation component and use it as your "button". You would create a set of actions that first saves the parent record model, then creates new rows on your child record model (use separate models for each child and parent). The new row action allows you to populate fields on the rows being created. You can make the parent field of your new child row equal to the ID field of the parent.

ksumner

No specific number of child records.  Can be zero, one or many.

Skuidward Tentacles (Raymond)

You can't attach a child to a parent until that parent has been saved. Saving the parent creates the Salsesforce ID that is used to associate the child, so you will have to save the parent first. You could try to do everything with one button, but I think you would have better luck with a button that saves the parent record and then, once saved, allows you to create children. On your child model, you would add a condition that the parent ID is equal to the ID of the record in your parent model. Make sure your parent model is set to only have one row. Your newly created parent should become row 0 and be used as the row for your child model condition. Then, when you create a new child row, it should auto populate the parent field with the ID of the parent record.

ksumner

Thank you Raymond.  Would it be possible to use multiple actions to get the results?  

In the page title component set the button action type to "run multiple actions".  Then in the actions tabs create multiple actions to  "Save Changes in Model: Account", query the record to get the new account id, then "Save changes in model: Contact".

Skuidward Tentacles (Raymond)

I'm not sure if that will put the Account number into each of the contacts, but it is worth a try. If it doesn't work, you could try putting a model action on your child model that updates field on rows when the model is requeried. You would set it to update the parent ID. Then in your actions on your button you would save the child model, requery the child model, then save the child model again. The difference here is that the model action will effect all rows in the model simultaneously.

Bill McCullough

ksumner,

When you add your Contact model, set the AccountId field on this model to be the Id of the Account model.  Skuid assigns a temporary 'Id' number for each record created (i.e. 1, 2, 3, 4, 5...).  Your Save button needs to save both models.  Skuid handles updating the 1, 2, 3, 4, 5 with the correct Salesforce Id (in this case the AccountId will be set for each Contact)

Here is a screenshot of the condition.



Here is my sample page:

<skuidpage unsavedchangeswarning="yes" personalizationmode="server" showsidebar="true" showheader="true" tabtooverride="Account">   <models>
      <model id="Account" limit="1" query="false" createrowifnonefound="true" sobject="Account" adapter="" type="">
         <fields>
            <field id="Name"/>
            <field id="CreatedDate"/>
            <field id="Phone"/>
            <field id="ParentId"/>
            <field id="Parent.Name"/>
            <field id="Description"/>
         </fields>
         <conditions/>
         <actions/>
      </model>
      <model id="Contacts" limit="20" query="false" createrowifnonefound="false" adapter="" type="" sobject="Contact">
         <fields>
            <field id="FirstName"/>
            <field id="LastName"/>
            <field id="Phone"/>
         </fields>
         <conditions>
            <condition type="modelmerge" value="" field="AccountId" operator="=" model="Account" enclosevalueinquotes="true" mergefield="Id" novaluebehavior="noquery"/>
         </conditions>
         <actions/>
      </model>
   </models>
   <components>
      <pagetitle model="Account" uniqueid="sk-2FOd1P-76">
         <maintitle>
            <template>{{Name}}</template>
         </maintitle>
         <subtitle>
            <template>{{Model.label}}</template>
         </subtitle>
         <actions>
            <action type="multi" window="self" label="Save" icon="sk-icon-save">
               <actions>
                  <action type="save">
                     <models>
                        <model>Account</model>
                        <model>Contacts</model>
                     </models>
                  </action>
                  <action type="redirect" window="self" url="/{{$Model.Account.data.0.Id}}"/>
               </actions>
            </action>
            <action type="multi" label="Cancel" icon="sk-icon-cancel">
               <actions>
                  <action type="cancel">
                     <models>
                        <model>Account</model>
                        <model>Contacts</model>
                     </models>
                  </action>
                  <action type="redirect" window="self" url="/001"/>
               </actions>
            </action>
         </actions>
      </pagetitle>
      <basicfieldeditor showsavecancel="false" showheader="true" model="Account" mode="edit" uniqueid="sk-2FOd1P-77" buttonposition="">
         <columns>
            <column width="50%">
               <sections>
                  <section title="Basics" collapsible="no">
                     <fields>
                        <field id="Name" valuehalign="" type=""/>
                     </fields>
                  </section>
               </sections>
            </column>
            <column width="50%">
               <sections>
                  <section title="Phone" collapsible="no">
                     <fields>
                        <field id="Phone" valuehalign="" type=""/>
                     </fields>
                  </section>
               </sections>
            </column>
         </columns>
      </basicfieldeditor>
      <template multiple="false" uniqueid="sk-2FPbHS-157" allowhtml="true">
         <contents>&lt;div class="nx-basicfieldeditor-section-header"&gt;Contacts&lt;/div&gt;</contents>
      </template>
      <skootable showconditions="true" showsavecancel="false" showerrorsinline="true" searchmethod="server" searchbox="true" showexportbuttons="false" pagesize="10" createrecords="true" model="Contacts" buttonposition="" mode="read" uniqueid="sk-VB5Gs-199">
         <fields>
            <field id="FirstName" valuehalign="" type=""/>
            <field id="LastName" valuehalign="" type=""/>
            <field id="Phone"/>
         </fields>
         <rowactions>
            <action type="edit"/>
            <action type="delete"/>
         </rowactions>
         <massactions usefirstitemasdefault="true">
            <action type="massupdate"/>
            <action type="massdelete"/>
         </massactions>
         <views>
            <view type="standard"/>
         </views>
         <actions defaultlabel="Global Actions" defaulticon="sk-icon-magic" usefirstitemasdefault="true">
            <action type="createrow" appendorprepend="prepend"/>
         </actions>
      </skootable>
   </components>
   <resources>
      <labels/>
      <css/>
      <javascript/>
   </resources>
   <styles>
      <styleitem type="background" bgtype="none"/>
   </styles>
</skuidpage>

Thanks,

Bill

Skuidward Tentacles (Raymond)

I didn't know Skuid did that! Thanks, Bill!

ksumner

This is awesome!   Thank you Bill.

Rob Hatch

Here is a tutorial that explains all this:   http://help.skuid.com/m/components/l/102570-the-wizard-component-create-new-contact-wizard

The tutorial talks about a wizard,  but the same concepts can be applied in a single page. 

Anna Wiersema

Looking back at this post this morning..... I wasn't able to find the contact wizard tutorial but I did find this one for an Account Wizard, same concepts: https://docs.skuid.com/latest/v2/en/skuid/components/ink/wizard/new-record-wizard.html#id1