What is the best way to have a lookup that supports creating a new record if one isn't found?

  • 8
  • Question
  • Updated 2 years ago
  • Answered
In my experience, one of the biggest annoyances for standard SF users is that when they use a lookup field to try to find a record, but don't find one, they can't create a new record right then - they have to click out of the lookup, go to another place, create a new record, then come back and use the lookup field again.

With Skuid, I know I can build a better lookup field (as a picklist or a type-ahead search), but what is the best way to allow a user to say "I didn't find one, so create a new one and put it in the lookup/search field"? I can easily put a button near the lookup field that functions as a popup in which to create the new record, but the user still has to save, close the popup, and re-search for that record again in the lookup field. Is there a simple way to put that record into the right lookup field right away on the editor I came from? Or do I have to use javascript to do this?

Better yet, I'd love to see this built-in, such as a config option on lookup fields for 'Show "Create New" option' with a pop-up field configuration. When selected, it would automatically pop up a page/editor and fill the field with the new record's ID when it is saved (and close the popup).
Photo of Peter Bender

Peter Bender, Champion

  • 6,246 Points 5k badge 2x thumb

Posted 5 years ago

  • 8
Photo of Rob Hatch

Rob Hatch, Official Rep

  • 44,006 Points 20k badge 2x thumb
Peter, this is not the first time the idea has emerged. It would be possible to create a custom renderer that added the capabilities of allowing a popup to open where a new relatedrecord was created, but also added the lookup relationship in the original location.  And you are right - once created once, it should be abstracted so that it is available by configuration for any lookup field.   We'll consider this an idea for future development.  

Any others out there that would appreciate this feature? 
Photo of Glenn Elliott

Glenn Elliott, Champion

  • 7,738 Points 5k badge 2x thumb
Yep, this would be a great standard feature. I vote infinity times.
Photo of Marshall Vaughn

Marshall Vaughn

  • 60 Points
I didn't even know you could vote that many times. Do I second this vote? Or do I infinity +1 it? [ edited because spelling ]
(Edited)
Photo of ktyler

ktyler

  • 9,244 Points 5k badge 2x thumb
This is built into other UI's. Access has a "not in list" event when you enter an item that is not in the list.  In some ways it ends up being a problem... the user types something in a little differently... its not found... they create a new item... and you have a duplicate entry... so usually i want the user to have to slow down enough to create a new item in the picklist so that its not automatic... but it would be a nice feature.
Photo of David Ross

David Ross

  • 562 Points 500 badge 2x thumb
I will vote for this idea!  This has been a huge headache for our customers within native SF and we always get a request to make this easier. I know there are work arounds using Visualforce and Apex, but having this built into Skuid would be awesome. 
Photo of ktyler

ktyler

  • 9,244 Points 5k badge 2x thumb
Peter, see you're in Berkeley. Want to get together sometime ? I'm ken@8thfold.com
Photo of Peter Bender

Peter Bender, Champion

  • 6,246 Points 5k badge 2x thumb
I can imagine a way to use the new (Skuid Winter '15) action functions to have a button near the lookup field that shows a popup/drawer, which when saved creates a new record AND then populates the lookup field. Will that work? Is there an even better way now?
Photo of David Ross

David Ross

  • 562 Points 500 badge 2x thumb
Peter,

We had the same challenge and for now we came up with a unique way around this that works well and is very easy to build.  

1. Take your exisitng  list view pages for all your lists and clone them all and create new pages (rename the model names) Clean up your tables to only show necessary columns needed for creating a new record (required fields).

- Only show 5 rows on the list view tables and load 5 records max (loads very quick)

2. Create a new page (Name something like "SearchAddPage" that will be a tabbed page with page includes with your new list view pages - use a drop down tab component to select your page includes to make it look nice. 

3. Use a Page Title component and drop a new button in it linked to multiple actions on all pages needed. (We have a custom nav bar so it is at the top of all pages)

Button Actions:

- Save models in context (In case user navigates away from page accidentally) 

- Launch Popup - Link to the new page you created (SearchAddPage) 

- Add a Page Title and "Close" button on popup (Close top most popup)

Now the user can be on any page and have a button that will popup a drop down menu that will have all your lists views so they can search or add records.  If they are working on a record and the field in context is a lookup to a Contact, and they realize that the contact does not exist; they can click the new Search / Add button and add the contact and it will be available when they close the popup to lookup and add.

Work around but it is working well for our users! 



Photo of Rob Hatch

Rob Hatch, Official Rep

  • 44,006 Points 20k badge 2x thumb
David,  this is a very intriguing solution.  Thanks for sharing
Photo of Jack Sanford

Jack Sanford, Champion

  • 8,322 Points 5k badge 2x thumb
Dave, I know this was two years ago, so you may be doing something totally different now, but I think I finally have enough Skuid knowledge to understand your solution and find it totally amazing. One question I have is, how do know which models to save when you say "Save Models in Context", if you have this button as an item in your custom header on all pages?

I guess this was before Master Pages and the Navigation component, so maybe you just built the same page title as a header over and over on every page, so you could choose the models to save.

Is there some way to have a button action that looks at all the models that exist in that context and save them, without having to explicitly declare model names?
Photo of Peter Bender

Peter Bender, Champion

  • 6,246 Points 5k badge 2x thumb
So, with the new Action framework, shouldn't there be a way to do this now? I can easily make a popup screen that saves a new record in one of my models, but I can't seem to figure how to get the ID of that new record to go into the lookup field of a record that is already in use on another model on my page. I don't seem to have that option available to me in Actions.
Photo of Greg Jarrett

Greg Jarrett

  • 3,496 Points 3k badge 2x thumb
Hi Peter, we got this working by using 'newAccount' and 'newContact' models (in addition to our 'enquiry' model on the page.

When the user chooses to add a new Account and/or Contact, we have a button which:

- Saves the enquiry model
- creates a new row in the newAccount model
- creates a new row in the newContact model (with a condition of AccountId = Id from the newAccount model
- shows a popup which allows the user to enter the new account/contact info.

That popup then has a 'Save & Close' button, which runs multiple actions:

- Saves both the newAccount & newContact models
- updates the Account field on our 'enquiry' model with {{$Model.newAccount.data.0.Id}}
- updates the Contact field on our 'enquiry' model with {{$Model.newContact.data.0.Id}}
- Closes the popup

here's a screenshot of the Save & Close popup in the page builder. Hope this helps



 
Photo of Peter Bender

Peter Bender, Champion

  • 6,246 Points 5k badge 2x thumb
Ahh, thanks. The key was getting the right merge syntax as a value in a "update field on row" action. It works!
Photo of Jack Sanford

Jack Sanford, Champion

  • 8,322 Points 5k badge 2x thumb
I'm working on another idea not documented here, wondering if anyone else has gotten to work:

Add the lookup field to a Template field, then customize the popup window using some of the above tricks. I've got it sort of working, when I get the bugs out I'll post back, unless someone else has done this bug free and wants to share the code...
(Edited)
Photo of Jack Sanford

Jack Sanford, Champion

  • 8,322 Points 5k badge 2x thumb
Got it working! 



So we have a Loan Officer field on Opportunity that looks up to a Contact. Our NewLoanOfficer model pulls from all contacts on the Account model, which is the one Account over the Opportunity. So, you'll need to find some way to limit the lookup field's model.



I included the LoanOfficer lookup field (in double brackets) on a Template Field in my Opportunity Field Editor. Then, I selected Show Custom Popup for edit mode behavior.



The custom popup includes a table with my NewLoanOfficer model, allowing inline record creation, showing save/cancel.

Note: I don't have a search box in the image because it gave me all sorts of trouble at first, but after getting everything else working, search works great now too. 

I removed all default actions, and adding a Row Action that runs multiple actions. 

The row action is called "Select this Loan Officer".

First it saves the model NewLoanOfficer, in case you just created a new one or edited any existing ones. (Whatever you set the table to, it will always open in Edit mode, I guess that's being forced since the pop-up loads from editing the template field.)

Next it updates the LoanOfficer field on Opportunity with {{{Id}}} triple brackets to include the selected value. 

Then it saves Opportunity model, and querys it to replace the field value with the chosen Loan Office, then it closes the popup. I had some trouble with choosing close the topmost popup, but it worked with close all popups. 
(Edited)
Photo of Dave

Dave

  • 5,538 Points 5k badge 2x thumb
Jack you are a genius!

Thank you very much , it worked like a charm!
Photo of Jack Sanford

Jack Sanford, Champion

  • 8,322 Points 5k badge 2x thumb
Glad it worked Dave! Here's the page xml for my test page using Contacts and Accounts:

<skuidpage unsavedchangeswarning="yes" personalizationmode="server" showsidebar="true" showheader="true" tabtooverride="Opportunity" theme="Modern">    <models>
        <model id="Contacts" limit="20" query="false" createrowifnonefound="true" adapter="salesforce" type="" sobject="Contact">
            <fields>
                <field id="Name"/>
                <field id="Id"/>
                <field id="FirstName"/>
                <field id="LastName"/>
                <field id="AccountId"/>
                <field id="Account.Name"/>
            </fields>
            <conditions/>
            <actions/>
        </model>
        <model id="Accounts" limit="20" query="true" createrowifnonefound="false" adapter="salesforce" type="" sobject="Account">
            <fields>
                <field id="Id"/>
                <field id="Name"/>
            </fields>
            <conditions/>
            <actions/>
        </model>
        <model id="NewAccount" limit="1" query="false" createrowifnonefound="false" adapter="salesforce" type="" sobject="Account">
            <fields>
                <field id="Id"/>
                <field id="Name"/>
            </fields>
            <conditions/>
            <actions/>
        </model>
    </models>
    <components>
        <pagetitle uniqueid="sk-3eQKFv-312" model="Contacts">
            <actions>
                <action type="savecancel" label="New Button"/>
            </actions>
            <maintitle>New Contacts with existing or new Accounts</maintitle>
        </pagetitle>
        <skootable showconditions="true" showsavecancel="false" searchmethod="server" searchbox="true" showexportbuttons="false" pagesize="10" createrecords="true" model="Contacts" mode="edit" uniqueid="sk-3aeyot-89">
            <fields>
                <field id="FirstName" valuehalign="" type=""/>
                <field id="LastName" valuehalign="" type=""/>
                <field id="AccountId"/>
            </fields>
            <rowactions>
                <action type="multi" label="Add Account" icon="sk-icon-employment-info">
                    <actions>
                        <action type="showPopup">
                            <popup title="Select Account for Contact {{Name}}" width="90%">
                                <components>
                                    <skootable showconditions="true" showsavecancel="true" showerrorsinline="true" searchmethod="server" searchbox="true" showexportbuttons="false" pagesize="10" createrecords="true" model="Accounts" buttonposition="" mode="read" uniqueid="sk-3aider-593">
                                        <fields>
                                            <field id="Name" valuehalign="" type=""/>
                                            <field id="Id"/>
                                        </fields>
                                        <rowactions>
                                            <action type="edit"/>
                                            <action type="delete"/>
                                            <action type="multi" label="Select This Account" icon="sk-icon-import">
                                                <actions>
                                                    <action type="adoptRows" sourcemodel="Accounts" targetmodel="NewAccount"/>
                                                    <action type="closeTopmostPopup"/>
                                                </actions>
                                            </action>
                                        </rowactions>
                                        <massactions usefirstitemasdefault="true">
                                            <action type="massupdate"/>
                                            <action type="massdelete"/>
                                        </massactions>
                                        <views>
                                            <view type="standard"/>
                                        </views>
                                    </skootable>
                                </components>
                                <afterclose>
                                    <action type="updateRow" fieldmodel="Contacts" field="AccountId" enclosevalueinquotes="true" value="{{$Model.NewAccount.data.0.Id}}"/>
                                </afterclose>
                            </popup>
                        </action>
                        <action type="emptyModelData">
                            <models>
                                <model>NewAccount</model>
                            </models>
                        </action>
                    </actions>
                </action>
            </rowactions>
            <massactions usefirstitemasdefault="true"/>
            <views>
                <view type="standard"/>
            </views>
        </skootable>
    </components>
    <resources>
        <labels/>
        <css/>
        <javascript/>
    </resources>
    <styles>
        <styleitem type="background" bgtype="none"/>
    </styles>
</skuidpage>
Photo of Jack Sanford

Jack Sanford, Champion

  • 8,322 Points 5k badge 2x thumb
One thing that isn't ideal, if you choose a contact for which you've already chosen an account, click the row action to open the popup of accounts, and then close the popup without choosing an account, it will clear out the account value on that contact. So you might do something like use the myns component to disable the x button on the popup window if you find that to be a problem. 
Photo of Dave

Dave

  • 5,538 Points 5k badge 2x thumb
Good catch, I see what u mean and could be a little issue.

What is that myns component you are mentioning?

Thx
Photo of Jack Sanford

Jack Sanford, Champion

  • 8,322 Points 5k badge 2x thumb
the genius of Barry Schnell: https://community.skuid.com/skuid/topics/popup-controller-component-disable-x-escape-key-and-hook-di...

A lot of what he did got incorporate in the After-Close Actions now available on popups, but the disable X button is still pretty useful
Photo of Rob Hatch

Rob Hatch, Official Rep

  • 44,006 Points 20k badge 2x thumb
Thanks Jack.  This is a great implementation. I'll definitely be playing around with this in days to come. 
Photo of Jack Sanford

Jack Sanford, Champion

  • 8,322 Points 5k badge 2x thumb
One issue I've found after using this in production is that you HAVE to choose a value in order to close the pop up window. And once you've chosen a value, there's no way to clear the field. I tried creating a Global Action in the table that would enter a blank value in the field, save the model, then close the popup, but it just doesn't work, it never closes the popup. I even tried Redirect to Url so that it would refresh the page but it just hangs. 

My current solution - I added some template text "Note: You must choose a Loan Officer" that renders conditionally if the field is blank. 

Once the field is populated, you can open that edit window and close it without choosing a new value. 
Photo of Nisar Ahmed

Nisar Ahmed

  • 92 Points 75 badge 2x thumb
@Skuid Support Team @Rob Hatch
Any update on this skuid enhancement ?
Photo of Jeffrey Lawler

Jeffrey Lawler

  • 1,454 Points 1k badge 2x thumb
@Skuid Support Team @Rob Hatch

Rob - Has this enhancement ever been implemented?
Photo of Dave

Dave

  • 5,538 Points 5k badge 2x thumb
Thank you Jack, your solution fit my need simply and exactly!