How do I switch partials with Node JS and Sails JS?

I have a 'My Scores' view in my Node JS / Sails JS app and I'm using partials, one for a List View, and another one for a Grid View. When the user clicks the Grid or List View from the nav bar I'd like to be able to swap the UI with the given partial.

List view:

<div class="content-container">

    <h1>My Scores</h1>

    <%- partial('../partials/list-view')%>

</div>

Grid view:

<div class="content-container">

    <h1>My Scores</h1>

    <%- partial('../partials/grid-view')%>

</div>

Please advise.

No problem--just use a variable for the partial name, instead of hardcoding it:

<%- partial(viewName) %>

then in your config/routes.js:

"/listView": {
    view: "list.ejs",
    locals: {viewName: "../partials/list-view.ejs"}
},
"/gridView": {
    view: "list.ejs",
    locals: {viewName: "../partials/grid-view.ejs"}
}

That's assuming you're just routing directly to views. If you're using a custom controller action and res.view() to display your content, you'll put the viewName value in the second res.view() argument, like res.view("list.ejs",{viewName: "../partials/list-view.ejs"}).

Now, if you're trying to do this without reloading the page, then @tonejac has the right idea in his comment--either switch them using Javascript/CSS, or use AJAX to load content on-demand. Sails can only help on the backend!