JQuery DataTable：一旦我打开/点击另一行，关闭一个打开的行

问题描述：

我正在处理Jquery DataTables传统项目。我正在尝试添加一项功能。如果我点击一行来显示它的细节，我可以通过打开另一行来自动关闭同一行。现在的逻辑是我可以一次打开多行，但必须点击同一行来关闭它。JQuery DataTable：一旦我打开/点击另一行，关闭一个打开的行

... 
    eventsTableOpenDetails[0] = openBtn; //html image 
     eventsTableOpenDetails[1] = nTr;  // current inner tr 
    ..... 

     if(eventsTable.fnIsOpen(nTr)){ 
      openBtn.src = "images/details_open.png"; 
      eventsTable.fnClose(nTr); 
     } 
     else { 
      var aData = eventsTable.fnGetData(nTr); 
      var sOut = '<table cellpadding="5" cellspacing="0" border="0" style="padding-left:50px; border: 1px solid black; width: 100%; word-wrap:break-word;table-layout: fixed;">'; 
      sOut += '<tr><td style="width:10%">Cnt:</td><td>' + aData[1] + '</td></tr>'; 
      sOut += '<tr><td style="width:10%">Time:</td><td>' + aData[2] + '</td></tr>'; 
      sOut += '<tr><td style="width:10%">Type:</td><td>' + aData[3] + '</td></tr>'; 
      //sOut += '<tr><td style="width:10%">Field 5:</td><td>' + aData[5] + '</td></tr>'; 
      sOut += '<tr><td style="width:10%">Details:</td><td><pre>' + aData[6] + '</pre></td></tr>'; 
      sOut += '<tr><td style="width:10%"></td><td></td></tr>'; 
      sOut += '<tr><td style="width:10%"></td><td><button id="btnClientInject" class="btn btn-warning pull-right" onclick="injectData(' + position + ');" >Inject</button></td></tr>'; 
      sOut += '</table>'; 


      openBtn.src = "images/details_close.png"; 
      eventsTable.fnOpen(nTr, sOut, 'details'); 

     }

我看那个解决同样的问题，但不知道浏览器是怎么知道的变量“PTR”是的DOM之前点击事件前一个问题。 JQuery Datatables Close Each Open Row with fnClose()

谢谢。

编辑：pTr指向当前nTr。我以前没有意识到，这个解决方案为我工作。

答

我能找出我做错了什么这里是正确的代码：

//store state of open rows 
//global variables 
var currentExpanded; 
var currentExpandedImg; 

if(eventsTable.fnIsOpen(currentExpanded) && currentExpanded!=nTr){ 

     currentExpandedImg.src = "images/details_open.png"; 
     eventsTable.fnClose(currentExpanded); 

    } 
    if(eventsTable.fnIsOpen(nTr)){ 

     openBtn.src = "images/details_open.png"; 
     eventsTable.fnClose(nTr); 
    } 
    else { 
     var aData = eventsTable.fnGetData(nTr); 
     var sOut = '<table cellpadding="5" cellspacing="0" border="0" style="attribute=isClose; padding-left:50px; border: 1px solid black; width: 100%; word-wrap:break-word;table-layout: fixed;">'; 
     sOut += '<tr><td style="width:10%">Cnt:</td><td>' + aData[1] + '</td></tr>'; 
     sOut += '<tr><td style="width:10%">Time:</td><td>' + aData[2] + '</td></tr>'; 
     sOut += '<tr><td style="width:10%">Type:</td><td>' + aData[3] + '</td></tr>'; 
     //sOut += '<tr><td style="width:10%">Field 5:</td><td>' + aData[5] + '</td></tr>'; 
     sOut += '<tr><td style="width:10%">Details:</td><td><pre>' + aData[6] + '</pre></td></tr>'; 
     sOut += '<tr><td style="width:10%"></td><td></td></tr>'; 
     sOut += '<tr><td style="width:10%"></td><td><button id="btnClientInject" class="btn btn-warning pull-right" onclick="injectData(' + position + ');" >Inject</button></td></tr>'; 
     sOut += '</table>'; 


     openBtn.src = "images/details_close.png"; 
     currentExpandedImg = openBtn; 
     eventsTable.fnOpen(nTr, sOut, 'details'); 
     currentExpanded = nTr; 
    }

JQuery DataTable：一旦我打开/点击另一行，关闭一个打开的行

相关推荐