How can I open a file(pdf or image) in a new tab in BLAZOR?
I tried using:
await JSRuntime.InvokeVoidAsync("open", new object[2] { path, "_blank" });
using a javascript function with window.open();
In Both cases I got: This localhost page can’t be found. What should I do?
Check proper extension of the image or URL path is correct.
You can follow the below example:
$(document).ready(function(){
$('img.image').click(function(){
window.open($(this)[0].src, '_blank')
});
});
Two options I can suggest:
Via a button.
#inject IJSRuntime jsRuntime
<button #onclick="#LoadPage">Load Page</button>
#code {
async Task LoadPage()
{
await jsRuntime.InvokeAsync<object>("open", "MyPage", "_blank");
}
}
Via a link.
<a class="dropdown-item" href="MyPage" target="_blank">
where the razor page you want to launch has the following at the top:
#page "/MyPage"
If you would like to open a tab you can use this.
HTML:
You will need to fill in the href for where you want to go.
Related
I'm working on a website built using Laravel and AngularJS.
I want a certain link to open in a popup window.
The javascript code is
function popitup(url) {
newwindow=window.open(url,'test','height=400,width=550');
if (window.focus) {newwindow.focus()}
return false;
}
and the link is
<a ui-sref="test({id:test.id})" class="btn btn-primary fright" onclick="return popitup(this.href)" oncontextmenu="return false;">Resume</a>
when I click on the button the popup works fine but the link also opens up in the tab where I clicked it, but I don't want it to.
Is there a way to do it?
I would guess ui-sref will also bind a click-event and that event will trigger before yours.
You could skip the ui-sref and put the url in a data-attribute or inside the onclick-attribute. You could get the url using $state.href() instead. Then the problem may disappear.
Edit
You could bind it to a scope function and skip onclick all toghether. Something like this:
In the Controller (Also make sure you include $state in the controller first):
$scope.popitup = function(stateName, options) {
var url = $state.href(stateName, options);
newwindow=window.open(url,'test','height=400,width=550');
if (window.focus) {newwindow.focus()}
}
And in the HTML you invke the popuitup function with the state name and its parameters:
<a ng-click="popitup('test', {id:test.id})"
class="btn btn-primary fright" oncontextmenu="return false;">Resume</a>
Also see documentation for state.href.
<!DOCTYPE html>
<html>
<body>
Popup-window
</body>
</html>
try this code for popup window and change google.com to you site
How do I open PDF on a new tab, target="_blank" alone does not work it still open the pdf in the same tab.
Method-1 : HTML
<a target="_blank" href="http://your_url_here.html">Link</a>
You can simply do that with setting target="_blank" for an example check this
More Details
Method-2 : Javascript
<a onclick="openInNewTab('Your URL');">Something To Click On</a>
function openInNewTab(url) {
var win = window.open(url, '_blank');
win.focus();
}
Without your code is hard to tell what's wrong but did a fast test and this worked for me..
<a target="_BLANK" href="pdf/your_pdf.pdf">YOUR PDF</a>
You have to know: "_Blank" is not working as a "new tab" on every browser.
To do that, you have to use js like this:
Lnk
(it will work on any browser, "_blank" will not)
EDIT: Of course, here the "link" in window.open will be the path to where your PDF file is stored.
EDIT2 (thanks to vlaz): Yep, it will work on any browser if JS is enabled, if he his not it will not.
I tried to fix hard code(web link in href) in the following line:
'<a class="top_a" target="_blank" href="http://10.74.55.99:3000/"><img src="images/load.svg"><img src="images/nbsp.png">LoadServer</a>'
modified to：
<script type="text/javascript">
function openLoadserver() {
window.location.href = load_server; //defined load_server in other file
}
</script>
'<a class="top_a" target="_blank" href="#" onclick="openLoadserver()"><img src="images/load.svg"><img src="images/nbsp.png">LoadServer</a>'
The result is, after I click "LoadServer", current page will open the load server page, and a new tab page open the "current page" again.
My expected result is current page is keeping as original, new tab page will open the load server.
What should I do?
<a class="top_a" onclick="openLoadserver()"><img src="images/load.svg"><img src="images/nbsp.png">LoadServer</a>
Notice the difference, the target attribute :) You don't need href either
I am using a javascript function to navigate away from my website and to another website. I am also trying to open a new page when the button is clicked but instead it navigates on self instead of blank. Why does this happen?
HTML
<p style="text-align:center;">
<input style="font-size:large;" id="btamen" type="button" value="Visit Website">
</p>
JavaScript
<script type="text/javascript">
$("#btamen").click(function() {
window.location.href = 'http://www.google.com'
link.target = '_blank';
});
</script>
This line: window.location.href = 'http://www.google.com' will always replace current page with the new url.
I don't know what is link in the next page, but that code won't even execute because the page redirects and the context is lost.
If you want it like that, then do this:
window.open('http://www.google.com', '_blank').focus();
Also, you cannot guarantee its opening as browser might block it. Sort of kinda pop up blocker.
I don't think you can control it to open in a new tab. So you have to work around, what I did is:
<a href="" target="_blank" id="btamen_link">
<button type="button" id="btamen">
Click
</button>
</a>
And the jquery:
<script type="text/javascript">
$(document).ready(function(){
$('#btamen').click(function(){
$('#btamen_link').attr('href', 'http://www.google.com');
$('#btamen_link').click();
});
});
</script>
I am using self.location="www.google.com"; in my code to open google page. How can i open same page in another window.
You can use the window object's open method like so:
window.open("www.google.com");
You can use an <a> tag and set the target="_blank" property to open a page in anew tab/window. Whether this will be opened in a new tab/windows depends entirely on the settings in the user agent.
Google
try this
window.open ("www.google.com","mywindow");
<script>
function fullwin(targeturl) {
window.open(targeturl,"","fullscreen,scrollbars")
}
</script>
<form>
<input type="button" onClick="fullwin('mypage.html')" value="Show My Frameset">
</form>
i see at least one freaky method:
<a id='newwnd' href='goole.com' style='display:hidden' target='blank'></a>
...
document.getElementById('newwnd').click();