通过Ajax将选项值发布到mysql无法正常工作

时间:2018-07-05 03:35:13

标签: php jquery ajax select option

我一直在从事一些项目,并在php和ajax,jquery上获得了一些经验。因此,我已经检查了20多个关于stackoverflow的问题,但是即使它已经回答了相同的问题,也找不到解决方案。

我尝试了10种不同的解决方案,但我想我正在跳过某些内容。 我有简单的选择框,我使用ajax发送mysql,但由于某些原因,只有选择框不起作用。

HTML代码:

     <section class="resume-section p-3 p-lg-5 d-flex flex-column" id="rezervasyon">
      <div class="my-auto">
        <h2 class="mb-5">Online Rezervasyon</h2>

        <form id="loginForm" method="" action="" novalidate="novalidate">
          <div class="form-group row">
            <label for="rez_ad" class="col-sm-2 col-form-label">İsim Soyisim</label>
            <div class="col-sm-10">
              <input type="text" class="form-control" name="rez_ad" id="rez_ad" placeholder="İsim Soyisim">
            </div>
          </div>
          <div class="form-group row">
            <label for="rez_saat" class="col-sm-2 col-form-label">Rezervasyon Saati</label>
            <div class="col-sm-10">
              <input type="text" class="form-control" name="rez_saat" id="rez_saat" placeholder="Rezervasyon saati">
            </div>
          </div>
          <div class="form-group row">
            <label for="rez_gsm" class="col-sm-2 col-form-label">Cep Numaranız</label>
            <div class="col-sm-10">
              <input type="number" class="form-control" name="rez_gsm" id="rez_gsm" placeholder="İletişim numaranız.">
            </div>
          </div>
          <div class="form-group row">
            <label for="rez_tarih" class="col-sm-2 col-form-label">Tarih</label>
            <div class="col-sm-10">
              <input type="date" class="form-control" name="rez_tarih" id="rez_tarih" placeholder="Tarih belirtiniz.">
            </div>
          </div>
          <div class="form-group row">
            <label for="rez_email" class="col-sm-2 col-form-label">Email</label>
            <div class="col-sm-10">
              <input type="email" class="form-control" name="rez_email" id="rez_email" placeholder="Email">
            </div>
          </div>
          <div class="form-group row">
           <label for="rez_tip" class="col-sm-2 col-form-label" name="rez_tip" id="rez_tip">Rezervasyon Tipi</label>
           <div class="col-sm-10">
            <select id="rez_tip" class="custom-select">

              <option value="" selected>Rezervasyon Tipi Seçiniz</option>
              <option value="1">Cuma Fix Menü</option>
              <option value="2">Cumartesi Fix Menü</option>
              <option value="3">Haftaiçi ALKOLSÜZ</option>
              <option value="4">Haftaiçi ALKOLLÜ</option>
              <option value="5">Kutlama / Doğum Günü</option>
              <option value="6">Diğer</option>
            </select>
          </div>
        </div>
        <div class="form-group row">
         <label for="rez_sayi" class="col-sm-2 col-form-label" id="rez_sayi" name="rez_sayi">Kişi Sayısı</label>
         <div class="col-sm-10">
          <select id="rez_sayi" class="custom-select">

            <option value="" selected>Kişi Sayısı Belirtiniz</option>
            <option value="1">2 Kişilik Rezervasyon</option>
            <option value="2">4 Kişilik Rezervasyon</option>
            <option value="3">4+ Kişilik Rezervasyon</option>
            <option value="4">6+ Kişilik Rezervasyon</option>
            <option value="5">8+ Kişilik Rezervasyon</option>
            <option value="6">20+ Kişilik Rezervasyon</option>
          </select>
        </div>

      </div>
      <textarea name="rez_aciklama" id="rez_aciklama" class="form-control" rows="6" cols="21" required="required"
      placeholder="Ek açıklama girebilirsiniz."></textarea>

      <form class="was-validated">
        <!-- Button trigger modal -->

        <!-- Modal -->
        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
          <div class="modal-dialog" role="document">
            <div class="modal-content">
              <div class="modal-header">
                <h5 class="modal-title text-center" id="exampleModalLabel">Modal title</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                  <span aria-hidden="true">&times;</span>
                </button>
              </div>


                <div class="divider"></div>
                <div class="right-side">
                  <button type="button" class="btn btn-danger btn-link">Delete</button>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="custom-control custom-checkbox mb-3">

          <input type="checkbox" class="custom-control-input" id="customControlValidation1" required>

          <label class="custom-control-label" for="customControlValidation1">Rezervasyon Şartlarını Kabul Ediyorum!</label>
          <div class="invalid-feedback">Rezervasyon şartlarını okuyunuz!</div>
        </div>

        <div class="form-group row">
          <div class="col-sm-10">
           <button type="button" class="btn btn-success" name="insert-data" id="insert-data" onclick="insertData()">Rezervasyonu Tamamla</button>

</div>
</div>
<br>
<p id="message"></p>
</form>

这是我的php文件;

    <?php

include('db.php');
$rez_ad=$_POST['rez_ad'];
$rez_saat=$_POST['rez_saat'];
$rez_gsm=$_POST['rez_gsm'];
$rez_tarih=$_POST['rez_tarih'];
$rez_tip=$_POST['rez_tip'];
$rez_sayi=$_POST['rez_sayi'];
$rez_aciklama=$_POST['rez_aciklama'];

$stmt = $DBcon->prepare("INSERT INTO student(rez_ad,rez_saat,rez_gsm,rez_tarih,rez_tip,rez_sayi,rez_aciklama) VALUES(:rez_ad, :rez_saat,:rez_gsm,:rez_tarih,:rez_tip,:rez_sayi,:rez_aciklama)");

$stmt->bindparam(':rez_ad', $rez_ad);
$stmt->bindparam(':rez_saat', $rez_saat);
$stmt->bindparam(':rez_gsm', $rez_gsm);
$stmt->bindparam(':rez_tarih', $rez_tarih);
$stmt->bindparam(':rez_tip', $rez_tip);
$stmt->bindparam(':rez_sayi', $rez_sayi);
$stmt->bindparam(':rez_aciklama', $rez_aciklama);
if($stmt->execute())
{
  $res="Data Inserted Successfully:";
  echo json_encode($res);
}
else {
  $error="Not Inserted,Some Probelm occur.";
  echo json_encode($error);
}



 ?>

这是我的jquery代码;

    function insertData() {
      var rez_ad=$("#rez_ad").val();
      var rez_saat=$("#rez_saat").val();
      var rez_gsm=$("#rez_gsm").val();
      var rez_tarih=$("#rez_tarih").val();
      var rez_tip=$("#rez_tip").val();
      var rez_sayi=$("#rez_sayi").val();
      var rez_aciklama=$("#rez_aciklama").val();


    // AJAX code to send data to php file.
    $.ajax({
      type: "POST",
      url: "rez/insert-data.php",
      data: {rez_ad:rez_ad,rez_saat:rez_saat,rez_gsm:rez_gsm,rez_tarih:rez_tarih,rez_tip:rez_tip,rez_sayi:rez_sayi,rez_aciklama:rez_aciklama},
      dataType: "JSON",
      success: function(data) {
       $("#message").html(data);
       $("p").addClass("alert alert-success");
     },
     error: function(err) {
      alert(err);
    }
    });

    }

感谢帮助!

1 个答案:

答案 0 :(得分:0)

然后您还应该在ajax调用中传递rez_tip选项。

<script type="text/javascript">

 function insertData() {
  //var rez_tip=$("#rez_tip option:selected").text();
  //var rez_sayi=$("#rez_sayi option:selected").text();
  var rez_tip=$("select#rez_tip").val();
  var rez_sayi=$("select#rez_sayi").val();


  // AJAX code to send data to php file.
    $.ajax({
        type: "POST",
        url: "rez/insert-data.php",
        data: {rez_sayi:rez_sayi,rez_tip:rez_tip},
        dataType: "JSON",
        success: function(data) {
         $("#message").html(data);
        $("p").addClass("alert alert-success");
        },
        error: function(err) {
        alert(err);
        }
    });

   }

 </script>