How to submit different forms with same input-CodePudding

Im trying to implement the "i'm feeling lucky" functionality in a quite simple web. The thing is that at first, without this button, the query was properly done (i mean when doing a normal search). But, when i included the im feeling lucky button, the normal search stopped working and know even when you click on norma search it goes directly to the firs result. im new to HTML and still lost regarding forms. Note that i cant do it using js cause its for an assignment meant to be done only with HTML.

Thanks a lot for your help :D

<a href="image.html">Image</a>
<a href="advanced.html">Advanced</a>

<form action="https://www.google.com/search?">
  <div><input type="text" name="q" id="search"></div>
  <div>
    <input type="submit" value="Google Search" id="button">
    <form>
      <input type="hidden" name="btnI" value="1">
      <input type="submit" value="I'm feeling lucky" id="button">
    </form>
  </div>
</form>

CodePudding user response：

A few notes:

you have a form tag nested inside the other which is wrong.
you have two submit button with same id.

Remove these issues and it will work as desired.

CodePudding user response：

You cannot nest forms

You need two forms:

<a href="image.html">Image</a>
<a href="advanced.html">Advanced</a>

<form action="https://www.google.com/search?">
  <div><input type="text" name="q" id="search"></div>
  <div>
    <input type="submit" value="Google Search" id="button">
    <input type="hidden" name="btnI" value="1">
  </div>
</form>
<form action="https://www.google.com/search?"><input type="hidden" name="q" value="I'm feeling lucky"><button>I'm feeling lucky</button></form>

CodePudding user response：

As I see it, you want to have window inside another window, both of which will have buttons? In that case, don't go form inside form, make it div inside div and in both of them, enter a form, here's and example:

<div id="div1">
   <form action="https://www.google.com/search?">
     <input type="text" name="q" id="search">
     <input type="submit" value="Google Search" id="btn1" >
   </form>
   <div id="div2">
     <form action="https://www.google.com/search?">
       <input type="text" name="q2" id="search">
       <input type="submit" value="Google Search" id="btn2" >
     </form>
   </div>
</div>