2015-10-16 57 views
-1

我有这样的表,在这里我的视图文件输出一组记录是什么样子 My table获取数据4.2

是,当什么即时试图做用户在特定行上点击了edit按钮,它会从每一行获取数据,将其放在一个<p>Data here</p>然后显示在同一页 我到目前为止所做的是这个,我做了一个onlick函数 这里是在我看来的桌子代码

<table class="table table-striped table-hover" id="detailTable"> 
    <thead> 
     <tr> 
      <th>Record ID</th> 
      <th>School Year</th> 
      <th>School Quarter</th> 
      <th>Student Name</th> 
      <th></th> 
     </tr> 
    </thead> 

    <tbody> 
     @foreach ($srs as $key => $vu) 
      <tr> 
        <td>{{ $vu->StudentRecordID }}</td> 
        <td>{{ $vu->SchoolYear }}</td> 
        <td>{{ $vu->SchoolQuarter}}</td> 
        <td>{{ $vu->full_name}}</td> 
        <td><button class="btn" id="gid" onclick="tgPanel();" >Edit</button></td> 

      </tr> 
     @endforeach 

    </tbody> 

</table> 

这里是我的javascript

function tgPanel() 
{ 
    document.getElementById("rid").innerHTML =  document.getElementById("detailTable").rows[0].cells[1].innerHTML ; 
    document.getElementById("sy").innerHTML = document.getElementById("detailTable").rows[0].cells[2].innerHTML ; 
    ..and so on.. 
} 

以及目前唯一即时得到的代码是标题我不知道如何在row[0]表明什么行Ø点击按钮的任何想法?

回答

1

您的onclick函数需要一个参数。

onclick="tgPanel(this)" 

然后你可以使用按钮并获取信息。

function tgPanel(button) { 
    var tr = button.parentElement.parentElement; 
} 
+0

非常感谢:) – BourneShady