redirect with js to another page, the same way like <a> html attribute

Question

I have created an app with Dynamics 365, and I navigate from one page to another page

with the built in grids etc..

now I need to make a custom button to navigate to a page, so I try to use document.location.href = 'url', but this make a whole other loading experience from opening it with the grids(the navbar gets also reloaded, and the record set option disappear)

so I try to use the developer tool to see how Microsoft use to navigate from a grid row, to the form, and I see that there used a <a> html attribute to navigate,

so my question is how can I get the same behavior by using java script to redirect to a page, as pressing on a <a> link, or how can I make a dummy html <a> tag and click it with js?

here is the copied html, used by the grid to navigate

    <div role="presentation" style="max-width: max-content;"><a
            href="full url"
            class="classes" role="link"
            aria-label="text" tabindex="0"
            data-pa-landmark-active-element="true">
            <div class="classes" role="none"><span class="classes" role="presentation">text</span>
            </div>
        </a></div>

any help will be appreciated

I also try to use the other function form document object(replace etc ) but doesn't get me the same behavior like a <a> attribute, and i also try to use the Xrm.Navigation but nothing archive my needs

Answer 1

In Dynamics 365, you can use the Xrm.Navigation object to navigate between pages.

Here is small example,

function navigateToRecord(entityLogicalName, recordId, openInNewWindow) {
    var navOptions = {
        entityName: entityLogicalName,
        entityId: recordId,
        openInNewWindow: openInNewWindow
    };

    Xrm.Navigation.navigateTo(navOptions);
}

now using this function will be something like this,

<button type="button" onclick="navigateToRecord('account', '12345678-9ABC-DEF0-1234-567890ABCDEF', false)">Navigate to Account</button>