I have an html iframe code for a search box. What I want is to ensure that users can type a question into the search box on the original page but have the results open into a new tab. This is where I am having some trouble. I am trying to use javascript. What is the appropriate var window code that I should use that won't turn my results into a popup?
You do not need any javascript
<form target="_blank" method="get" action="https://www.google.com">
<input type="text" name="q" />
<input type="submit">
</form>
If you want to use JavaScript, you need to use window.open()
Related
I basically have a search box, I am trying to get the value inserted and use on a separate /results.htm screen via the submit button. I've been able to get and process the results within the same page; but I am trying to do this after redirecting to a new page
/search.html
<script>
jQuery(document).ready(function() {
jQuery("#submit").click(function() {
var ZipSearch = jQuery("#Zipcode").val();
});
});
</script>
<div class="search_bar">
<form action=""><input type="text" name="Zipcode" id="Zipcode" value="" maxlength="5" placeholder="Zipcode">
<input type="button" name="submit" id="submit" value="Submit"/></form>
</div>
Want to keep input value content from /search.htm within a variable on next page, separate, /results.htm
How can I keep the user input value and use on my separate 'results' page?
Remove all the JavaScript from search.htm. There's no point in writing custom software to do things HTML has built-in.
Set the action of the form to the URL of the second page (action="/results.htm").
Change the button to a submit button (type="submit")
Read the data from the query string (location.search in JavaScript or $_GET in PHP).
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/
im completely new to html && javascript coding so now im doing my first steps and trying to write a search bar which will pass google your input text
<script src="func.js"></script>
<form name="googleSeach">
<p align="center"><input name="searchTxt" id="searchTxt" type=search placeholder="Google Search">
<input type="submit" value="Find" onclick="test()"></p>
</form>
and javascript
function test(){
window.open("https://www.google.ru/webhp?newwindow=#q="+document.getElementById('searchTxt').value,"_self")
}
well, thought it should work but no, it does not. What's the proble?
Believe you just want to use
<form name="googleSeach" onsubmit="test(event)">
Instead of onclick.
Also your handler should probably cancel the submit action. Also use location.href instead of window.open since you're trying to open the new URL in the same window.
http://jsfiddle.net/bvaughn/fr35mpgf/2/
I have a section on a webapp where the user can search a map for a set of locations and it all works properly but I want the text of the location to show up in the URL so that the user can copy it and share it and it will be the same search.
What is the best way to do this and can I do it with HTML or do I need to use Javascript? I am using jinja2 as a templating engine and I am doing the back end in Python but that shouldn't have a big impact on this. Basically I want them to be able to search for "New York City, NYC" and I want it to show up in the URL as something like
www.url.com/map?location=new%20york%20city%20nyc
The simplest way is just to create a form:
<form action="/map" method="get">
<label>Search: <input type="search" placeholder="Search" name="location"></label>
<input type="Submit">
</form>
When you enter a search term into the input box and hit "Submit" the browser will make a request to http://www.your-site.com/?q=Your%20Search%20Term - and then you can get the argument from request and do whatever you need to do with it.
document.location.hash = "some/values/moreValues";
And you can parse the hash when the page loads to display the content you need on the map
I need to get the value from the parent form into the child; not the other way around. Found many a howto from child to parent but that doesn't work for me. I have an onclick event in the input button but I'm unsure how to get the value from this calendar into the child window from here.
<form method="post" action="">
<p style="padding:10px;">
<input type="text" id="date" name="date" value="" maxlength="10"> <img src="calendar.gif" class="cp_img" alt="Open Calendar" style="padding-bottom:3px;"><br /><br />
<input type="submit" name="search" value="Submit" onclick="popWindow('search.php')">
</p>
</form>
You can use QueryStrings like this -
<input type="submit" name="search" value="Submit" onclick="popWindow('search.php')">
You can read the QueryString values using utilities like this one.
EDIT
function popWindow(windowUrl) {
var dateVal = document.getElementById("date").value;
window.open(windowUrl + "?dateValue=" + dateVal); //This will open the window with the URL like search.php?dateValue=1/1/09.
}
If you are opening a window using window.open you can pass value to it using
Querystring
like
search.php?ValueToPass=value
and read from the popup using
Request.QueryString["ValueToPass"]
or read value from pop up using
window.opener object.
This returns a reference to the window that opened this current window.
Eg:
window.opener.document.getElementById('<%=text.ClientID%>').value
Edit:
From PHP you can get the querystring variable. Take a look at
PHP $_GET Function