从td获取数据属性将返回undefined

时间:2016-01-21 08:06:44

标签: javascript jquery

我不确定这是否正确,但我试图从data而不是td获取tr属性。我已经有了data-id属性。

<tbody>
<?php $offset = $this->uri->segment(5,0)+1; ?>
<?php foreach($user as $row): ?>
<tr data-id="<?php echo $row->id; ?>">
<td><?php echo $offset++; ?></td>
<td><?php echo $row->company; ?></td>
<td data-company="<?php echo $row->id; ?>"><input type="hidden" class="id" name="id" value="<?php echo $row->id; ?>"/><input type="button" class="expandlink_admin" value="+"/></td>
<td><input type="hidden" class="id" name="id" value="<?php echo $row->id; ? >"/><input type="button" class="shrinklink_admin" value="-"/></td>
<td><input type="hidden" class="id" name="id" value="<?php echo $row->id; ?>"/><input type="hidden" name="company" value="<?php echo $row->id; ?>"/><input type="hidden" name="set" value="edit"/><input type="button" class="editlink_company" value="Edit"/></td>
<td><input type="hidden" class="id" name="id" value="<?php echo $row->id; ?>"/><input type="hidden" name="company" value="<?php echo $row->id; ?>"/><input type="hidden" name="set" value="delete"/><input type="button" class="deletelink" value="Delete"/></td>
</tr>
<tr class="subtable">
<td colspan="9">
<input type="hidden" value="<?php echo $row->id; ?>"/>
<table class="table">
<tr>
<td>Total Agents : </td>    
<td id="totalagents"></td>
<td>Address : </td>
<td><?php echo $row->address; ?></td>
</tr>
<tr>
<td>Total Users : </td>
<td id="totalusers"></td>
<td>Date Added : </td>
<td><?php echo $row->date_added; ?></td>
</tr>
</table>
</td>
</tr>
<?php endforeach; ?>
</tbody>
$('.expandlink_admin').on('click', function() {
var $row = $(this).closest('tr');
var curr_row = $row.data('id');
var company = $(this).closest('td').data('company');
// console.log(curr_row);
console.log(company);
 var row = $(this).parents("tr");
 $.ajax({
    url: '/manager/administrator/users/count_agents',
    type: 'POST',
    dataType:'json',
    data:{id:curr_row},
    cache:false,
    success:function(result){
    //console.log(result);
     $(".subtable").each(function() { //loop through each row
            if($("[type='hidden']", this).val() == curr_row) { 
                  $(this).show();
                 row.find('.expandlink_admin').hide();
                 row.find('.shrinklink_admin').show();
             }
     });
}});
});

到目前为止,它一直返回未定义的值。请帮忙

5 个答案:

答案 0 :(得分:0)

试试这个

var curr_row = $(this).parent('tr').attr('data-id');

答案 1 :(得分:0)

org.eclipse.ui.internal.HeapStatus

答案 2 :(得分:0)

很难理解this代表什么。 但如果输入$(this),那么它应该是:

var curr_row = $(this).parents('tr').attr('data-id');
var curr_comp = $(this).parent().data('company'); //<-- parent() added

如果$(this)td,则应为:

var curr_row = $(this).parent('tr').attr('data-id');
var curr_comp = $(this).data('company');

答案 3 :(得分:0)

您的链式parent()调用在DOM上过高,无法获取父tr元素。相反,您可以使用closest()。另请注意,使用data()检索数据属性是一种更好的做法。试试这个:

var $row = $(this).closest("tr");
var rowid = $row.data('id');
var company = $(this).closest('td').data('company');

这是一个完整的例子

$('.expandlink_admin').on('click', function() {
    var $row = $(this).closest("tr");
    var rowid = $row.data('id');
    var company = $(this).closest('td').data('company');

    $.ajax({
        url: '/manager/administrator/users/count_agents',
        type: 'POST',
        dataType:'json',
        data: {
            id: rowid    
        },
        cache: false,
        success: function(result) {
            $(".subtable").each(function() { //loop through each row
                if ($("[type='hidden']", this).val() == rowid) { 
                    $(this).show();
                    $row.find('.expandlink_admin').hide();
                    $row.find('.shrinklink_admin').show();
                }
            });
        }
    });
});

答案 4 :(得分:0)

<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>

<script>

    $(document).ready(function(){
        //$("#dvTable").hide();
        $("#btnGenerate").click(function () {

            szTr = '<tr data-id="test_data_id">'
            szTr = szTr + '<td>first</td>'
            szTr = szTr + '<td>company</td>'
            szTr = szTr + '<td data-company="data_company"><input type="hidden" class="id" name="id" value="row_id"/>'
            szTr = szTr + '<input type="button" class="expandlink_admin" value="+"/>'
            szTr = szTr + '</td>'
            szTr = szTr + '<td><input type="hidden" class="id" name="id" value="row_id"/><input type="button" class="shrinklink_admin" value="-"/></td>'
            szTr = szTr + '<td><input type="hidden" class="id" name="id" value="row_id"/><input type="hidden" name="company" value="row_id"/><input type="hidden" name="set" value="edit"/><input type="button" class="editlink_company" value="Edit"/></td>'
            szTr = szTr + '<td><input type="hidden" class="id" name="id" value="row_id"/><input type="hidden" name="company" value="row_id"/><input type="hidden" name="set" value="delete"/><input type="button" class="deletelink" value="Delete"/></td>'
            szTr = szTr + '</tr>'

            $('#display tbody').append(szTr);

        });


        $('body').on('click', '.expandlink_admin', function () {
                var curr_row = $(this).parent().parent('tr').attr('data-id');
                alert(curr_row)
        });


    });



</script>
</head>
<body>
     <input type="button" value="Generate" id="btnGenerate">
     <table id="display">
<tbody>



</tbody>

</table>
</body>
</html>