How to Create an Online Form That Opens Web Pages After Clicking the Submit Button

Question

I want to make a form where I can input a domain name and then click the submit button and have the domain name incorporated into part of a search result URL from places like Google, Bing, Yahoo, etc. After clicking the submit button I would like the results to be shown on the bottom of the page using iframe.

EDIT: Instead of opening new tabs, I would like the results to be shown on the bottom of the page using iframe. Is this possible? Here is the updated code so far:

<!DOCTYPE html>
<html>
<head>
<title>Domain Checker</title>
<meta name="description" content="Get useful information about a domain name." />
</head>
<body>

<h1>Domain Checker</h1>
<p>Use the domain checker to get useful information about a domain name. Type the domain name you want to check and hit enter.</p>

<script type='text/javascript'>
function openWindow(url)
{
  var domain2 = document.getElementById('domain2').value;
  window.open(url + domain2);
}
</script>

<form method='post'>
<label>Domain</label><input type='text' name='domain2' id='domain2'>
 <select name="select" onChange="openWindow(this.options[this.selectedIndex].value)">
  <option>Choose Below</option>
  <option value="http://www.dmoz.org/search?q=">DMOZ</option>
  <option value="https://flippa.com/valuation/">Flippa</option>
  <option value="http://web.archive.org/web/*/">WayBack</option>
  <option value="http://www.alexa.com/siteinfo/">Alexa</option>
  <option value="https://www.google.com/search?&q=site:">Google Index</option>
  <option value="https://www.google.com/search?&q=link:">Google Backlinks</option>
  <option value="http://search.yahoo.com/search?p=site:">Yahoo Index</option>
  <option value="http://search.yahoo.com/search?p=link:">Yahoo Backlinks</option>
  <option value="http://www.bing.com/search?q=site:">Bing Index</option>
  <option value="http://www.bing.com/search?q=site:">Bing Backlinks</option>
  <option value="http://whois.domaintools.com/">Whois Info</option>
 </select>
 </form>
<hr>
<p>Results show here in iframe.</p>
</body>
</html>

You'll have to be more specific. What language, etc. are you using? — WLin, Jan 24 '13 at 17:48
No problem, sorry about that. PHP. I also edited the question and added a mock up form above. Thanks for helping! — Garry, Jan 24 '13 at 17:55

score 2 · Answer 1 · answered Jan 24 '13 at 18:07

<script type='text/javascript'>
function openWindows(domain)
{
    if (domain) {
        window.open('http://www.dmoz.org/search?q=' + domain);
        window.open('https://flippa.com/valuation/' + domain);
        window.open('http://web.archive.org/web/*/' + domain);
        window.open('http://www.alexa.com/search?q=' + domain);
        window.open('https://www.google.com/search?&q=site:' + domain);
    }
}
</script>
<form action='your_form_processor.html' method='post' onsubmit="openWindows(document.getElementById('domain').value)">
<label>Domain</label><input type='text' name='domain' id='domain'>
</form>

Excellent Marc. That works great. Curious, how could I make the form have a drop down menu instead so that if I only wanted to load each page up individually? — Garry, Jan 24 '13 at 18:16

Abdullah Shaikh · Accepted Answer · 2013-01-24T19:23:03.770

1

For the other question in the comment.

<script type='text/javascript'>
function openWindow(url)
{
  var domain = document.getElementById('domain').value;
  //window.open(url + domain);
  document.getElementById('frame').src=url+domain;
}
</script>

<form method='post'>
<label>Domain</label><input type='text' name='domain' id='domain'>
 <select name="select" onChange="openWindow(this.options[this.selectedIndex].value)">
  <option value="http://www.dmoz.org/search?q=">DMOZ</option>
  <option value="https://flippa.com/valuation/">Flippa</option>
  <option value="http://web.archive.org/web/*/">WayBack</option>
  <option value="http://www.alexa.com/search?q=">Alexa</option>
  <option value="https://www.google.com/search?&q=site:">Google</option>
 </select>
 </form>

 <iframe id="frame">Your browser does not support iframes.</iframe>

edited Jan 24 '13 at 19:23

answered Jan 24 '13 at 18:32

Abdullah Shaikh

2,567
6
30
43

Thank you Abdullah. How do I tie that into the entire form? – Garry Jan 24 '13 at 18:35
I am not sure if I got you, but you can put the "select" in the
tag and "openWindow" method in
– Abdullah Shaikh Jan 24 '13 at 18:44
With your version of the form, what would the entire code look like? That's the problem I am having is replacing out Marc's code with yours. – Garry Jan 24 '13 at 18:47
Now instead of opening new tabs, how could I make the results appear on the bottom of the page using iframe? – Garry Jan 24 '13 at 19:13
1

You need to use iframe's src attribute. Updated answer to open url in iframe – Abdullah Shaikh Jan 24 '13 at 19:24
For some reason, Google doesn't load up in the iframe, everything else does. Is that a restriction implemented by Google? – Garry Jan 24 '13 at 19:40

How to Create an Online Form That Opens Web Pages After Clicking the Submit Button

2 Answers2