Page links that don't reset SideNav menu expansion?

I’m trying to work out a way to have what amount to Next and Back buttons on pages that don’t un-collapse the menus on a Fixed SideNav. Best as I can tell, using New-UDLink to the next page loads the whole page, as does Invoke-UDRedirect as the -OnClick of New-UDButton, but using New-UDInput > New-UDInputAction -RedirectURL only loads the content (and URL?) but not the Header, Footer, and SideNav. I even went so far as to create an Input to redirect, hide it by ID with a Theme, and create a Button that calls JavaScript to click the button on the Input. I’ve even put together demo code below.

But is there a more elegant method that I’m completely missing? This feels like a janky workaround for walking through some simple tasks.

$Theme = New-UDTheme -Name Test -Parent Default -Definition @{
    '#HiddenRedirect' = @{
        display = 'none'
    }
}
$Pages = @(
    New-UDPage -Name 'Link' -DefaultHomePage -Content {
        # This will collapse the SideNav menu
        New-UDLink -Url '/Button' -Text 'UDLink'
    }
    New-UDPage -Name 'Button' -Content {
        # This will also collapse the SideNav menu
        New-UDButton -Text 'UDButton' -OnClick {
            Invoke-UDRedirect -Url '/Input'
        }
    }
    New-UDPage -Name 'Input' -Content {
        # This won't collapse the SideNav menu, but is a big Form
        New-UDInput -Endpoint {
            New-UDInputAction -RedirectUrl '/HiddenInput'
        }
    }
    New-UDPage -Name 'HiddenInput' -Content {
        # This won't collapse the SideNav menu, but requires adding the Id of every one you use
        # to the Theme as hidden, and using custom JavaScript to click the hen Input form button
        New-UDInput -Id HiddenRedirect -Endpoint {
            New-UDInputAction -RedirectUrl '/Link'
        }
        New-UDButton -Text 'Js Button for Input' -OnClick {
            Invoke-UDJavaScript -JavaScript 'document.getElementById("btnHiddenRedirect").click()'
        }
    }
)
$Navigation = New-UDSideNav -Fixed -Content {
    New-UDSideNavItem -Text 'Expanded header' -Children {
        New-UDSideNavItem -Url 'Link' -Text 'Use UDLink'
        New-UDSideNavItem -Url 'Button' -Text 'Use UDButton'
        New-UDSideNavItem -Url 'Input' -Text 'Use UDInput'
        New-UDSideNavItem -Url 'HiddenInput' -Text 'Use UDButton and hidden UDInput'
    }
}
$Dashboard = New-UDDashboard -Title 'Redirect Testing' -Pages $Pages -Navigation $Navigation -Theme $Theme
Start-UDDashboard -Dashboard $Dashboard -Port 10001

The problem is that Invoke-UDRedirect does reload the whole page. We’ve implemented an update to it in the v3 version that will allow exactly what you are trying to do. If it’s a relative URL, it no longer reloads the entire page and just does a JavaScript based redirect.

We have a little work to do to ensure that the navigation remains open like you’d like but it will be available once v3 is out.

Thanks. I guess I’ll stick with the hack for now. I’m looking forward to v3.

Running 3.2.6 here, and I don’t seem to be able to get Invoke-UDRedirect to load a page without closing side-nav submenus.

I did manage to hack something up with a single page, and side nav links that used ‘set-udelement’ to update the page area, that looked quite nice, and refreshed very quickly - however that also means that I lose the ability to bookmark individual pages - which I can live with, but would be nice to have!

Is it possibe to combine a Navigation that doesn’t lose child state, content area only refreshes, and still have the browser URL change for each page? ( And I realise it’s kinda asking a lot! )

$Navigation = @(
    New-UDListItem -Label "Home Page" -OnClick { Invoke-UDRedirect 'home-page' }
    New-UDListItem -Label "IT Accounts" -Children {
        New-UDListItem -Label "AD Grid Test" -OnClick {  Invoke-UDRedirect  'ADGridTest'  }
        New-UDListItem -Label "Edit Single User" -OnClick {  Invoke-UDRedirect  'EditSingleUser' }
    }
)

$Pages = @()
$Pages += New-UDPage -Name 'Home Page' -url "Home-Page" -Content {
    . "$FileRoot\pages\home.ps1"
}  -NavigationLayout permanent -Navigation $Navigation -DefaultHomePage 

$Pages += New-UDPage -Name "ADGridTest" -url "AdGridTest" -Content {
    . "$FileRoot\pages\ADGridTest.ps1"
}  -NavigationLayout permanent -Navigation $Navigation

$Pages += New-UDPage -Name "Edit Single User" -Url "EditSingleUser" -Content {
    . "$FileRoot\pages\EditSingleUser.ps1"
}  -NavigationLayout permanent -Navigation $Navigation

New-UDDashboard -Title 'HR' -Pages $Pages

Greetings,
I’m getting the same issue on v3.1.0

My code looks like this

New-UDListItem -Label "Test" -OnClick { Invoke-UDRedirect '/test' } -Icon (New-UDIcon -Icon mail_bulk -Size 1x)

Please let me know if I missed an option.

And also, is there a Refresh() for if I do need to force just a sidebar refresh

This is an open issue. The main problem is due to a technical issue it’s a tricky problem to fix and that’s why it wasn’t handled earlier. That said, I can move the priority on it to get that resolved.

1 Like