Question

我有一个来自DataTable插件的表，服务器端接收数据。在这个表中，我有一个列有一个按钮，单击该按钮打开一个模态。在这个模式中，我想显示一些信息，如名称，接收的字节数，发送的字节数等。

我需要获取第一个td的名称（值），因为从该名称将在mysql中选择并捕获数据并显示此模态。

我尝试“$（this）.closets（tr）和first td”的方式，当我使用alert（）时，弹出窗口中没有显示任何信息。

图片：

我的javascript代码：

  <div class="panel-body">
<table class="ui small table" id="example">
  <thead>
    <tr>
      <th>Chave</th>
      <th>Bloqueio</th>
      <th>Conexão</th>
      <th>Ação</th>
    </tr>
  </thead>
  <tbody>

  </tbody>
  <tfoot>

      <th>Chave</th>
      <th>Bloqueio</th>
      <th>Conexão</th>
      <th>Ação</th>
    </tr>
  </tfoot>
</table>

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel"></h4>
      </div>
      <div class="modal-body">
        <!-- <canvas id="myChart" width="400" height="400"></canvas> -->
        <div class="row">
        <div class="col-md-5"><canvas id="myChart" width="400" height="400"></canvas></div>
        <div class="col-sm-3"><h4>Name: </h4> <h4>Bytes Received:</h4><h4>Bytes Sent:</h4><h4>Real Address</h4><h4>Virtual Address</h4></div>
      </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>

我的HTML：

from django.contrib.auth.models import User, Permission
from django.db import models


class RodanUser(User):
    class Meta:
        proxy = True
        permissions = (
            ('view_user', 'View User'),
        )

Answer 1

我建议你不要试图在其他地方的中找到信息就像它呈现的按住按钮的表一样，但要渲染包含所有需要信息的按钮。

看，你有按钮的模板：

"render": function(data, type, row, meta){
         return "<button class='ui icon button' data-toggle='modal' data-target='#myModal' onclick='teste()'><i class='options icon'></i></button>";  
      }

正如您所看到的，您在函数中拥有所有需要的信息，因此您可以将其呈现为属性，如下所示：

"render": function(data, type, row, meta){
             return "<button class='ui icon button js-modal-btn' data-chave="+ row[0] +"><i class='options icon'></i></button>";  
          }

现在，正如你所看到的，button有一个属性，它保存row变量的值，我假设它是一个数组，第一个元素就是你需要的。（如果你不确定，只需在render函数中创建一个console.log（行）。

现在您可以在点击句柄上使用varible：

$(document).on('click', '.js-modal-btn', function(){

   var $this = $(this);
   var firstColumnName = $this.attr('data-chave');

   //go on
})

请不要使用onclick内联句柄。

单击按钮获取行的ID和值

1 个答案: