Попытка получить значение <button>, которое генерируется скриптом php, вызываемым ajax

Question

Я пытаюсь создать инструмент для доказательства наличия тестовых случаев, и теперь я не знаю, как решить одну проблему. В моем обзоре тестовых страниц 3 колонки макета. В левом столбце находится «навигация по дереву», когда вы щелкаете по самой низкой категории, а затем в среднем столбце показаны тестовые случаи из БД для этой указанной c категории. Это становится на ajax. Скрипт, который получает эти данные, также генерирует теги и в таблицу, которая пуста на сайте. Скрипт также генерирует кнопку с деталями внутри таблицы, которая должна быть кнопкой «подробно». Если я нажму на него, я хочу, чтобы детали теста были показаны в последнем правом столбце. Но мне не удается получить значение этой кнопки, которое имеет значение Dynami c, и каждая кнопка имеет различное значение в зависимости от ключевых слов для тестового случая. Кажется, что скрипт не может найти эту кнопку. Я пытался найти его по id, по имени et c. Но тестирование оповещения никогда не работает, и консоль понятна Спасибо за ваши советы !!!

Это html таблица в середине экрана.

    <div class="column_testcase_overview center_testcase_overview">
        <table id="scenare"></table>
    </div>

Это ajax вызывающий скрипт, который заполнит таблицу:

<script type="text/javascript">
    $(document).ready(function () {

    $("#get_id ul li").click(function () {
        var id = $(this).text();
        var parent_id = $(this).parent().attr("id");
        //alert(id + " " + parent_id);
        $.ajax({
            url: "/service/table_testcase.php",
            type: "POST",
            data: {
                "treasure map": 1,
                "low": id,
                "sub": parent_id
            },
            success : function(data)
            {
                $("#scenare").html(data);
            }

        });
    });

    });
</script>

Это скрипт, который заполняет таблицу, а также генерирует эти кнопки.

<?php
include ('db.php');
if(isset($_POST["treasure_map"])){
    try{
        $low = $_POST["low"];
        $sub = $_POST["sub"];
        $low_id = $pdo->prepare("SELECT `low_kategory_id` FROM low_kategory WHERE `low_kategory_name` = :low");
        $low_id->bindValue(':low', $low);
        $low_id->execute();
        $data = $pdo->prepare("SELECT `key_words`,`name`,`description`, `type_id` FROM scenar WHERE `low_kategory_id` = :low_kategory_id AND 
                                `sub_kategory_id` = :sub_kategory_id");
        $lowkat_id = $low_id->fetch(PDO::FETCH_ASSOC);
        $lowkat = $lowkat_id['low_kategory_id'];

        $data->bindValue(':low_kategory_id', $lowkat);
        $data->bindValue(':sub_kategory_id', $sub);
        $data->execute();
        echo '<tr class="popisek_middle">' . '<th>Name of testcase</th>' . '<th>Description</th>' . '<th>type_id</th>' . '<th></th>' . '</tr>';
        while ($row = $data->fetch(PDO::FETCH_BOTH)){
            echo '<tr>' .  '<td>' . $row['name'] . '</td>' . '<td>' . $row['description'] . '</td>' .
                '<td>' . $row['type_id'] . '</td>' . '<td class="detailbtn" id="sloupec_buttons">' . '<button type="button" class="detail" name="scenare-detail" 
                value="' . $row['key_words'] . '">Detail</button>' . '</td>' . '</tr>';
        }
     //   echo $lowkat . " " . $sub;
    }
    catch (PDOException $e){
        echo "Error: " . $e->getMessage();
    }
}

$pdo = null;

и это сценарии, которые я пытаюсь получить для значения кнопки.

$("button[name='scenare-detail']").on('click',function (event) {
   alert($(this).attr('value'))
  })

$("#sloupec_buttons button").click(function () {
   var value = $(this).val();
}

and more others :/

Answer 1

Спасибо вам всем! Ты сделал мой день :) Это работает!

Answer 2

Попробуйте это. Создайте прослушиватель для элемента контейнера, а затем используйте целевой id или tag для выполнения действия события.

$('#scenare').on('click', "button[name='scenare-detail']", function(){
    alert($(this).attr('value'));
});

$('#scenare').on('click', "#sloupec_buttons button", function(){
    alert($(this).attr('value'));
});

Answer 3

Измените свой скрипт на это. Используйте документ, если у вас есть динамическое c содержимое, такое как у вас сейчас.

$(document).on('click','button[name='scenare-detail']', function (event) {
   alert($(this).attr('value'))
  })

$(document).on('click', '#sloupec_buttons button', function () {
   var value = $(this).val();
}

Answer 4

Dynami c загруженный контент будет применяться для использования кода скрипта и других методов, которые уже были объявлены ранее. Таким образом, если мы выполним sh для глобального функционального кода для обоих (stati c & dynamici c), будет использован следующий код:

$(document).on("click",".detail",function (event) {
    alert($(this).val());
});