Component Condition

Pat VachonPat Vachon 💎💎💎
edited June 25 in Ideas
New post to get additional comments since this other post is closed for comments. ;)

Here's a simple example of this mornings use of this requested feature.

image
5
5 votes

Awaiting Review · Last Updated

Comments

  • edited June 25
    Pat,

    Would something like this work?

    image

    I have a page with 1 model, 1 page title, 2 tabs, and 1 table.  The table is BELOW the tab component.  I use the tab actions to set any filters on the model that I want.  Clicking the tabs can change the filter conditions and re-query the single model/table.  With conditional rendering of columns, you can adjust the columns that appear for each tab.

    Here is a sample page so you can see it in action.
    <skuidpage unsavedchangeswarning="yes" personalizationmode="server" useviewportmeta="true" showsidebar="true" showheader="true" tabtooverride="Opportunity">
        <models>
            <model id="Opportunity" limit="100" query="false" createrowifnonefound="false" datasource="salesforce" sobject="Opportunity">
                <fields>
                    <field id="Name"/>
                    <field id="CreatedDate"/>
                    <field id="StageName"/>
                    <field id="Amount"/>
                    <field id="CloseDate"/>
                </fields>
                <conditions>
                    <condition type="fieldvalue" value="" enclosevalueinquotes="true" field="StageName" state="filterableoff" inactive="true" name="StageName"/>
                </conditions>
                <actions/>
            </model>
        </models>
        <components>
            <pagetitle model="Opportunity" uniqueid="sk-2Sc1-199">
                <maintitle>
                    <template>{{Model.labelPlural}}</template>
                </maintitle>
                <subtitle>Single Model/MultiTab</subtitle>
                <actions>
                    <action type="savecancel" uniqueid="sk-2Sc1-197"/>
                </actions>
            </pagetitle>
            <tabset rememberlastusertab="true" defertabrendering="true" uniqueid="sk-2Sc1-314">
                <tabs>
                    <tab name="Qualification">
                        <components/>
                        <oninitialshowactions/>
                        <onshowactions>
                            <action type="setCondition" model="Opportunity" condition="StageName" value="Qualification"/>
                            <action type="requeryModel" model="Opportunity" behavior="standard"/>
                        </onshowactions>
                    </tab>
                    <tab name="Proposal/Price Quote" loadlazypanels="true">
                        <components/>
                        <oninitialshowactions/>
                        <onshowactions>
                            <action type="setCondition" model="Opportunity" condition="StageName" value="Proposal/Price Quote"/>
                            <action type="requeryModel" model="Opportunity" behavior="standard"/>
                        </onshowactions>
                    </tab>
                </tabs>
            </tabset>
            <skootable showconditions="true" showsavecancel="false" searchmethod="server" searchbox="true" showexportbuttons="false" pagesize="10" createrecords="true" model="Opportunity" mode="read" allowcolumnreordering="true" uniqueid="sk-2Sc1-213">
                <fields>
                    <field id="Name" hideable="true" allowordering="true" uniqueid="fi-2Sbw-940"/>
                    <field id="StageName" hideable="true" uniqueid="fi-2Sc1-257"/>
                    <field id="CreatedDate" hideable="true" allowordering="true" uniqueid="fi-2Sbw-941"/>
                    <field id="Amount" hideable="true" uniqueid="fi-2Sc1-295"/>
                    <field id="CloseDate" hideable="true" uniqueid="fi-2Sc1-296"/>
                </fields>
                <rowactions>
                    <action type="edit"/>
                    <action type="delete"/>
                </rowactions>
                <massactions usefirstitemasdefault="true">
                    <action type="massupdate"/>
                    <action type="massdelete"/>
                </massactions>
                <views>
                    <view type="standard"/>
                </views>
            </skootable>
        </components>
        <resources>
            <labels/>
            <css/>
            <javascript/>
            <actionsequences uniqueid="sk-2Sc1-254"/>
        </resources>
        <styles>
            <styleitem type="background" bgtype="none"/>
        </styles>
    </skuidpage>
    Thanks,

    Bill
  • Pat VachonPat Vachon 💎💎💎
    edited April 2018
    Hey Bill, In some circumstances this will work. In others not so much. This multiple related lists example works. User would be subject to waiting for a query but it would work. I have other use cases which need to display multiple components at the same time. Thanks, Pat
  • Pat VachonPat Vachon 💎💎💎
    edited June 25
    ^^^ bump ^^^

    Came up again. I have multiple models that are exactly the same except for 1-2 static conditions.

    This option would reduce the number of models by 10 at this point of the page development.

    I could add the condition via xml to the component, but then managing this in the future would require remembering the condition is there as it's not something I could see in the page builder. I would be ok with this if I could include developer notes specifically on the component and/or model.
  • Matt SonesMatt Sones 💎💎💎
    edited June 2018
    I just used component conditions for the first time. So awesome!

    Best part is you can actually write conditions on ui-only fields this way...
  • edited June 2018
    Pat,

    I see why your request is so valuable.  Being able to declaratively set component conditions will make your pages load faster and easier to maintain.

    Thanks,

    Bill
Sign In or Register to comment.