Filter button aligning right and cutting queue width down

Arne-Per HeurbergArne-Per Heurberg Member ✭✭
edited March 2019 in Questions
Apologies if this is a duplicate. My first post didn't seem to load.

I have a super basic queue in the left div of 2 on a page. The filter aligns right and cuts queue width down as well as running over header. I  have looked at the other posts which have been marked resolved and fixed but I cannot get the filter to align or stay within the header. Thanks

image

Comments

  • edited March 2019
    Arne-Per,

    I was trying to recreate this problem.  Is the filter part of the Queue or Filter component?  Also, what version of Skuid are you using?

    One thing to check is your Themes....see if you need to run the 'update'.  Your styles may be off.

    Thanks,

    Bill
  • Arne-Per HeurbergArne-Per Heurberg Member ✭✭
    edited March 2018
    Hi Bill, Thanks for the reply and looking into it. Theme's definitely updated (I have done that before). It is in the Queue Component. In the past, situ like this it expands Queue Header. Cheers,
    AP
  • edited March 2018
    Arne,

    I was able to replicate what you are seeing.  When I disabled the search box,  I got the same result as you.  Opening the queue header with the filter compresses the queue 'cards' to the left.

    If you re-enable the search box, the issue goes away.  Looks like we'll need Skuid to look at this.

    Thanks,

    Bill


    <skuidpage unsavedchangeswarning="yes" personalizationmode="server" useviewportmeta="true" showsidebar="true" showheader="true" tabtooverride="Task" theme="MaterialBlueClone">
        <models>
            <model id="Task" limit="100" query="true" createrowifnonefound="false" datasource="salesforce" sobject="Task" type="" orderby="CreatedDate DESC">
                <fields>
                    <field id="Subject"/>
                    <field id="CreatedDate"/>
                    <field id="ActivityDate"/>
                    <field id="ReminderDateTime"/>
                    <field id="Id"/>
                </fields>
                <conditions>
                    <condition type="fieldvalue" field="Status" operator="=" inactive="true" enclosevalueinquotes="true" name="__autofilter__Status" state="filterableoff" value=""/>
                    <condition type="fieldvalue" field="Priority" operator="=" inactive="true" enclosevalueinquotes="true" name="__autofilter__Priority" state="filterableoff" value=""/>
                </conditions>
                <actions/>
            </model>
        </models>
        <components>
            <pagetitle model="Task" uniqueid="sk-2gBr9v-93">
                <maintitle>
                    <template>{{Model.labelPlural}}</template>
                </maintitle>
                <subtitle>
                    <template>Home</template>
                </subtitle>
                <actions>
                    <action type="savecancel" uniqueid="sk-28uGJE-84">
                        <savehotkeys>
                            <hotkey modifiers="ctrl" key="s"/>
                        </savehotkeys>
                    </action>
                </actions>
            </pagetitle>
            <grid uniqueid="sk-1nWmXi-99">
                <divisions>
                    <division behavior="specified" verticalalign="top" width="200px">
                        <components>
                            <queue tagrendertype="template" searchbox="false" tokenizesearch="true" showsearchbydefault="false" uniqueid="sk-33atS--158" model="Task" title="Tasks" searchmethod="server" emptysearchbehavior="query">
                                <rendertemplate>{{Subject}}</rendertemplate>
                                <interactions>
                                    <interaction type="tap">
                                        <action type="updateIncludePanel" pagename="TaskViewPI" module="" panelid="sk-1oa1KZ-104" querystring="id={{{Id}}}"/>
                                    </interaction>
                                </interactions>
                                <filters>
                                    <filter type="select" createfilteroffoption="true" affectcookies="true" autocompthreshold="25" conditionsource="auto" labelmode="auto" filtermethod="server" conditionfield="Priority" filteroffoptionlabel="All Priorities"/>
                                </filters>
                                <searchfields/>
                                <renderconditions logictype="and"/>
                            </queue>
                        </components>
                    </division>
                    <division behavior="flex" verticalalign="top" minwidth="100px" ratio="1">
                        <components>
                            <includepanel type="skuid" uniqueid="sk-1oa1KZ-104" pagename="TaskViewPI" module="" querystring="id={{{$Model.Task.data.0.Id}}}" lazyload="false"/>
                        </components>
                    </division>
                </divisions>
                <styles>
                    <styleitem type="background" bgtype="none"/>
                </styles>
            </grid>
        </components>
        <resources>
            <labels/>
            <css/>
            <javascript/>
            <actionsequences/>
        </resources>
        <styles>
            <styleitem type="background" bgtype="none"/>
        </styles>
    </skuidpage>

  • Arne-Per HeurbergArne-Per Heurberg Member ✭✭
    edited March 2018
    Thank you for confirming. How do I go Abbott making skuid aware of that?? Cheers!
  • Stephen SellsStephen Sells Member
    edited March 2018
    ....By making a comment like that you've made Skuid aware. Thanks guys!
  • Stephen SellsStephen Sells Member
    edited March 2018
    I'm not able to replicate this issue on 11.0.8 using the XML given. 

    What version of Skuid are you using?
    What browser are you seeing this in?
    Is the page include required? Right now my test doesn't have the page include working. 

    Maybe I'm just having a bad case of Friday, but the XML posted here is NOT working for you guys right? 
  • edited March 2018
    Stephen,

    I am on 11.1.3 (just updated).  I am seeing this problem with Firefox and Chrome.  I stripped out as much as I could from this page.  It is just a responsive grid with 2 divisions.  The left division is fixed at 200px.  The only other component is the queue itself (search component is enabled and 1 autofilter is present).  Here is my screenshot and the xml.

    image

    <skuidpage unsavedchangeswarning="yes" personalizationmode="server" useviewportmeta="true" showsidebar="false" showheader="false" tabtooverride="Task">
        <models>
            <model id="Task" limit="10" query="true" createrowifnonefound="false" datasource="salesforce" sobject="Task" orderby="CreatedDate DESC">
                <fields>
                    <field id="Subject"/>
                    <field id="CreatedDate"/>
                    <field id="ActivityDate"/>
                    <field id="ReminderDateTime"/>
                    <field id="Id"/>
                </fields>
                <conditions>
                    <condition type="fieldvalue" field="Priority" operator="=" inactive="true" enclosevalueinquotes="true" name="__autofilter__Priority" state="filterableoff" value=""/>
                </conditions>
                <actions/>
            </model>
        </models>
        <components>
            <grid uniqueid="sk-1nWmXi-99">
                <divisions>
                    <division behavior="specified" verticalalign="top" width="200px">
                        <components>
                            <queue tagrendertype="template" searchbox="false" tokenizesearch="true" showsearchbydefault="false" uniqueid="sk-33atS--158" model="Task" title="Tasks" searchmethod="server" emptysearchbehavior="query" instantfilters="false">
                                <rendertemplate>{{Subject}}</rendertemplate>
                                <interactions/>
                                <filters>
                                    <filter type="select" createfilteroffoption="true" affectcookies="true" autocompthreshold="25" conditionsource="auto" labelmode="auto" filtermethod="server" conditionfield="Priority" filteroffoptionlabel="All Priorities"/>
                                </filters>
                                <searchfields/>
                                <renderconditions logictype="and"/>
                            </queue>
                        </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/>
            <css/>
            <javascript/>
            <actionsequences/>
        </resources>
        <styles>
            <styleitem type="background" bgtype="none"/>
        </styles>
    </skuidpage>

  • Stephen SellsStephen Sells Member
    edited March 2018
    I do see the problem on 11.1.4. Thank you for reporting this. I'll log this in our internal tracking service and will report here when the issue is resolved with a new release.

    I do not see the problem in 11.0.8. This only appears in the 11.1 series of updates.
  • Arne-Per HeurbergArne-Per Heurberg Member ✭✭
    edited March 2018
    I was going to ping to let you know that i am on 11.1 series

  • Arne-Per HeurbergArne-Per Heurberg Member ✭✭
    edited April 2018
    Stephen- any update on this?
  • Stephen SellsStephen Sells Member
    edited April 2018
    Our developers have escalated it's importance but we still don't have a set date on when the fix will come out
  • Karen WaldschmittKaren Waldschmitt Skuid Mod, Admin 🛠️ 
    edited May 2018
    Good news, Bill and Arne!

    Skuid has fixed the issue regarding right aligned filter buttons cutting into queue width (issue CORE-1526) in the new 11.1.11 release which is now available on the Skuid Releases page.

    As a reminder, Salesforce does NOT allow reverting back to prior versions of managed packages. Skuid always recommends installing new versions in a non-business critical sandbox environment to test all mission critical functionality before installing into a production environment. We also recommend that you update out of date themes when you upgrade. Please let us know if you continue to encounter any problems with this issue after upgrading.
     
    Thanks again for alerting us of this issue!
    Karen  
  • Arne-Per HeurbergArne-Per Heurberg Member ✭✭
    edited March 2019
    Thanks! Will confirm that it is working!
Sign In or Register to comment.