Have model/deck load in newest records but have the newest record appear at the bottom of the deck/table

  • 1
  • Question
  • Updated 6 months ago
  • Answered
anyone have any Ideas on how I would pull this off. I want to load in the most recent 5 records into a deck component, but I want them ordered in Oldest to Newest so that the newest record is at the bottom of the list. So I need to limit the record load of the model to 5, then choose to sort the model by CreatedDate DESC to get the most recent 5 records. 
THEN I NEED TO REORDER THE DECK SO THAT THE MOST RECENT RECORD APPEARS AT THE BOTTOM INSTEAD OF THE TOP.
Any ideas?
Photo of Skuidward Tentacles (Raymond)

Skuidward Tentacles (Raymond), Champion

  • 17,224 Points 10k badge 2x thumb

Posted 7 months ago

  • 1
Photo of mB Pat Vachon

mB Pat Vachon, Champion

  • 42,714 Points 20k badge 2x thumb
Can do with javascript for sure.
Photo of Bill McCullough

Bill McCullough, Champion

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

If you are using Skuid Millau (11), you can sort using the Action Framework.  Just execute the sort on the event 'Skuid Page: Rendered'.  Here is a sample that gets the 5 most recently created Tasks and sorts them in Ascending order.

Thanks,

Bill


<skuidpage personalizationmode="server" useviewportmeta="true" showsidebar="true" showheader="true">
    <models>
        <model id="TaskDeck" limit="5" query="true" createrowifnonefound="false" datasource="salesforce" sobject="Task" orderby="CreatedDate DESC">
            <fields>
                <field id="Subject"/>
                <field id="CreatedDate"/>
            </fields>
            <conditions/>
            <actions/>
        </model>
    </models>
    <components>
        <grid uniqueid="sk-sHX-419">
            <divisions>
                <division behavior="flex" minwidth="100px" ratio="1" verticalalign="top">
                    <components>
                        <deck searchmethod="server" searchbox="true" columngutter=".75em" rowgutter=".75em" model="TaskDeck" filtersposition="top" filterswidth="150px" showsavecancel="false" behavior="flex" verticalalign="top" ratio="1" minwidth="350px" hideheader="false" hidefooter="false" uniqueid="sk-sHX-399" pagesize="5">
                            <components>
                                <basicfieldeditor showheader="true" showsavecancel="false" showerrorsinline="true" model="TaskDeck" uniqueid="sk-sHX-478" mode="read">
                                    <columns>
                                        <column width="100%">
                                            <sections>
                                                <section title="{{Subject}}" collapsible="no">
                                                    <fields>
                                                        <field uniqueid="sk-sHX-570" id="CreatedDate"/>
                                                    </fields>
                                                </section>
                                            </sections>
                                        </column>
                                    </columns>
                                </basicfieldeditor>
                            </components>
                            <massactions/>
                            <interactions/>
                            <actions/>
                            <styles>
                                <styleitem type="border"/>
                            </styles>
                        </deck>
                    </components>
                </division>
                <division behavior="flex" verticalalign="top" minwidth="100px" ratio="1">
                    <components/>
                </division>
                <division behavior="flex" verticalalign="top" minwidth="100px" ratio="1">
                    <components/>
                </division>
            </divisions>
            <styles>
                <styleitem type="background" bgtype="none"/>
            </styles>
        </grid>
    </components>
    <resources>
        <labels/>
        <javascript/>
        <css/>
        <actionsequences uniqueid="sk-sHX-269">
            <actionsequence id="ce44ecdb-aa16-4d35-bd11-04fb7bfd7763" label="ResortDeck" type="event-triggered" event-scope="component" event-name="page.rendered">
                <description/>
                <actions>
                    <action type="sortModel" client-side="true" model="TaskDeck" method="asc" field="CreatedDate"/>
                </actions>
            </actionsequence>
        </actionsequences>
    </resources>
    <styles>
        <styleitem type="background" bgtype="none"/>
    </styles>
</skuidpage>
Photo of mB Pat Vachon

mB Pat Vachon, Champion

  • 42,714 Points 20k badge 2x thumb
Nice!

How long have we had this "Sort" action ?
Photo of Skuidward Tentacles (Raymond)

Skuidward Tentacles (Raymond), Champion

  • 17,224 Points 10k badge 2x thumb
It works! Thanks BIll. I just can't get it to work as a model action with trigger of model requery. Throws an error. Trying to get it so that when someone clicks "Load more" that it will reset the order. 
Photo of Skuidward Tentacles (Raymond)

Skuidward Tentacles (Raymond), Champion

  • 17,224 Points 10k badge 2x thumb
Wow!!!! This is cool. Thanks Bill. I haven’t had a chance to check it out, but this is awesome.