beforeRender & renderComplete called AFTER render on custom view

  • 1
  • Question
  • Updated 2 years ago
  • (Edited)
I'm not sure if this is intentional or a potential bug so starting this off as a question...

On a custom view in a table, the standard sequence of events is:

beforeRender, render, renderComplete

However, when a new row is added to a model, the order is 

render, beforeRender, renderComplete

Questions:
1) Is this order by design or a potential bug?  
From a logical perspective and to be consistent with other call sequences, it would seem that the sequence should be beforeRender, render, renderComplete especially when the name "beforRender" implies it comes before rendering.  

2) Should beforeRender/renderComplete even be getting called in this case?
There is something to be said for the fact that beforeRender & renderComplete shouldn't even be called in this case as the only thing that is "rendered" is the item not the list.

Steps to reproduce:
1) Create page using XML below
2) Preview page
3) open debug console

Expected Behavior = Actual Behavior
the first rendering of the custom view follows the beforeRender, render, renderComplete order

4) Add a record to top table using the "+" sign

Expected Behavior
Order of events is beforeRender, render, renderComplete

Actual Behavior
Order of events is render, beforeRender, renderComplete

Sample Page
<skuidpage unsavedchangeswarning="yes" personalizationmode="server" showsidebar="true" showheader="true" tabtooverride="Product2">   <models>
      <model id="Product2" limit="100" query="true" createrowifnonefound="false" sobject="Product2" adapter="" type="">
         <fields>
            <field id="Name"/>
            <field id="CreatedDate"/>
            <field id="Id"/>
            <field id="Description"/>
            <field id="Family"/>
            <field id="ProductCode"/>
         </fields>
         <conditions/>
         <actions/>
      </model>
      <model id="Tracker" limit="1" query="false" createrowifnonefound="true" adapter="" type="" doclone="" sobject="Account">
         <fields>
            <field id="HideTable" uionly="true" displaytype="BOOLEAN" label="HideTable"/>
         </fields>
         <conditions/>
         <actions/>
      </model>
   </models>
   <components>
      <pagetitle model="Product2" uniqueid="sk-jswKP-68">
         <maintitle>
            <template>{{Model.labelPlural}}</template>
         </maintitle>
         <subtitle>
            <template>Home</template>
         </subtitle>
         <actions>
            <action type="savecancel"/>
         </actions>
      </pagetitle>
      <basicfieldeditor showheader="true" showsavecancel="false" showerrorsinline="true" model="Tracker" buttonposition="" uniqueid="sk-uhxOb-780" mode="edit">
         <columns>
            <column width="100%">
               <sections>
                  <section title="Section A" collapsible="no" showheader="false">
                     <fields>
                        <field id="HideTable" valuehalign="" type=""/>
                     </fields>
                  </section>
               </sections>
            </column>
         </columns>
      </basicfieldeditor>
      <skootable showconditions="true" showsavecancel="false" searchmethod="server" searchbox="true" showexportbuttons="false" pagesize="10" createrecords="true" model="Product2" mode="edit" uniqueid="listtable" emptysearchbehavior="query" buttonposition="">
         <fields>
            <field id="Name" allowordering="true"/>
            <field id="CreatedDate" allowordering="true"/>
         </fields>
         <rowactions>
            <action type="edit"/>
            <action type="delete"/>
         </rowactions>
         <massactions usefirstitemasdefault="true"/>
         <views>
            <view type="standard"/>
         </views>
         <renderconditions logictype="and">
            <rendercondition type="fieldvalue" enclosevalueinquotes="false" fieldmodel="Tracker" sourcetype="fieldvalue" nosourcerowbehavior="skipandnorender" sourceproperty="hasChanged" value="true" operator="!=" field="HideTable"/>
         </renderconditions>
         <searchfields/>
      </skootable>
      <skootable showconditions="true" showsavecancel="false" searchmethod="server" searchbox="true" showexportbuttons="false" pagesize="10" createrecords="true" model="Product2" mode="edit" uniqueid="sk-jswKP-69" emptysearchbehavior="query" buttonposition="">
         <fields>
            <field id="Name" allowordering="true"/>
            <field id="CreatedDate" allowordering="true"/>
         </fields>
         <rowactions>
            <action type="edit"/>
            <action type="delete"/>
         </rowactions>
         <massactions usefirstitemasdefault="true"/>
         <views>
            <view type="custom" label="Basic" viewsnippet="basicView" icon="sk-icon-config"/>
         </views>
         <renderconditions logictype="and">
            <rendercondition type="fieldvalue" enclosevalueinquotes="false" fieldmodel="Tracker" sourcetype="fieldvalue" nosourcerowbehavior="skipandnorender" sourceproperty="hasChanged" value="true" operator="!=" field="HideTable"/>
         </renderconditions>
         <searchfields/>
      </skootable>
   </components>
   <resources>
      <labels/>
      <css/>
      <javascript>
         <jsitem location="inline" name="newInlineJS" cachelocation="false" url="">(function($, $S){
    
    $S.snippet.registerSnippet('basicView', function() {
        function setUp( list )
        {
            console.log( 'setUp was called - ' + Math.random());
        }
        
        function beforeRender( list )
        {
            console.log( 'beforeRender was called - ' + Math.random());            
        }
        
        function render( item )
        {
            console.log( 'render was called - ' + Math.random());
            item.element.text( item.row.Name );
        }
        
        function renderComplete( list )
        {
            console.log( 'renderComplete was called - ' + Math.random());
        }
        
        function tearDown( list )
        {
            console.log( 'tearDown was called - ' + Math.random());
        }
        
        return {
            render: render,
            setUp: setUp,
            beforeRender: beforeRender,
            renderComplete: renderComplete,
            tearDown: tearDown
        };
    });
})(skuid.$, skuid);</jsitem>
      </javascript>
   </resources>
   <styles>
      <styleitem type="background" bgtype="none"/>
   </styles>
</skuidpage>
Photo of Barry Schnell

Barry Schnell, Champion

  • 18,076 Points 10k badge 2x thumb

Posted 2 years ago

  • 1

Be the first to post a reply!