Submit a Form from Button Button Click

Submit a Form from Button Button Click

Hi,

I have below form:

  1. <form id="FormFounder" name="FormFounder">
  2.      <input id="uuid" name="uuid" type="hidden" value="">

  4.     <label for="FullName" style="color: red;">الاسم الثلاثي :</label><br />
  5.     <input id="TextFullname" name="TextFullname" type="text" name="FullName" style="width: 100%; font-family: 'Cairo', sans-serif;"><br /><br />

  7.     <label for="FullName" style="color: red;">تاريخ الميلاد :</label><br />
  8.     <input type="date" name="fname" style="width: 100%;"><br /><br />

  10.     <label for="FullName" style="color: red;">مكان الميلاد :</label><br />
  11.     <input type="text" name="fname" style="width: 100%; font-family: 'Cairo', sans-serif;"><br /><br />

  13.     <label for="FullName" style="color: red;">الجنسية :</label><br />
  14.     إماراتي<br /><br />

  16.     <label for="FullName" style="color: red;">الإمارة :</label><br />

  18.     <select  style="width: 100%; font-family: 'Cairo', sans-serif;">
  19.         <option value="02">أبوظبي</option>
  20.         <option value="04">دبي</option>
  21.         <option value="06A">الشارقة</option>
  22.         <option value="06B">عجمان</option>
  23.         <option value="06C">أم القيوين</option>
  24.         <option value="07">رأس الخيمة</option>
  25.         <option value="09">الفجيرة</option>
  26.     </select>

  28.     <br /><br />

  30.     <label for="FullName" style="color: red;">الديانة :</label><br />
  31.     مسلم<br /><br />

  33.     <label for="FullName" style="color: red;">الحالة الاجتماعية :</label><br />

  35.     <select  style="width: 100%; font-family: 'Cairo', sans-serif;">
  36.         <option value="S">أعزب</option>
  37.         <option value="M">متزوج</option>
  38.         <option value="D">مطلق</option>
  39.         <option value="W">أرمل</option>
  40.     </select>

  42.     <br /><br />

  44.     <label for="FullName" style="color: red;">مكان العمل :</label><br />
  45.     <input type="text" name="FullName" style="width: 100%; font-family: 'Cairo', sans-serif;"><br /><br />

  47.     <label for="FullName" style="color: red;">المهنة :</label><br />
  48.     <input type="text" name="FullName" style="width: 100%; font-family: 'Cairo', sans-serif;"><br /><br />

  50.     <label for="FullName" style="color: red;">الهاتف المتحرك :</label><br />
  51.     <input type="number" name="fname" style="width: 100%;"><br /><br />

  53.     <label for="FullName" style="color: red;">صندوق البريد :</label><br />
  54.     <input type="number" name="fname" style="width: 100%;"><br /><br />

  56.     <label for="FullName" style="color: red;">رقم الجواز :</label><br />
  57.     <input type="number" name="fname" style="width: 100%;"><br /><br />

  59.     <label for="FullName" style="color: red;">الرقم الموحد :</label><br />
  60.     <input type="number" name="fname" style="width: 100%;"><br /><br />

  62.     <label for="FullName" style="color: red;">رقم الهوية :</label><br />
  63.     <label id="FounderEmiratesID" name="FounderEmiratesID"></label><br /><br />

  65.     <label for="FullName" style="color: red;">المؤهل العلمي :</label><br />
  66.     <input type="text" name="FullName" style="width: 100%; font-family: 'Cairo', sans-serif;"><br /><br />

  68.     <label for="FullName" style="color: red;">البريد الالكتروني :</label><br />
  69.     <input id="TextEmailAddress" name="TextEmailAddress" type="text" name="email" style="width: 100%;"><br /><br />

  71.     <label class="myLabel">
  72.         <input type="file" required accept="image/*" />
  73.         <span>صورة شخصية</span>
  74.     </label>

  76.     <br /><br />

  78.     <label class="myLabel">
  79.         <input type="file" required accept="image/*" />
  80.         <span>صورة الجواز</span>
  81.     </label>

  83.     <br /><br />

  85.     <label class="myLabel">
  86.         <input type="file" required accept="image/*" />
  87.         <span>صورة بطاقة الهوية</span>
  88.     </label>

  90.     <br /><br />

  92.     <img id="ImageSaveLoading" src="https://www.angelsemirates.com//images/loading.gif" alt="جمعية الإمارات للمستثمرين المبادرين" style="display: block; width: 60px; height: 60px; margin: 0 auto; text-align: center; display: none;" />
  93.     <button id="ButtonSave" name="ButtonSave" type="button" style="width: 100%; font-family: 'Cairo', sans-serif;">حفظ</button><br /><br />
  94. </form>


then I am using the Click event this way:

  1. $("#ButtonSave").click(function()
  2. {
  3.     // e.preventDefault();

  5.     if(!$("#TextFullname").val())
  6.     {
  7.       alert('Please enter your full name!');
  8.       return false;
  9.     }

  11.     var email_regex = new RegExp('^784[0-9]{4}[0-9]{7}[0-9]{1}$');

  13.     if (!email_regex.test($("#TextEmailAddress").val()))
  14.     {
  15.         alert('Wrong Email Address!');
  16.         return false;                
  17.     }

  19.     // alert('Thank you');

  21.     $.ajax({
  22.         method: "POST",
  23.         url: "https://www.angelsemirates.com/save_founder_details.php",
  24.         data: $("#FormFounder").serialize(),
  25.         dataType: "json",
  26.       beforeSend: function( xhr )
  27.       {
  28.             $("#ButtonSave").hide();
  29.             $("#ImageSaveLoading").show();
  30.       }
  31.     })
  32.       .done(function( data )
  33.      {
  34.         // console.log(data[0]);

  36.         alert('Thank you');
  37.     });
  38. });


but it is not submitting anything..

Do I need to use form submit in this case? or there is a way to submit a form from within a button click?

kindly advise....


Thanks,
Jassim