Problem with UI Dialog - model form. It submits a form automaticly

Problem with UI Dialog - model form. It submits a form automaticly

Hi guys
I have been working on this for 2 days now and I am almost done but i have a small issue.


so i have 2 forms as the following structure


  1. <form action=" this page " method="post">
  2. <button id="add-driver">Add a driver</button>  <!-- this button should open the dialog only -->
  3. <input type="submit" value="add" />
  4. </form>
  5. <form id="dialog">
  6. </form>


so the problem that i am having is that when i press the add-driver button the dialog opens with the form. but it also submits the first form!  so the dialog open for 1 second and then it closes and submits the first form!!!


When i put the code on a page by it self it works perfect with no issues! but when i put it along with the other form it does not work..

What could be the problem here??

thank