How to open button link in new tab using knockout data-bind

Question

I am trying to use a button to open a link into a new tab. The issue is that I am using a data-bind attr: href and using target="_blank" does not work because the target function requires the href not to be in a data-bind.

I have gotten it to work when not using a data-bind, but a data-bind is necessary for sending information between the two pages.

<a data-bind="attr: {href: '@Url.Action("Data", "Report")/?serialNumber='+SN()}" class="btn btn-warning createNew"> View Report </a>

This code is the working code but opens in the same tab.

When I add target="_blank" outside of the data-bind, I get an error saying that the target function requires href to be used.

When I add target: "_blank" into the data-bind after the href, it does not do anything and the button no longer works.

Currently, the button works and brings in the information I need, I just want it to open into a new tab.

Answer 1

You can simply do this:

<a data-bind="attr: {href: '@Url.Action("Data", "Report")/?serialNumber='+SN()}" class="btn btn-warning createNew" target="_blank"> View Report </a>

You can ignore the HTML validation error since the validator does not - and cannot - know about the dynamically added href attribute. It's not a problem.