如何处理多个表单？，在提交时停止重新加载页面？

Question

1. First form is where client can get all products by Make Model and Price as radio button with value of there id in database

2. Client click submit.

3. PHP ask isset name of submit button

4. If isset it echos second form where client can add specifications for product that he or she choose. Form is input type text and textarea's

5. Then php ask isset name of submit button for second form

but the problem is when client press submit for second form

If first form is unset then the rest of code should check that second form don't exist because both forms most exit for code to work and I can get that, if I don't find away to stop page reload on submit

I try using AJAX but the MySQL query throws an error that inputs are empty.

JavaScript code:

<script>
$( document ).ready(function() {
  $('.link').click(function(){
    $.post('ajax1.php?strana='+$(this).attr('strana'), function(odgovor) {
      $('#odgovor').html(odgovor);
    });
  });
});
</script>

PHP code:

echo  "<div class='container' id='cars'>
     <div class='row'>
      <div class='col-md-4 col-md-offset-4 text-center'>
        <form action='' method='post' class='loginForm' id='cmsC' name='cmsC' enctype='multipart/form-data'>
          <div class='input-group'>";
            $sql="select * from produkt ";
            $rez=mysqli_query($db,$sql);
            while($red = mysqli_fetch_object($rez))
            {
            echo "<input type='radio' name='proizvod' value='$red->id'> ". $red->marka." ". $red->naziv." ". $red->cena."<br>";
          }
          echo "<input type='submit' id='btnsubmit1' name='btnsubmit1' class='form-control' value='Chouse Product'  >
        </div>
      </form>
    </div>
  </div>
</div>";

if (isset($_POST['btnsubmit1'])) {
  $id = $_POST['proizvod']; 

  echo "<div class='container'>
  <div class='row'>
    <div class='col-md-4 col-md-offset-4 text-center'>
      <form action='' method='post' class='loginForm' id='cms' name='cms' enctype='multipart/form-data'>
        <div class='input-group clear'>
          <input type='text' id='dotm' name='dotm' class='form-control'
          placeholder='Description Of The Motherboard ( ASUS H81M-R/C/SI )'>

          <input type='text' id='top' name='top' class='form-control'
          placeholder='Type Of Processor ( Intel® Core™ i3 Processor )'>"; // there is bunch more of this type for input type  

          if (isset($_POST['submit'])) {
                  // Variable with data from form
                  $description_of_the_motherboard = $_POST['dotm'];
                  $type_of_processor = $_POST['top'];
                  $processor_description = $_POST['pd'];
                  $type_of_graphics_card = $_POST['togc'];

                  if(strlen($description_of_the_motherboard)!="") {
                    if(!preg_match("/[^\w\s,.\\\'\"\-\/]/", $description_of_the_motherboard) {
                      $sql = "insert query";
                      mysqli_query($db, $sql); 

                  } else echo "<script> 

                    alert('Your input can not have special characters '); 

                  </script>"; 
            }             
          } 
}

Answer 1

Just add a flag to avoid duplicate requests.

Example:

$( document ).ready(function() {
  var iAmProcessing = false;
  $('.link').click(function(){
    if (iAmProcessing === true) {
      return;
    }
    iAmProcessing = true;
    $.post('ajax1.php?strana='+$(this).attr('strana'), function(odgovor) {
      iAmProcessing = false;
      $('#odgovor').html(odgovor);
    });
  });
});