Simple Dashboard do not show UIViewFieldSelectField


#1

I’m setting up a simple Dashboard Page … when loading it the UIViewFieldSelectField component does not show up - only the Usagechart is shown - no relevant error are shown on console…what could be the root cause?

ui module MyModule {
    page Dashboard {
        "name": "Dashboard",
        "id": "MyModule.Dashboard",
        "template": "MyModule.Dashboard",
        "thumbnail": "thumbs/pages/MyModule.Dashboard.png",
        "title": "{~distribution.MyModule.title~}",
        "url": "",
        "controlCenterLabel": "{~distribution.MyModule.controlCenterLabel~}",
        "permissions": [
        ],
        "components": [
            {
                "id": "DashboardPlants",
                "component": "UIViewFieldSelectField",
                "placeholder": "{~RevenueProtection.Select.placeholderText~}",
                "renderTo": "#UserFilter",
                "sortField": "cells[0].str",
                "valueField": "cells[0].str",
                "displayField": "cells[0].str",
                "data": {
                    "collection": "MyModule.DashboardPlants"
                },
                "multiple": true
            },
            {
                        "id": "UsageChart",
                        "component": "MyModule.UsageChart",
                        "title": "{~MyModule.Detail.DetailTabs.UsageChart.title~}"
            }
        ],
        "behavior": [
            {
                "query": "MyModule",
                "trigger": "change",
                "action": {
                    "type": "UIActionUpdateEnelRevProDashboard"
                }
            }
        ]
    }
}

I have defined then a simple template

{{ div.container-fluid.c3-page-dashboard.c3-page-revenueprotection-dashboard({cls: cls}) do }}
    <div id="side-menu" />
    <div id="side-sub-menu" />
    <div class="row">
        <div class="col-md-12">
            <div class="pull-right">
                {{ label({style: "padding-right: 10px"}) filterByUserText }}
                <div id="UserFilter" style="display: inline-block; width: 180px;"></div>
            </div>
            {{ h1 title }}
        </div>
    </div>
    <div class="row">
        <div class="col-md-6">
            <div class="c3-component-socket" data-box="true" id="TopLeft"></div>
        </div>
        <div class="col-md-6">
            <div class="c3-component-socket" data-box="true" id="TopRight"></div>
        </div>
    </div>
{{ end }}

#2

Is the <div id="UserFilter"... showing on the page?


#3

@sean.summers it does when page is loading then when page is fully loaded it disappears


#4

@sean.summers you were right yesterday ! there is a div’s being rendered over it! moving it in other place fixed the issue