title: How to add a second button to the react form that not execute the first button handler function?
body: <p>I have an React form.
  This form have a button.
  This is the submit button.
  If i click this button execute the first function (submitHandler)which pointer is on the form.</p>
  <p>I want add a second button to the form the &quot;back button&quot;.
  This button should execute an other function but not the first function</p>
  <p>Both button should be on the same form</p>
  <p>Form.js</p>
  <pre><code>import React, { useState } from &quot;react&quot;;
  import &quot;./Form.css&quot;;
  
  const Form = (props) =&gt; {
    const submitHandler = (event) =&gt; {
      event.preventDefault();
      console.log('Some console log now from Submit Hanlder')
    };
  
    const secondFunction = event =&gt;{
    
      console.log('Some other console log')
    }
  
    return (
      &lt;form onSubmit={submitHandler}&gt;
        &lt;div className=&quot;new-expense__controls&quot;&gt;
          &lt;div className=&quot;new-expense__control&quot;&gt;
            &lt;label&gt;Title&lt;/label&gt;
            &lt;input type=&quot;text&quot; /&gt;
          &lt;/div&gt;
          &lt;div className=&quot;new-expense__control&quot;&gt;
            &lt;label&gt;Amount&lt;/label&gt;
            &lt;input type=&quot;number&quot; /&gt;
          &lt;/div&gt;
          &lt;div className=&quot;new-expense__control&quot;&gt;
            &lt;label&gt;Date&lt;/label&gt;
            &lt;input type=&quot;date&quot; /&gt;
          &lt;/div&gt;
          &lt;div className=&quot;new-expense__actions&quot;&gt;
            &lt;button type=&quot;submit&quot;&gt;Submitting&lt;/button&gt;
            &lt;buton&gt;Second button....&lt;/buton&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/form&gt;
    );
  };
  
  export default Form;
  </code></pre>