HTML Form Action Search, One Text Box, 2 Buttons, 2 Possible Results

I am trying these days to do a search form that sends to two different pages with two different buttons with a single text box. So far I am doing this:

Copy

Solution 2:

Since you tried and failed a script, let's look at ways we can achieve this.

Using form

Be extremely wary of what you do here. It is easy to send a get request using form but it always "flushes" out the query strings already present in the action URL, and submits the request by adding name-value pairs in its child nodes. Make sure to create your query as a child node.

<input type="text" id="box" name="searchbox" maxlength="128" placeholder="Type text to be searched here" autofocus />
<input type="button" value="Youtube" onclick="search_youtube()"/>
<input type="button" value="Torrentz" onclick="search_torrentz()"/>
<script>
   function search_youtube(){
    var add="https://www.youtube.com/results";       
    var box = document.getElementById("box");
    box.name="search_query"
    if(box.value)
    {
        var form = open().document.createElement("form");
        form.action=add;
        form.appendChild(box.cloneNode(false))
        form.submit();
    }
   } 

  function search_torrentz(){
    var add="https://www.torrentz.com/search";             
    var box = document.getElementById("box");
    box.name="q"
    if(box.value)
    {
        var form = open().document.createElement("form");
        form.action=add;
        form.appendChild(box.cloneNode(false))
        form.submit();
    }
  }
</script>

Using HTML5 formaction attribute

<form action="https://www.youtube.com/results" method="GET">
    <input type="text" id="box" name="search_query" maxlength="128" placeholder="Type text to be searched here" autofocus />
    <input type="submit" value="Torrentz" formaction="https://www.torrentz.com/search" onclick="document.getElementById('box').name='q'" />
    <input type="submit" name="submit" value="Youtube" />
</form>