Javascript нажатие на кнопку не вызывает функцию - PullRequest
Новая
       0

Javascript нажатие на кнопку не вызывает функцию

0 голосов
/ 05 апреля 2020

Решение: я удалил $(document).ready(function(){ ... }); в начале и в конце -part. Спасибо всем!

Я не могу понять свою ошибку.

У меня есть кнопка в html:

<button type="button" name="booking_btn" id="id_booking_btn" class="btn btn-xs btn-success btn_place_booking">Raum buchen</button>

и javascript: 

$(document).on('click', 'btn_place_booking', function(){ 
    alert("YES!");
    prepare_booking();
});

Предупреждение не будет отображаться.

Это мой полный код: 

<?php
include_once 'load_db.php';
$sql = "SELECT * FROM meetingrooms WHERE id = '".$_POST["room_id"]."' ";  
$result = mysqli_query($mysqli, $sql); 
$result = mysqli_fetch_array($result);

$startdate_f = strtotime($_POST["startdate"]);
$startdate_f = date("d.m.Y", $startdate_f);
$enddate_f = strtotime($_POST["enddate"]);
$enddate_f = date("d.m.Y", $enddate_f);
?>


  <html>

  <head>
    <link rel="stylesheet" href="housekeeping/scripts/bootstrap.min.css" />
    <script src="housekeeping/scripts/bootstrap.min.js"></script>
    <script src="housekeeping/scripts/jquery.min.js"></script>

  </head>

  <body>

    <table>
      <tr>
        <td>
          Raumname:
        </td>
        <td>
          <?php echo $result["displayname"]; ?>
        </td>
      </tr>

      <tr>
        <td>
          Beginn:
        </td>
        <td>
          <?php echo $startdate_f.", ".$_POST["start_time_h"].":".$_POST["start_time_m"] ; ?>
        </td>
      </tr>

      <tr>
        <td>
          Ende:
        </td>
        <td>
          <?php echo $enddate_f.", ".$_POST["end_time_h"].":".$_POST["end_time_m"] ; ?>
        </td>
      </tr>

      <tr>
        <td>
          Plätze:
        </td>
        <td>
          <?php echo $result["seats"]; ?>
        </td>
      </tr>

      <tr>
        <td>
          Etage:
        </td>
        <td>
          <?php echo $result["floor"]; ?>
        </td>
      </tr>

      <tr>
        <td>
          Bereich:
        </td>
        <td>
          <?php echo $result["floor_area"]; ?>
        </td>
      </tr>

      <tr>
        <td>
          Raumnummer:
        </td>
        <td>
          <?php echo $result["room_number"]; ?>
        </td>
      </tr>



    </table>

    <br><br>
    <button type="button" name="booking_btn" id="id_booking_btn" class="btn btn-xs btn-success btn_place_booking">Raum buchen</button>

  </body>

  </html>

  <script>
    $(document).ready(function() {

          function prepare_booking() {
            alert("Klick erkannt!prepare booking");
            var room_id = $_POST["room_id"];
            var start_date = $_POST["start_date"];
            var end_date = $_POST["end_date"];
            var owner = $_POST["owner"];
            var catering = 0;

            var_dump($_POST);

            place_booking(room_id, start_date, end_date, owner, catering);

          }


          $(document).on('click', 'btn_place_booking', function() {
            alert("YES!");
            prepare_booking();
          });

          function place_booking(room_id, start_date, end_date, owner, catering) {
            {
              $.ajax({
                url: "place_booking.php",
                method: "POST",
                data: {
                  id: id,
                  room_id: room_id,
                  start_date: start_date,
                  end_date: end_date,
                  owner: owner,
                  seats: seats,
                  catering: catering
                },
                dataType: "text",
                success: function(data) {
                  alert(data);
                  fetch_data(start_date, end_date, seats, "%")
                }
              });
            }


          });
  </script>

Ответы [ 3 ]

0 голосов
/ 05 апреля 2020

Я считаю, что ваша проблема в том, что вы пытаетесь смешать код PHP и Javascript, когда пытаетесь присвоить значения переменной: 

var room_id = $_POST["room_id"]

Это приведет к ошибке, которая предотвратит Javascript от загрузки, таким образом, ничего, что вы определяете в скриптах, не будет работать. Вы не можете просто ссылаться на PHP переменные, подобные этим, вам нужно отображать их значения, как вы делаете, когда вы смешиваете PHP и HTML код: 

var room_id = <?= $_POST["room_id"] ?>

Обратите внимание, что <?= просто сокращение для <?php echo.

У вас также есть синтаксическая ошибка в Javascript, когда вы открыли скобку для функции place_booking: 

function place_booking(room_id, start_date, end_date, owner, catering){
{
0 голосов
/ 05 апреля 2020

Ваш код требует серьезной работы. Причина, по которой ваше предупреждение не срабатывает, заключается в различных ошибках в вашем коде, tokens, которые не нравятся сценарию. Теги <? в сценарии генерируют ошибки в фрагменте JS, поэтому я пропустил их в целях тестирования. , Добавление кода php в теги сценария не является хорошим способом передачи информации из записи в сценарий, я бы go предложил решение AJAX, поэтому вам, вероятно, придется переделать вашу функцию prepare_booking(). У вас также был дополнительный токен {, который также не понравился сценарию.

* Если в вашем скрипте есть ошибки, скрипт не запустится и предупреждение не сработает.

Это похоже на срабатывание предупреждения, хотя я уверен, что оно не включает решения для всех ваших проблем. 

$(document).ready(function() {

      function prepare_booking() {
        alert("Klick erkannt!prepare booking");
        var room_id ='';
        var start_date ='';
        var end_date ='';
        var owner ='';
        var catering = 0;

        place_booking(room_id, start_date, end_date, owner, catering);

      }


      $('#id_booking_btn').click(function() {
        alert("YES!");
        prepare_booking();
      });

      function place_booking(room_id, start_date, end_date, owner, catering) 
        {
          $.ajax({
            url: "place_booking.php",
            method: "POST",
            data: {
              id: id,
              room_id: room_id,
              start_date: start_date,
              end_date: end_date,
              owner: owner,
              seats: seats,
              catering: catering
            },
            dataType: "text",
            success: function(data) {
              alert(data);
              fetch_data(start_date, end_date, seats, "%")
            }
          });
        }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>



<table>
  <tr>
    <td>
      Raumname:
    </td>
    <td>
      <?php echo $result["displayname"]; ?>
    </td>
  </tr>

  <tr>
    <td>
      Beginn:
    </td>
    <td>
      <?php echo $startdate_f.", ".$_POST["start_time_h"].":".$_POST["start_time_m"] ; ?>
    </td>
  </tr>

  <tr>
    <td>
      Ende:
    </td>
    <td>
      <?php echo $enddate_f.", ".$_POST["end_time_h"].":".$_POST["end_time_m"] ; ?>
    </td>
  </tr>

  <tr>
    <td>
      Plätze:
    </td>
    <td>
      <?php echo $result["seats"]; ?>
    </td>
  </tr>

  <tr>
    <td>
      Etage:
    </td>
    <td>
      <?php echo $result["floor"]; ?>
    </td>
  </tr>

  <tr>
    <td>
      Bereich:
    </td>
    <td>
      <?php echo $result["floor_area"]; ?>
    </td>
  </tr>

  <tr>
    <td>
      Raumnummer:
    </td>
    <td>
      <?php echo $result["room_number"]; ?>
    </td>
  </tr>



</table>

<br><br>
<button type="button" name="booking_btn" id="id_booking_btn" class="btn btn-xs btn-success btn_place_booking">Raum buchen</button>
0 голосов
/ 05 апреля 2020

Вы должны добавить обработчик событий .on к кнопке. не документ. 

$('.btn_place_booking').on('click', function(){ 
  alert("YES!");
  prepare_booking();
});

Кроме того, Jquery имеет функцию semanti c для кликов: element.click()

$('.btn_place_booking').click(function(){ 
  alert("YES!");
  prepare_booking();
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...