title: Multi button not working in html webform, when click show button it is submitting
body: <p>In the below HTML code we have two div, one is visible when we open the form, and another has to be visible when we click the &quot;show&quot; button and we have another button &quot;submit&quot; .</p>
  <p>but, when I'm clicking the &quot;show&quot; button it is submitting the data. when I'm clicking the &quot;Submit&quot; button it is submitting the data.</p>
  <p>All I need is when I click &quot;show&quot; it will show the data of  and when I click submit it will submit the data.</p>
  <pre><code>     &lt;!DOCTYPE html&gt;
          &lt;html&gt;
            &lt;body style=&quot;background-color:lightgrey;&quot;&gt;
                
            &lt;head&gt;
              &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.5&quot;&gt;
              &lt;base target=&quot;_top&quot;&gt;
            
            &lt;/head&gt;
            
            &lt;body&gt;
          &lt;h1&gt;Internal Order Form&lt;/h1&gt;
          &lt;form id=&quot;myform&quot; &gt;
              &lt;div&gt;
              &lt;label for=&quot;Product1&quot;&gt;Product01   :&lt;/label&gt;
              &lt;select id=&quot;Product1&quot; style=&quot;width: 100px;&quot;  name=&quot;Product1&quot; required &gt;
              &lt;option value=&quot;&quot; style=&quot;display:none;&quot;&gt;&lt;/option&gt;  
              &lt;option value=&quot;Cow_Milk_Items&quot;&gt;Cow Milk Items&lt;/option&gt;
              &lt;option value=&quot;Buffalo_Milk_Items&quot;&gt;Buffalo Milk Items&lt;/option&gt;
              &lt;option value=&quot;Dry_Items&quot;&gt;Dry Items&lt;/option&gt;
              &lt;/select&gt;
             
          
                &lt;label&gt;Item Name01 :
                &lt;input list=&quot;Item_Name1&quot; style=&quot;width: 100px;&quot; name=&quot;Item_Name1&quot; /&gt;&lt;/label&gt;
                &lt;datalist id=&quot;Item_Name1&quot; &gt;
                &lt;option value=&quot;&quot; style=&quot;display:none;&quot;&gt;&lt;/option&gt; 
                  &lt;?!= getVendors(); ?&gt;
                &lt;/datalist&gt;
          
              
              
          
              Qty01   :
              &lt;input type=&quot;Number&quot; name=&quot;Qty1&quot; style=&quot;width: 100px;&quot;  &gt; 
          
              &lt;label for=&quot;KG_PC1&quot;&gt;KG/PC   :&lt;/label&gt;
              &lt;select id=&quot;KG_PC1&quot; name=&quot;KG_PC1&quot;&gt;
              &lt;option value=&quot;&quot; style=&quot;display:none;&quot;&gt;&lt;/option&gt;  
              &lt;option value=&quot;KG&quot;&gt;KG&lt;/option&gt;
              &lt;option value=&quot;PC&quot;&gt;PC&lt;/option&gt;
              &lt;/select&gt;
          
              Rate01   :
              &lt;input type=&quot;Number&quot; name=&quot;Rate1&quot; id=&quot;Number&quot; style=&quot;width: 100px;&quot;  &gt; 
          
             
              Size01   :
              &lt;input type=&quot;text&quot; name=&quot;Size1&quot; id=&quot;Size1&quot; style=&quot;width: 100px;&quot;  &gt; 
             
                
              Order No.01   :
              &lt;input type=&quot;Number&quot; name=&quot;Order_No1&quot; id=&quot;Order_No1&quot; style=&quot;width: 100px;&quot;  &gt; 
              
             
              
             &lt;br&gt;
              &lt;label for=&quot;Product2&quot;&gt;Product02   :&lt;/label&gt;
              &lt;select id=&quot;Product2&quot; style=&quot;width: 100px;&quot;  name=&quot;Product2&quot; &gt;
              &lt;option value=&quot;&quot; style=&quot;display:none;&quot;&gt;&lt;/option&gt;  
              &lt;option value=&quot;Cow_Milk_Items&quot;&gt;Cow Milk Items&lt;/option&gt;
              &lt;option value=&quot;Buffalo_Milk_Items&quot;&gt;Buffalo Milk Items&lt;/option&gt;
              &lt;option value=&quot;Dry_Items&quot;&gt;Dry Items&lt;/option&gt;
              &lt;/select&gt;
             
              &lt;label&gt;Item Name02 :
                &lt;input list=&quot;Item_Name2&quot; style=&quot;width: 100px;&quot; name=&quot;Item_Name2&quot; /&gt;&lt;/label&gt;
                &lt;datalist id=&quot;Item_Name2&quot; &gt;
                &lt;option value=&quot;&quot; style=&quot;display:none;&quot;&gt;&lt;/option&gt; 
                  &lt;?!= getVendors(); ?&gt;
                &lt;/datalist&gt;
              
          
          
              
              Qty02   :
              &lt;input type=&quot;Number&quot; name=&quot;Qty2&quot; style=&quot;width: 100px;&quot;  &gt; 
          
              &lt;label for=&quot;KG_P&quot;&gt;KG/PC   :&lt;/label&gt;
              &lt;select id=&quot;KG_PC2&quot; name=&quot;KG_PC2&quot;&gt;
              &lt;option value=&quot;&quot; style=&quot;display:none;&quot;&gt;&lt;/option&gt;  
              &lt;option value=&quot;KG&quot;&gt;KG&lt;/option&gt;
              &lt;option value=&quot;PC&quot;&gt;PC&lt;/option&gt;
              &lt;/select&gt;
          
              Rate02   :
              &lt;input type=&quot;Number&quot; name=&quot;Rate2&quot; id=&quot;Number&quot; style=&quot;width: 100px;&quot;  &gt; 
          
             
              Size02   :
              &lt;input type=&quot;text&quot; name=&quot;Size2&quot; id=&quot;Size2&quot; style=&quot;width: 100px;&quot;  &gt; 
             
                
              Order No.02   :
              &lt;input type=&quot;Number&quot; name=&quot;Order_No2&quot; id=&quot;Order_No2&quot; style=&quot;width: 100px;&quot;  &gt; 
             &lt;br&gt;
             &lt;/div&gt;
             
          
             &lt;div id=&quot;myDIV&quot; style=&quot;display: none;&quot;&gt;
             &lt;label for=&quot;Product3&quot;&gt;Product03   :&lt;/label&gt;
              &lt;select id=&quot;Product3&quot; style=&quot;width: 100px;&quot;  name=&quot;Product3&quot; &gt;
              &lt;option value=&quot;&quot; style=&quot;display:none;&quot;&gt;&lt;/option&gt;  
              &lt;option value=&quot;Cow_Milk_Items&quot;&gt;Cow Milk Items&lt;/option&gt;
              &lt;option value=&quot;Buffalo_Milk_Items&quot;&gt;Buffalo Milk Items&lt;/option&gt;
              &lt;option value=&quot;Dry_Items&quot;&gt;Dry Items&lt;/option&gt;
              &lt;/select&gt;
             
             
             &lt;label&gt;Item Name03 :
                &lt;input list=&quot;Item_Name3&quot; style=&quot;width: 100px;&quot; name=&quot;Item_Name3&quot; /&gt;&lt;/label&gt;
                &lt;datalist id=&quot;Item_Name3&quot; &gt;
                &lt;option value=&quot;&quot; style=&quot;display:none;&quot;&gt;&lt;/option&gt; 
                  &lt;?!= getVendors(); ?&gt;
                &lt;/datalist&gt;
          
              Qty03   :
              &lt;input type=&quot;Number&quot; name=&quot;Qty3&quot; style=&quot;width: 100px;&quot;  &gt; 
          
              &lt;label for=&quot;KG_PC&quot;&gt;KG/PC   :&lt;/label&gt;
              &lt;select id=&quot;KG_PC3&quot; name=&quot;KG_PC3&quot;&gt;
              &lt;option value=&quot;&quot; style=&quot;display:none;&quot;&gt;&lt;/option&gt;  
              &lt;option value=&quot;KG&quot;&gt;KG&lt;/option&gt;
              &lt;option value=&quot;PC&quot;&gt;PC&lt;/option&gt;
              &lt;/select&gt;
          
              Rate03   :
              &lt;input type=&quot;Number&quot; name=&quot;Rate3&quot; id=&quot;Number&quot; style=&quot;width: 100px;&quot;  &gt; 
          
             
              Size03   :
              &lt;input type=&quot;text&quot; name=&quot;Size3&quot; id=&quot;Size3&quot; style=&quot;width: 100px;&quot;  &gt; 
             
                
              Order No.03   :
              &lt;input type=&quot;Number&quot; name=&quot;Order_No3&quot; id=&quot;Order_No3&quot; style=&quot;width: 100px;&quot;  &gt; 
              
              &lt;br&gt;
          
              &lt;label for=&quot;Product4&quot;&gt;Product04   :&lt;/label&gt;
              &lt;select id=&quot;Product4&quot; style=&quot;width: 100px;&quot;  name=&quot;Product4&quot; &gt;
              &lt;option value=&quot;&quot; style=&quot;display:none;&quot;&gt;&lt;/option&gt;  
              &lt;option value=&quot;Cow_Milk_Items&quot;&gt;Cow Milk Items&lt;/option&gt;
              &lt;option value=&quot;Buffalo_Milk_Items&quot;&gt;Buffalo Milk Items&lt;/option&gt;
              &lt;option value=&quot;Dry_Items&quot;&gt;Dry Items&lt;/option&gt;
              &lt;/select&gt;
             
          
             &lt;label&gt;Item Name04 :
                &lt;input list=&quot;Item_Name4&quot; style=&quot;width: 100px;&quot; name=&quot;Item_Name4&quot; /&gt;&lt;/label&gt;
                &lt;datalist id=&quot;Item_Name4&quot; &gt;
                &lt;option value=&quot;&quot; style=&quot;display:none;&quot;&gt;&lt;/option&gt; 
                  &lt;?!= getVendors(); ?&gt;
                &lt;/datalist&gt;
          
              
          
              Qty04   :
              &lt;input type=&quot;Number&quot; name=&quot;Qty4&quot; style=&quot;width: 100px;&quot;  &gt; 
          
              &lt;label for=&quot;KG_PC&quot;&gt;KG/PC   :&lt;/label&gt;
              &lt;select id=&quot;KG_PC4&quot; name=&quot;KG_PC4&quot;&gt;
              &lt;option value=&quot;&quot; style=&quot;display:none;&quot;&gt;&lt;/option&gt;  
              &lt;option value=&quot;KG&quot;&gt;KG&lt;/option&gt;
              &lt;option value=&quot;PC&quot;&gt;PC&lt;/option&gt;
              &lt;/select&gt;
          
              Rate04   :
              &lt;input type=&quot;Number&quot; name=&quot;Rate4&quot; id=&quot;Number&quot; style=&quot;width: 100px;&quot;  &gt; 
          
             
              Size04   :
              &lt;input type=&quot;text&quot; name=&quot;Size4&quot; id=&quot;Size4&quot; style=&quot;width: 100px;&quot;  &gt; 
             
                
              Order No.04   :
              &lt;input type=&quot;Number&quot; name=&quot;Order_No4&quot; id=&quot;Order_No4&quot; style=&quot;width: 100px;&quot;  &gt; 
             &lt;/div&gt; 
            
           
             &lt;button onclick=&quot;myFunction()&quot;&gt;Show More&lt;/button&gt;
             &lt;button id=&quot;butn&quot; &gt;Submit&lt;/button&gt;
             
          
              &lt;/form&gt;
              &lt;script&gt;
             function myFunction() {
            var x = document.getElementById(&quot;myDIV&quot;);
            if (x.style.display === &quot;none&quot;) {
              x.style.display = &quot;visible&quot;;
            } 
          }
          
          
            document.querySelector(&quot;#myform&quot;).addEventListener(&quot;submit&quot;, 
            function(e) {
              e.preventDefault();
              google.script.run.withSuccessHandler(resetForm)
                               .addNewItem(this);
            });
            
            function resetForm() {
              document.querySelector(&quot;#myform&quot;).reset();
            alert(&quot;Order Submited&quot;)
            }
           
          &lt;/script&gt;
           &lt;/body&gt;
          &lt;/html&gt;
  </code></pre>