locked
multilevel push menu problem RRS feed

  • Question

  • Using this example: http://lightswitchhelpwebsite.com/Blog/tabid/61/EntryId/3247/Visual-Studio-LightSwitch-HTML-Client-Push-Menu.aspx

    Everything works great except when you have an add or edit button.  If I push the edit button then close out of the dialog (doesn't matter if you actually edit the record or not), the content slips back under the menu when the dialog closes.  Does anyone know how to fix this?  This only happens if you exit a dialog.  Strangely, it renders correctly if the screen is minimized but this happens if the browser window is maximized.

    Everything works when the screen first renders.

    Close the edit dialog and the div doesn't push.



    • Edited by Hessc Monday, August 25, 2014 4:10 AM
    Monday, August 25, 2014 3:40 AM

Answers

  • Here is how I fixed it in case it helps someone.

    In the user-customization.css where you add custom css from the example.  Remove .msls-logo, .msls-title-container, and add .msls-header-area.  This will ensure any tabs will be pushed to the right as well.

    /*.msls-logo, .msls-title-container {
        margin-left: 2em;
    }*/
    
    .msls-header-area {
        margin-left: 2em;
    }

    Next, in the spacerControl_render code, add $("div[data-role*='content']") to the array of containersToPush like this.

    containersToPush: [$("div[data-role*='page']"), $("div[data-role*='header']"), $("div[data-role*='content']")],
    These fixes solve most of the problems I have encountered.  Many thanks to Michael Washington for this great example.


    • Marked as answer by Hessc Monday, August 25, 2014 2:33 PM
    • Edited by Hessc Monday, August 25, 2014 2:34 PM
    Monday, August 25, 2014 2:32 PM

All replies

  • Here is how I fixed it in case it helps someone.

    In the user-customization.css where you add custom css from the example.  Remove .msls-logo, .msls-title-container, and add .msls-header-area.  This will ensure any tabs will be pushed to the right as well.

    /*.msls-logo, .msls-title-container {
        margin-left: 2em;
    }*/
    
    .msls-header-area {
        margin-left: 2em;
    }

    Next, in the spacerControl_render code, add $("div[data-role*='content']") to the array of containersToPush like this.

    containersToPush: [$("div[data-role*='page']"), $("div[data-role*='header']"), $("div[data-role*='content']")],
    These fixes solve most of the problems I have encountered.  Many thanks to Michael Washington for this great example.


    • Marked as answer by Hessc Monday, August 25, 2014 2:33 PM
    • Edited by Hessc Monday, August 25, 2014 2:34 PM
    Monday, August 25, 2014 2:32 PM
  • Hi guys,

    I have exactly the same issue with the latest version of LightSwitch. It works fine when the menu is initially loaded. I already applied the fix suggested above. Are you aware of something else that has to be done in order the fix the issue.

    Thank you,

    Martin

    

    Wednesday, October 15, 2014 10:00 PM