CODEWITHSUNDEEP
javascripthtml
Samir
Samir

Reputation: 3187

Simple JavaScript search box

I tried connecting the first text box, so it would turn it into a URL, and then when 'search' is clicked, it would jump to that website, not sure if it's impossible, or i'm just clueless, but would really appreciate some help, thank you in advance!

<html>

<head>
</head>

<body>
  <script type="text/javascript">
    function link() {
      var link_s = document.getElementById('link_id').value;
      document.getElementById('link_str').innerHTML = link_s.link()
    }
  </script>

  <h2> Search box </h2>
  <input type='text' id='link_id'>
  <input type='button' id='link_str' value='Search' onClick='link()'>
</body>
<html>

Upvotes: 4

Views: 71149

Answers (3)

sheng
sheng

Reputation: 1372

Here's how I would do it:

 <input type="text" id="link-box"/>
 <input type="button" id="search-button" value="Search" 
        onclick="window.location = document.getElementById('link-box').value;"/>

Of course you could do this:

 <script type="text/javascript">
      function func(){
           window.location = document.getElementById('link-box').value;
      }
 </script>

With onclick="func();"

Or

<script type="text/javascript">
       document.getElementById("search-button").onclick = function(){
            window.location = document.getElementById('link-box').value;  
       };        
 </script>

Or last of all

 <script type="text/javascript">
       document.getElementById("search-button").addEventListener("click", function(){
            window.location = document.getElementById('link-box').value;
       });
 </script>

Upvotes: 2

vunoo
vunoo

Reputation: 21

if you want to create a form that will search google use this:

<script type="text/javascript">
function dos12(g1) {
window.open('https://www.google.com/#q='+g1 +" site:linkedin.com",      'G1window');
}

      </script>
  <form onsubmit="dos12(this.g1.value); return false;">
    <input type="text" name="g1" size="20" placeholder="Name" />
            <input type="submit" value="Submit" />
    Search Linkedin via Google<br />
    <br />
  </form>

If you want to search a website then you will need to get the search string used. for example, if you want to search the ABN lookup site for Australia you would use the following code.

<script type="text/javascript">
function dos10(a1) {
window.open('http://abr.business.gov.au/SearchByName.aspx?SearchText=' + a1,   'a1window');
}

      </script>
  <form onsubmit="dos10(this.a1.value); return false;">
    <input type="text" name="a1" size="20" placeholder="Name" />
            <input type="submit" value="Submit" />
    ABN Lookup name<br />
    <br />
  </form>

hope this helps. you don't need to add anything else. Just copy and paste this into notepad or your code editor and save as test.html then open with browser to test it.

Upvotes: 2

Alex W
Alex W

Reputation: 38163

Try this JavaScript:

function goTo()
{
    location.href = document.getElementById('link_id').value;
}

and change the onclick in the HTML:

<input type='text' id='link_id'>
<input type='button' id='link' value='Search' onClick='javascript:goTo()'>

Edit:

If you want to follow the unobtrusive JavaScript way, you would move the onclick completely into your JavaScript code, and remove it in the HTML:

document.getElementById('link').onclick = function()
{
    location.href = document.getElementById('link_id').value;
};

Upvotes: 3

Related Questions