Component Condition

New post to get additional comments since this other post is closed for comments. :wink:

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

Pat,

Would something like this work?

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

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

^^^ 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.

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…

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