如何使用jQuery获取追加表数据和获取被点击的表行数据

时间:2019-10-26 11:55:41

标签: jquery ajax

我正在尝试使用ajax附加一些表行数据,并通过jquery获取该数据 但问题是两个功能都在起作用。

此代码功能正常

function podetails(pid) {
    $.ajax({
        url: "../phpfile/getpurchaseordetails.php?pid=" + pid,
        dataType: 'json',
        type: 'post',
        cache: false,
        success: function (data) {
            alert(data);
            console.log(data);
            var event_data = '';
            $.each(data, function (index, value) {
                console.log(value);
                event_data += '<tr id="'+ value.poid + '">';
                event_data += '<td id="co">' + value.countt + '</td>';
                event_data += '<td id="po">' + value.podetail + '</td>';
                event_data += '<td id="sa">' + value.saless + '</td>';
                event_data += '<td id="pr">' + value.productt + '</td>';
                event_data += '<td id="qt">' + value.qty + '</td>';
                event_data += '<td id="da">' + value.date + '</td>';
                event_data += '<td><button class="btn btn-dark editt" onclick="dog()" type="submit" name="insert" id=" '+ value.poid + '">Edit</button></td>';
                event_data += '</tr>';
            });
            $("#list_table_json > tbody").empty();
            $("#list_table_json").append(event_data);
        },
        error: function (d) {
            /*console.log("error");*/
            alert("404. Please wait until the File is Loaded.");
        }
    });
}

在此代码中也可以正常运行,但警报什么也没有显示(空)

function dog() {

    var $row = $(this).closest("tr");    // Find the row
    var $text = $row.find('#co').text();
    alert($text);

    var podetail = $('#list_table_json').closest("tr").find('td:eq(0)').text();
    var pocode = $(this).closest("tr").find('td:eq(1)').text();
    var saleline = $(this).closest("tr").find('td:eq(2)').text();
    var product = $(this).closest("tr").find('td:eq(3)').text();
    var qty = $(this).closest("tr").find('td:eq(4)').text();
    alert(podetail);}

如何获取数据?

2 个答案:

答案 0 :(得分:0)

您的问题对我来说似乎不清楚,但也许尝试一下:

function podetails(pid) {
    $.ajax({
        url: "../phpfile/getpurchaseordetails.php?pid=" + pid,
        dataType: 'json',
        type: 'post',
        cache: false,
        success: function (data) {
            alert(data);
            console.log(data);
            var event_data = '';
            $.each(data, function (index, value) {
                console.log(value);
                event_data += '<tr class="'+ value.poid + '">';
                event_data += '<td class="co">' + value.countt + '</td>';
                event_data += '<td class="po">' + value.podetail + '</td>';
                event_data += '<td class="sa">' + value.saless + '</td>';
                event_data += '<td class="pr">' + value.productt + '</td>';
                event_data += '<td class="qt">' + value.qty + '</td>';
                event_data += '<td class="da">' + value.date + '</td>';
                event_data += '<td><button class="btn btn-dark editt" onclick="dog()" type="submit" name="insert" id=" '+ value.poid + '">Edit</button></td>';
                event_data += '</tr>';
            });
            $("#list_table_json > tbody").empty();
            $("#list_table_json").append(event_data);
        },
        error: function (d) {
            /*console.log("error");*/
            alert("404. Please wait until the File is Loaded.");
        }
    });
}

function dog() {
    var $row = $(this).closest("tr");    // Find the row
    var $text = $row.find('.co').text();
    alert($text);

    var podetail = $(this).closest("tr").find('td:eq(0)').text();;
    var pocode = $(this).closest("tr").find('td:eq(1)').text();
    var saleline = $(this).closest("tr").find('td:eq(2)').text();
    var product = $(this).closest("tr").find('td:eq(3)').text();
    var qty = $(this).closest("tr").find('td:eq(4)').text();
    alert(podetail);
}

我将“ id”替换为“ class”,因为每页只能有一个具有特定ID的元素。带有“ co” id的第一个元素很可能为空,这就是为什么在按id搜索时只能得到空值的原因。

答案 1 :(得分:0)

我对此代码进行了更新

    function podetails(pid) {
    $.ajax({
        url: "../phpfile/getpurchaseordetails.php?pid=" + pid,
        dataType: 'json',
        type: 'post',
        cache: false,
        success: function (data) {
            // alert(data);
            // console.log(data);
            var event_data = '';
            $.each(data, function (index, value) {
                console.log(value);
                event_data += '<tr class="' + value.poid + '">';
                event_data += '<td class="co">' + value.countt + '</td>';
                event_data += '<td class="po">' + value.podetail + '</td>';
                event_data += '<td class="sa">' + value.saless + '</td>';
                event_data += '<td class="pr">' + value.productt + '</td>';
                event_data += '<td class="qt">' + value.qty + '</td>';
                event_data += '<td class="da">' + value.date + '</td>';
                event_data += '<td><button class="btn btn-dark editt" onclick="dog(' + value.poid + ')" type="submit" name="insert" id=" ' + value.poid + '">Edit</button></td>';
                event_data += '</tr>';
            });
            $("#list_table_json > tbody").empty();
            $("#list_table_json").append(event_data);
        },
        error: function (d) {
            /*console.log("error");*/
            alert("404. Please wait until the File is Loaded.");
        }
    });
}

function dog($dag) {

    var podetail = $('.'+$dag).find('td:eq(0)').text();
    var pocode = $('.'+$dag).find('td:eq(1)').text();
    var saleline = $('.'+$dag).find('td:eq(2)').text();
    var product = $('.'+$dag).find('td:eq(3)').text();
    var qty = $('.'+$dag).find('td:eq(4)').text();
    alert(podetail);}