row action to toggle slider?

  • 1
  • Question
  • Updated 1 year ago
  • Answered
Has anyone been able to toggle a slider from a row action? I'm trying a user experience different than opening a drawer, but want the slider info to execute from the row data
Photo of Ryan Faust

Ryan Faust

  • 884 Points 500 badge 2x thumb

Posted 1 year ago

  • 1
Photo of Linda Gurtner

Linda Gurtner, Employee

  • 120 Points 100 badge 2x thumb
Hi Ryan

You can toggle a sliding panel from a row action. Just add a new row action, choose the action type "run multiple actions" and choose the action "toggle sliding panel". Add a component in the sliding panel (e.g. Field editor) and set that context of the component accordingly to only show information in the context of this row.

Here an example XML (don't forget to exchange the model):

<skuidpage unsavedchangeswarning="yes" personalizationmode="server" showsidebar="true" useviewportmeta="true" showheader="true">
    <models>
        <model id="AccountModel" limit="20" query="true" createrowifnonefound="false" datasource="salesforce" type="" sobject="Account">
            <fields>
                <field id="Id"/>
                <field id="Name"/>
                <field id="Industry"/>
            </fields>
            <conditions/>
            <actions/>
        </model>
    </models>
    <components>
        <skootable showconditions="true" showsavecancel="true" showerrorsinline="true" searchmethod="server" searchbox="true" showexportbuttons="false" pagesize="10" alwaysresetpagination="false" createrecords="true" model="AccountModel" buttonposition="" mode="read" allowcolumnreordering="true" responsive="true" uniqueid="sk-20oB0X-105">
            <fields>
                <field id="Id" hideable="true" uniqueid="fi-20oU6w-167"/>
                <field id="Name" hideable="true" uniqueid="fi-20oU6w-168"/>
                <field id="Industry" hideable="true" uniqueid="fi-20oU6w-169"/>
            </fields>
            <rowactions>
                <action type="edit"/>
                <action type="delete"/>
                <action type="multi" label="Run multiple actions" icon="sk-icon-transfer">
                    <actions>
                        <action type="toggleSlidingPanel">
                            <panel title="Sliding Panel Contents" uniqueid="sk-20oH3m-128" size="270px" origin="right" closeonpageclick="true" behavior="overlay">
                                <components>
                                    <basicfieldeditor showheader="true" showsavecancel="true" showerrorsinline="true" model="AccountModel" buttonposition="" uniqueid="sk-20oImc-132" mode="read">
                                        <columns>
                                            <column width="100%">
                                                <sections>
                                                    <section title="Section A" collapsible="no">
                                                        <fields>
                                                            <field uniqueid="sk-20oOit-150" id="Name"/>
                                                            <field uniqueid="sk-20oOit-151" id="Industry"/>
                                                        </fields>
                                                    </section>
                                                </sections>
                                            </column>
                                        </columns>
                                        <conditions>
                                            <condition type="contextrow" field="Id" mergefield="Id"/>
                                        </conditions>
                                    </basicfieldeditor>
                                </components>
                            </panel>
                        </action>
                    </actions>
                </action>
            </rowactions>
            <massactions usefirstitemasdefault="true">
                <action type="massupdate"/>
                <action type="massdelete"/>
            </massactions>
            <views>
                <view type="standard"/>
            </views>
        </skootable>
    </components>
    <resources>
        <labels/>
        <javascript/>
        <css/>
    </resources>
    <styles>
        <styleitem type="background" bgtype="none"/>
    </styles>
</skuidpage>