Почему мой вызов ajax отображает вывод в файле php, а не перенаправляет на html?

Question

Я написал серию функций ajax, которые извлекают данные из php-файла. Проблема заключается в том, что одна из функций перенаправляет данные в файл php для получения данных, но не возвращает их на страницу html для вставки данных.

В этом случае следующий код предназначен для получения таблицы из php-файла

  var display_results = $("#display_results").val();
  var url3 = "../server/insert_tests.php?analyses=";
     $.ajax({
          type: "GET", 
          url: url3 + display_results,           
          success: function(data) {
            $("#analyses").html(data);
          }
        });

И получает следующие данные из файла insert_tests.php:

if (isset($_GET['analyses'])) {
    require 'dbh.php';
    $id = $_GET['analyses'];

    $samples = "SELECT * FROM samples_database JOIN storage_database on samples_database.storage_location=storage_database.id WHERE samples_database.order_id=$id AND samples_database.micro_analysis<>'';";
    $result2 = mysqli_query($conn, $samples);

    $output3 = '';

    if (mysqli_num_rows($result2) > 0) {

        $output3 .= '
        <thead>
        <tr>
        <th>Sample Number</th>
        <th>Client ID</th>
        <th>Sample</th>
        <th>Storage</th>            
        <th>Status</th>
        <th>Time Stamp</th>   
        <th colspan="1"></th>            
        </tr>                           
        </thead>
        <tbody>';

        while ($row = mysqli_fetch_assoc($result2)) {

            $output3 .= '
            <tr> 
            <td>'.$row['env_sam_id'].'</td>
            <td>'.$row['c_sam_id'].'</td>
            <td>'.$row['sample_type'].'</td>
            <td>'.$row['storage_name'].'</td>            
            <td>'.$row['s_status'].'</td>
            <td>'.$row['s_date1'].' (<i>'.$row['s_time1'].'</i>)</td>   
            <td><a class="get_result edittablebtn show_submit_button" href="../server/insert_tests.php?query='.$row['sample_id'].'">Enter Results</a></td>                   
            </tr>';
        } 
        $output3 .= '</tbody>';
    } 
    echo $output3;
}

Это актуально, потому что я подозреваю, что это <a class="get_result edittablebtn show_submit_button" href="../server/insert_tests.php?query='.$row['sample_id'].'">Enter Results</a> вызывает проблему ниже по течению.

Таблица, созданная этой функцией, имеет различное количество строк, и нажатие на кнопку в таблице покажет информацию, относящуюся к данным в этой строке. Это делается с помощью этой функции:

   $('.get_result').click(function (event) { 
     event.preventDefault(); 

     var url = $(this).attr('href');

     $.ajax({
      url: url,
      type: "GET",
      success: function(data) {
        $("#tests").html(data);
      }
    });
   });

И получает следующие данные из того же insert_tests.php файла:

if (isset($_GET['query'])) {
    require 'dbh.php';

    $id = $_GET['query'];
    $query = "SELECT * FROM samples_database WHERE sample_id=$id;";
    $result = mysqli_query($conn, $query);
    $input = mysqli_fetch_array($result);
    $input1 = $input['micro_analysis'];
    $env_sam_id = $input['env_sam_id'];
    $c_sam_id = $input['c_sam_id'];
    $order_id = $input['order_id'];
    $rows = explode(',', $input1);

    if (count($rows) > 0 ) {
        $output .= '
        <thead>
        <tr>
        <th colspan="1"></th>
        <th>Tests ('.$env_sam_id.' <i>'.$c_sam_id.'</i>)</th>
        <th>Detected</th>
        <th>Result</th>
        </tr>
        </thead>
        <tbody>';
        foreach ($rows as $row) {
            $query2 = "SELECT * FROM microbiology_analysis_database WHERE id=$row"; 
            $result2 = mysqli_query($conn, $query2);
            $input2 = mysqli_fetch_array($result2);
            $analysis = $input2['m_analysis'];


            $query3 = "SELECT * FROM results_database WHERE m_analysis_id=$row AND order_id=$order_id AND sample_id=$id;"; 
            $result3 = mysqli_query($conn, $query3);
            $input3 = mysqli_fetch_array($result3);
            $result_id = $input3['id'];
            $result = $input3['result'];
            $detected = $input3['detected'];

            $output .= 
            '<tr>
            <td>
            <input class="hidden" name="result_id[]" id="result_id" value="'.$result_id.'" readonly>
            <input class="hidden" name="m_analysis_id[]" id="m_analysis_id" value="'.$row.'" readonly>
            <input class="hidden" name="order_id[]" id="order_id" value="'.$order_id.'" readonly>
            <input class="hidden" name="sample_id[]" id="sample_id" value="'.$id.'" readonly></td>


            <td>'.$analysis.'</td>
            <td><input name="detected[]" class="result_input" type="text" id="detected" value="'.$detected.'"></td>
            <td><input name="result[]" class="result_input" type="text" id="result" value="'.$result.'"></td>
            </tr>';
        }
        $output .= '</tbody>';
    }
    echo $output;
}

Проблема в том, что эта таблица из последней функции не возвращает данные на html-странице, а показывает неформатированную таблицу в URL, которая используется для перенаправления (href="../server/insert_tests.php?query='.$row['sample_id'].'").

Кто-нибудь знает, почему это происходит и как это можно решить?

Answer 1

Как вы уже знаете, $('.get_result').click(function ...) должен связать функцию в скобках с событием click всех элементов get_result класса.

Однако этот вызов применяется только к существующим элементам, когда вызывается привязка события. В вашем случае, поскольку таблица с тегами <a class="get_result"> загружается AJAX и вводится после . Привязка события выше не применяется.

Простое решение состоит в том, чтобы запускать привязку событий после каждого и каждого введения таблицы AJAX.