open a new tab when clicking a link button - javascript

I am using below code to generate buttons with link. but problem is it is opening in same tab. i want it to open in new tab. Can somebody suggest me a method which will work for most of the browsers.
<form>
<input TYPE="button" VALUE="Home Page"
onclick="window.location.href='http://www.wherever.com'">
</form>
Also kindly suggest if we have any better method to do this.
Thanks in advance.

Since this is javascript you need to use like this:
<form>
<input TYPE="button" VALUE="Home Page"
onclick="window.open('http://www.wherever.com');">
</form>

If you want to open it in a new tab, you have to set the target to _blank (as that it the target for a new tab).
<form>
<input TYPE="button" VALUE="Home Page"
onclick="window.open('http://www.example.com','_blank')">
</form>

Related

How to change display value of the Submit button on page load using jquery

I am new to JQuery and need suggestions on following requirement.
I have a form with a submit button as below. Page accepts locale as an input parameter. Depending on the value of locale, on page load I am populating the labels of the input fields in respective language using jQuery.i18n.properties.js plug-in, but I could not update the display value of the button.
Please suggest solution or if there is another way to achieve this.
HTML code:
<input type="submit" data-inline="true" id="submit" value="Submit"/>
Have tried below jQuery options to update the button label:
$("#submit").val($.i18n.prop('submit'));
$("#submit").html($.i18n.prop('submit'));
$("#submit").prop('value',($.i18n.prop('submit')));
$("#submit").text($.i18n.prop('submit'));
None of them worked. But I see the value gets updated as below in Developer tools window, for this button.
<div class="ui-btn ui-input-btn ui-corner-all ui-shadow">
Submit
<input type="submit" id="submit" value="New Text">
</div>
Try $("#submit")[0].value = $.i18n.prop('submit');. Does that work for you?
(Even though it's a JS workaround, not a JQuery solution)
If your button is an input tag, use the jQuery val:
function changeBtnText() {
$("#submit").val("My new button text");
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="submit" id="submit" value="My button">
<button type="button" onclick="changeBtnText()">Change button text</button>
If your button is a button tag, use the jQuery text (or html):
function changeBtnText() {
$("#submit").text("My new button text");
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="submit" id="submit">My button</button>
<button type="button" onclick="changeBtnText()">Change button text</button>
Note: I recommend giving your button an ID different from "submit" to avoid confusion.

Unable to open javascript search engine results on a new window

I'm using a javascript search engine from this script page that allows me to select different providers/search engines to perform a google like search, but I'm trying to make it open in a new window after I press the send button, without success.
I've already tried to use:
target="_blank"
in <input type="button" value="Send" onClick="startSearch()" target="_blank"> and nothing happens, or:
<form name="searchForm" target="_blank">
Nothing!
I've also tried to use _new instead of _blank and didn't work either.
Finally, I've tested what suggested on w3schools.com example but unfortunately again a failure.
Can you please, guys, help? Thanks!
try something this if you want to open a new tab link by your button-
<a href="http://www.stackoverflow.com/" target="_blank">
<input type="button" value="Send" />
</a>
Quick and dirty, you can use the window.open(); method to open the search in a new window, here's some updated HTML:
<form method="GET" action="#" id="search-form">
<p><label>Search for: <input type="text" id="q" /></label></p>
<p><label>Search from: <select id="engine">
<option selected="selected" value="http://www.google.com/search?q=">Google</option>
<option value="http://www.bing.com/search?q=">Bing</option>
<option value="http://search.yahoo.com/search?p=">Yahoo!</option>
<option value="http://search.aol.com/aol/search?q=">AOL</option>
</select></label></p>
<p><input type="button" value="Send" id="send" /></p>
</form>
And the JavaScript:
<script>
var ID = function(str){return(document.getElementById(str));};
ID('send').addEventListener('click', function(){
var search = ID('q').value, select = ID('engine'), engine = select.options[select.selectedIndex].value;
if(!search) {
alert('Please include a search string');
} else {
window.open(engine + search);
}
});
</script>
Just make sure to call that at the end of the page or put it in a DOMContentLoaded event or something.
MDN Docs on window.open()
To open the link in a new window, since you are using a <form> instead o an <a> link, you have to change the javascript shown in the example, first adding an ID to the form so it is easilly accessible via the DOM:
<form id="searchForm" name="searchForm" target="blank">
Then, change the last javascript line so instead of the location.href, it changes the form's action and submits it:
document.getElementById("searchForm").action = finalSearchString;
document.getElementById("searchForm").submit();
Example:
https://jsfiddle.net/vj99ux9e/

What event should I use?

My requirement is I have a textbox and after that I have button on the keypress of the tab from the textbox it should go to the button on next tab but am unable do it can anyone help me in solving this issue? My platform is asp.net mvc.
Using tabindex you can set the order of elements that receive focus by pressing the tab.
<!--Press tab on test1 to go to button-->
<input tabindex="1" id="test1" />
<input tabindex="3" id="test2" />
<button tabindex="2">MyButton</button>

how to add fancybox when an input submit button is clicked?

apparently it seems like this fancybox only works for anchor tags that has an ID or class ?,
but i want to use it in a submit button...is there a way to use it in that element ?
e.g this doesn't work because fancybox needs an href that will pull the contents
<input type="submit" id="submitme" name="submitme" value="SUBMIT ME" />
fancy box code
$("#submitme").fancybox();
Refer it by #,
$("#submitme").fancybox();
The issue is not whether fancybox can be bound to a submit button or not. The actual issue is that your submit button doesn't tell fancybox the target content to open and the type of content it is.
So having this :
<input type="submit" id="submitme" name="submitme" value="SUBMIT ME" />
... will work if you hard code the missing elements href and type in your costom script like :
$("#submitme").fancybox({
type : "iframe",
href : "http://jsfiddle.net"
});
See JSFIDDLE
Optionally, you can hard code any html content too like :
$("#submitme").fancybox({
content : "<p>Any html as content</p>"
});
See JSFIDDLE
You are missing the # in your node reference. But that's probably just because you typed out your code in the question. You could always style a hyperlink to look like a button, give it a URL and attach the fancybox to it:
<!--<input type="submit" id="submitme" name="submitme" value="SUBMIT ME" />-->
<a href="somewhere.htm" id="submitme" name="submitme" value="SUBMIT ME" >SUBMIT ME</a>
$("#submitme").click(function(event){
event.preventDefault();//stop the hyperlink from navigating away from the current page
}).fancybox();

Open New Window on Submit Button with "parent.location"

I'm having a hard time getting a submit button to open a link in a new window.
The button code:
<input type="button" name="buy" value="Buy" onClick="parent.location='myurl'" />
I tried to add a target="_blank" to the form, but that didn't help.
Is it possible to open a new window using this "parent.location" method or any equivalent.
I'm afraid my shopping cart script won't work any longer if I change the code too much.
Best regards,
Erik Chan
<form action="whatever" method="post" target="foo" onSubmit="window.open('', 'foo', 'width=1040,height=900,status=yes,resizable=yes,scrollbars=yes')">
This should work for your needs. I have used this time and time again
<input type="button" name="buy" value="Buy" onClick='window.open("http://www.abcd.com/")' />
see it for open function param
http://www.w3schools.com/jsref/met_win_open.asp
Try window.open() method.
<input type="button" name="buy" value="Buy" onclick="window.open('myurl')">

Categories