Display icon in a template field using a snippet

edited October 26, 2017 in Questions
I am trying to display an icon in the template field base on what account it is. 
In the template field I have the following html:
<div class="nx-pagetitle-maintitle"><span id="commodIcon" class="ui-icon sk-icon sk-navigation-item-icon inline"></span> {{LDC__r.Name}} </div>
Then an inline-snippet :
var params = arguments[0],
$ = skuid.$;
var uaCommod = skuid.model.getModel('UtilityAccount').getFirstRow().Commodity__r.Name;
if(uaCommod === 'Electricity'){

When I load my page, it will show the right icon for a second and then it gets switched to a triangle with exclamation point in the middle. Does anyone has any ideas about what the problem maybe?


  • Bill McCulloughBill McCullough 💎💎
    edited October 26, 2017

    Maybe change your code to run on page load (i.e. 'Inline' vs. 'Inline - snippet')?  Here is a sample page that is working.
    <skuidpage unsavedchangeswarning="yes" personalizationmode="server" useviewportmeta="true" showsidebar="true" showheader="true" tabtooverride="Account">
            <model id="Account" limit="1" query="true" createrowifnonefound="false" datasource="salesforce" sobject="Account" type="">
                    <field id="Name"/>
                    <field id="CreatedDate"/>
                    <field id="Type"/>
                    <condition type="param" enclosevalueinquotes="true" operator="=" field="Id" value="id"/>
            <pagetitle model="Account" uniqueid="sk-1Of2_P-84">
                    <action type="savecancel" window="self" uniqueid="sk-1Of2_O-83"/>
            <basicfieldeditor showsavecancel="false" showheader="true" model="Account" mode="read" uniqueid="sk-1Of2_e-95">
                    <column width="100%">
                            <section title="Basics" collapsible="no">
                                    <field id="Name" uniqueid="sk-1Of2_W-90"/>
                                    <field uniqueid="sk-1Of64C-123" id="Type" valuehalign="" type=""/>
                                    <field uniqueid="sk-1OfFwv-155" type="COMBO" valuehalign="" editmodebehavior="autopopup" allowhtml="true">
                                        <label>Template Field</label>
                                        <template>&lt;div class="nx-pagetitle-maintitle"&gt;&lt;span id="commodIcon"&gt;&lt;/span&gt;{{Name}}&lt;/div&gt;</template>
                <jsitem location="inline" name="newInlineJS" cachelocation="false" url="">(function(skuid){
    var $ = skuid.$;
            var mod = skuid.model.map().Account;
            var uaCommod = mod.data[0].Type;
            if(uaCommod === 'Customer - Direct'){
                $('#commodIcon').addClass('ui-button-icon-primary ui-icon sk-icon-campaign sk-icon inline');
                $('#commodIcon').addClass('ui-button-icon-primary ui-icon sk-icon-prices sk-icon inline');
            <styleitem type="background" bgtype="none"/>

Sign In or Register to comment.

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!