custom field renderer to make a field required

  • 1
  • Question
  • Updated 1 year ago
  • Answered
  • (Edited)
The use case is this...

I want to have several fields on the page and then unhide them and/or make them required based on some criteria(based on the type I'm in another object defining whether the field is required and/or visible).

I need help trying to set a field as required on a custom renderer.  I am able to set it's mode dynamically but not the required attribute.

var $ = skuid.$, field=arguments[0], value=arguments[1];


console.log('value: ' + value);
console.log('field: ' + field.required);
console.log('before');

field.mode = 'edit';
field.required = 'true';
//also want to unhide this field

skuid.ui.fieldRenderers[field.metadata.displaytype][field.mode](field,value);

console.log('after');
console.log('value: ' + value);
console.log('field: ' + field.required);
Photo of Jaime

Jaime

  • 1,220 Points 1k badge 2x thumb

Posted 2 years ago

  • 1
Photo of Bill McCullough

Bill McCullough, Champion

  • 12,436 Points 10k badge 2x thumb
Jaime,

I think you can get what you want declaratively in Skuid.  Add your field and make it required.  Set your render to condition to hide it.  When it is shown, it will be required for entry.  If it is hidden, it won't affect saving your record.

Here is a new Contact page that demonstrates this.  When Lead Source is set to 'Other', the page displays the Contact Description as a required field.  While Contact Description is hidden, you can save the new Contact.

<skuidpage unsavedchangeswarning="yes" personalizationmode="server" useviewportmeta="true" showsidebar="true" showheader="true" tabtooverride="Contact">    <models>
        <model id="Contact" limit="1" query="false" createrowifnonefound="true" datasourcetype="salesforce" datasource="salesforce" sobject="Contact">
            <fields>
                <field id="FirstName"/>
                <field id="LastName"/>
                <field id="LeadSource"/>
                <field id="Description"/>
            </fields>
            <conditions/>
            <actions/>
        </model>
    </models>
    <components>
        <pagetitle model="Contact" uniqueid="sk-3veJd8-92">
            <maintitle>
                <template>New {{Model.label}}</template>
            </maintitle>
            <subtitle>
                <template>{{Model.labelPlural}}</template>
            </subtitle>
            <actions>
                <action type="savecancel" afterCancel="/{{Model.KeyPrefix}}/o" afterSave="/{{Id}}" rollbackonanyerror="true"/>
            </actions>
        </pagetitle>
        <basicfieldeditor showsavecancel="false" showheader="true" model="Contact" mode="edit" uniqueid="sk-3veJd8-93">
            <columns>
                <column width="50%">
                    <sections>
                        <section title="Basics">
                            <fields>
                                <field id="FirstName"/> <field id="LastName"/>
                            </fields>
                        </section>
                    </sections>
                </column>
                <column width="50%">
                    <sections>
                        <section title="Additional Info" collapsible="no">
                            <fields>
                                <field id="LeadSource"/>
                                <field id="Description" valuehalign="" type="" required="true">
                                    <renderconditions logictype="and" onhidedatabehavior="keep">
                                        <rendercondition type="fieldvalue" operator="=" enclosevalueinquotes="true" fieldmodel="Contact" sourcetype="fieldvalue" field="LeadSource" fieldtargetobjects="Contact" value="Other"/>
                                    </renderconditions>
                                    <enableconditions/>
                                </field>
                            </fields>
                        </section>
                    </sections>
                </column>
            </columns>
        </basicfieldeditor>
    </components>
    <resources>
        <labels/>
        <css/>
        <javascript/>
    </resources>
    <styles>
        <styleitem type="background" bgtype="none"/>
    </styles>
</skuidpage>

Thanks,

Bill
Photo of Chandra V

Chandra V, Champion

  • 6,966 Points 5k badge 2x thumb
^^ This is what we do.  Have the field twice on the page, one required and one not.  Conditionally show the correct field based on the situation.
Photo of Jaime

Jaime

  • 1,220 Points 1k badge 2x thumb
Yeah that's what we do now but you should be able to do it programmatically.
Photo of Matt Sones

Matt Sones, Champion

  • 31,478 Points 20k badge 2x thumb
Hey Skuid!

Any way to do this programaticallly? Having two versions of the field with conditional rendering doesn't work when I'm using a table.