Multi-search, single search bar HTML - html

As the title states, I'm trying to incorporate many searches into one search bar. More specifically, Google and Amazon. I have setup a radio option to set which site to search when one is selected.
This is the code I currently have:
<form method="get" action="http://www.google.com/search">
<div align="center" style="font-size:75%">
<input type="text" name="q" size="25" maxlength="255" value="" />
<input type="submit" value="Google or Amazon Search" /></br>
<input type="radio" name="sitesearch" value="" />The Web
<input type="radio" name="sitesearch" value="yoursite.com" checked />This Site
</div>
</form>
I have this form for Amazon, but I'm just unsure how to code it into the one search bar.
<form action="http://amazon.com/s/ref=nb_sb_noss" method="get" target="_blank">
<input type="text" id="twotabsearchtextbox" name="field-keywords">
<input type="submit" value="Search" class="nav-submit-input">
</form>

Use JavaScript to change the actual form action in page's DOM (and other parameters, if needed), depending on the user selection (use onclick event on radio to montior for change for example). Simple as that. You won't be able to do that in pure HTML without using some kind of proxy server to redirect the requests and return the results appropriately.
document.your-form.action = (google_selected) ? "http://www.google.com/search" : "http://amazon.com/s/ref=nb_sb_noss";
etc.

Related

tbm image search filter in image search query

I am trying to mirror the google image search.
so far I know that q is the name for the actual google search (or query).
On the address it will look: www.google.com/search?q=parrot
but on the google image search also appears /search?q=parrot&tbm=ish
I looked and found out that tbm stands for "to be match" and is a filter and I guess is the filter to match the images... but I don't have a clue how to put inside my html code.
So far I have done this:
<form action="https://www.google.com/search" class="form">
<input type="text" name="q" class="search_bar"
<input type="submit" value="Search" class="submit">
</form>
How do I add the tbm filter? Thanks!
You can add a hidden input field and set the value of it.
example
<form action="https://www.google.com/search" class="form">
<input type="text" name="q" class="search_bar">
<input type="hidden" name="tbm" value="ish">
<input type="submit" value="Search" class="submit">
</form>

How do I create a link to google image search via HTML form?

Trying to make Google Image Search Clone using HTML form where after entering text in the search field it will take you directly to Google Image search results page.
Here is the code that I am using:
<body>
<form action="https://google.com/search">
<input type="text" name="q">
<input type="submit" value="Google Search">
</form>
</body>
It will take to normal google search, how do I change it to google image search result page?
You have to change the action, as such:
<form method="get" action="http://images.google.com/images">
<input type="text" name="q" />
<input type="submit" value="Google Search" />
</form>
Google image search link is of the following format
https://www.google.com/search?q=```query```&tbm=isch
Each of the parameters, q and tbm, requires an input tag but tbm does not require any user input.
'GET_parameter_name=value' for every input tag before submit button is appended by '&'.
<form action="https://www.google.com/search">
<input type="text" name="q" id="box">
<input type="hidden" name="tbm" value="isch">
<input type="submit" value="Image Search" >
</form>
Source:
https://stenevang.wordpress.com/2013/02/22/google-advanced-power-search-url-request-parameters/
https://www.xul.fr/javascript/parameters.php

Site navigation using radio input

Short:
I would like to use input type radio in form as a site navigation tool without need of clicking on submit button. Is this possible?
Explanation:
I am using jQuery Mobile library for my GUI and I like how the look of radio input is automatically changed - In this look I want to classify people according to their names and to switch between pages in long output.
My current code i like this:
<form action="custmers.php" method="post">
<fieldset data-role="controlgroup" data-mini="true" data-type="horizontal">
<input type="radio" name="nav" id="a" value="customers.php?letter=a">
<label for="a">A</label>
:
:
<input type="radio" name="nav" id="z" value="customers.php?letter=z">
<label for="z">Z</label>
</fieldset>
</form>
But except of highlighting currently clicked option the page doesn't redirect.
This might work (haven't tested it)
Its still early in the morning... So there is a chance I'm still tired and not thinking properly. Haha
Change your form to
<form action="customers.php" id="navigation" method="get">
<fieldset data-role="controlgroup" data-mini="true" data-type="horizontal">
<input type="radio" name="letter" id="a" value="a">
<label for="a">A</label>
:
:
<input type="radio" name="letter" id="z" value="z">
<label for="z">Z</label>
</fieldset>
</form>
Then add some jquery to your scripts
$(function(){
var $navigation=$('#navigation');
$navigation.on('change','input[name=letter]',function(){
$navigation.submit();
// or to take a more complicated (read: unneccessary)
// window.location($navigation.attr('action')+'?letter='+$(this).val());
});
});
Do note: you should consider some validation in here. I wont bother mentioning security since you didnt post the rest of your script.

Add Google search in web page

I'd like to add search to a static site. The simplest way is to simply query Google by appending "site:www.acme.com" to the actual query so that Google will limit search to that site.
Ideally, I'd like to do this in the browser, to avoid having to install PHP on the server. Using a form, I don't know how to append the search items:
<form action=http://www.google.com?q="site:www.acme.com+...">
<input type=text id=search_item>
</form>
Does someone know of a client-side solution? Should I use some JavaScript for this?
Thank you.
Edit: When using "method=get" and "input name=q value="site:www.acme.com "", the browser will indeed call Google with "www.google.com?q="site:www.acme.com some item", but I'd rather avoid presetting the input box with "site:www.acme.com" because users will find this odd and might remove it.
You just need to set the form method to "get", add one extra hidden element with the site you want to search and it will automatically paste it behind the URL as such:
<form action="https://google.com/search" method="get">
<input type="hidden" name="sitesearch" value="http://acme.com" />
<input type="text" name="q" />
</form>
Because that is how HTML forms work by default.
u can do something like this:
<script type="text/javascript">
function google_search()
{
window.location = "http://www.google.com/search?q=site:www.acme.com+" + encodeURIComponent(document.getElementById("q").value);
}
</script>
<form onSubmit="google_search()">
<input type="text" name="q" id="q" value="" />
<input type="submit" value="search" onClick="return google_search()" />
</form>
<form method="get" action="http://google.com/search">
<input type="text" name="q" required autofocus>
<input type="submit" value="Google search">
</form>
If you want to use Bing Search engine then replace 'google' with 'bing'.

Form search submission help

Hey guys, I have a form and there are 4 buttons possible for the user to click to submit. One searches for everything, another for users, another for clips, and the fourth for topics. Now my question is that the buttons has name=category and value=(type of search) and what I intend to do is send the user to the search result page with the category=value in the address bar(using GET method). This is working fine on firefox but it isn't working at all using google chrome. Any help? Here's the code:
<form method="get" action="search.php" name="search" onsubmit="return Validate();">
<input type="text" class="searchit" title="Search..." name="search" id="search" /><br/>
<label><span> </span> <input name="submitter" type="submit" value="Search" class="searchsubmitButton" id="submitter" /></label>
<span class="searchfor">Search for:</span>
<label><span> </span> <input name="c" type="submit" value="Users" class="searchsubmitButton" id="submitter" /></label>
<label><span> </span> <input name="c" type="submit" value="Clips" class="searchsubmitButton" id="submitter" /></label>
<label><span> </span> <input name="c" type="submit" value="Topics" class="searchsubmitButton" id="submitter" /></label>
</form>
because your input fields are inside the <label></label> tags ?
Take a look at this thread: Safari and Chrome back button changes hidden and submit values in forms
The easiest solution I can think of is for you to create a hidden field called "c". Then, when the submit button is clicked, set the value (Users, Clips or Topics) in "c" hidden field first before submitting the form.