Back

Technologies:

javascriptjavascript
phpphp
avatar
Tolerim
21 hours ago

How can I resolve the problem of transferring data to a modal and retrieving it using a MySQL query?

The issue I am facing is that the tblmedicalhistory table in phpmyadmin contains the toothno, but when I click the button, the modal opens only for toothno 2 instead of the selected toothno like 1 or 3. Currently, my SQL query is "$toothno = $GET['toothno'];" but it doesn't seem to be fetching the correct toothno when passed from the JavaScript code. The toothno is obtained from the "data-number" attribute in the openmodal button. I believe that modifying this line of code will resolve the issue. Here's the code snippet:
<a class="dropdown-item" href="#" data-id="2" data-number="2" data-toggle="modal" data-target="#customModal1">Enable Administration</a>
<!--Modal To show -->
<!-- Modal -->
<div class="modal fade" id="customModal1" tabindex="-1" role="dialog" aria-labelledby="customModalLabel1" aria-hidden="true">
  <div class="modal-dialog modal-xl" role="document">
    <div class="modal-content">
      <div class="modal-body">
        <h5 class="modal-title" id="customModalLabel1">عرض الاعمال للسن رقم <span id="modalNumberSpan"></span></h5>
        <hr>
        <div id="modalContent">
          <?php
          $toothno = $GET['tooth_no'];
          $ret = mysqliquery($con, "SELECT * FROM tblmedicalhistory WHERE toothno = '$tooth_no' AND PatientID = '$vid'");

          if (!$ret) {
            $errormessage = mysqlierror($con);
            echo "Query Error: " . $error_message;
          }

          if (mysqlinumrows($ret) > 0) {
            $cnt = 1;
            echo '<table id="datatable" class="table table-bordered dt-responsive nowrap" style="border-collapse: collapse; border-spacing: 0; width: 100%;">';
            echo '<tr>';
            echo '<th>#</th>';
            echo '<th>نوع العمل</th>';
            echo '<th>طريقة الدفع</th>';
            echo '<th>المبلغ ( ليرة تركي )</th>';
            echo '<th>العلاج الموصى به</th>';
            echo '<th>الصورة البانورامية</th>';
            echo '<th>تاريخ العمل</th>';
            echo '<th colspan="2">الاعدادات</th>';
            echo '</tr>';

            while ($row = mysqlifetchassoc($ret)) {
              echo '<tr>';
              echo '<td>' . $cnt . '</td>';
              echo '<td>' . $row['work_type'] . '</td>';

              $paymentMethod = $row['payment_method'];
              if ($paymentMethod == 1) {
                echo '<td class="bg-success">كاش</td>';
              } elseif ($paymentMethod == 2) {
                echo '<td class="bg-success">حساب بنكي</td>';
              } elseif ($paymentMethod == 3) {
                echo '<td class="bg-success">آجل</td>';
              } else {
                echo '<td class="bg-success">غير معروف</td>';
              }

              echo '<td>' . $row['price'] . '</td>';
              echo '<td>' . $row['wokrs_history'] . '</td>';
              echo '<td>';
              echo '<div class="tz-gallery image-container">';
              echo '<a class="lightbox" href="' . $row['ax_tomography'] . '">';
              echo '<img src="' . $row['ax_tomography'] . '" alt="HEDEF KARŞIYAKA" style="width:200px !important;height:100px !important;">';
              echo '<div class="image-text">';
              echo '<button type="button" class="btn btn-primary">مشاهدة</button>';
              echo '</div>';
              echo '</a>';
              echo '</div>';
              echo '</td>';
              echo '<td>' . $row['CreationDate'] . '</td>';
              echo '<td><a href="edit-patient-works.php?editid=' . $row['ID'] . '&PatientID=' . $row['PatientID'] . '&toothno=' . $row['toothno'] . '"><i class="fa fa-edit"></i> تعديل</a></td>';
              echo '<td>حذف</td>';
              echo '</tr>';
              $cnt++;
            }

            echo '</table>';
          } else {
            echo '<p>No data available.</p>';
          }
        ?>

        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">اغلاق</button>
      </div>
    </div>
  </div>
</div>

<script>
  $(document).on('click', '.dropdown-item[data-target="#customModal1"]', function(e) {
    e.preventDefault();
    var tooth_no = $(this).data('number');
    $('#customModalLabel1').html('عرض الاعمال للسن رقم ' + tooth_no);

    $.ajax({
      url: 'view-patient.php',
      type: 'POST',
      data: {
        toothno: toothno
      },
      success: function(response) {
        $('#modalContent').html(response);
        $('#customModal1').modal('show');
      },
      error: function() {
        $('#modalContent').html('<p>Error fetching data.</p>');
        $('#customModal1').modal('show');
      }
    });
  });
</script>

                  <!--/Modal To show -->
Answers(1)
avatar
Tolerim
21 hours ago
Verified Answer
Yes, you are correct. The $tooth_no variable is not getting the value from the data-number attribute of the button. Instead, it is trying to fetch the value from the query string parameter tooth_no using $_GET. To fix this issue, you need to update the PHP code to fetch the tooth_no value from the AJAX request data. Here's how you can do it:
// Retrieve the tooth number from the AJAX request
$tooth_no = $_POST['tooth_no'];

// Prepare the SQL query to fetch the data based on the tooth number and PatientID
$ret = mysqli_query($con, "SELECT * FROM tblmedicalhistory WHERE tooth_no = '$tooth_no' AND PatientID = '$vid'");
By updating $_GET to $_POST and fetching the value from the tooth_no key, it will correctly get the value from the AJAX request data.
;