JQuery DataTable:打开/单击另一行后关闭一个Open行

时间:2017-08-08 16:51:35

标签: jquery datatables

我正在开发一个Jquery DataTables遗留项目。我正在尝试添加功能。如果我单击一行来显示它的详细信息,我可以通过打开另一行来自动关闭该行。 现在的逻辑是我可以一次打开多行,但必须单击同一行才能关闭它。

2.

我看一个解决同一问题的上一个问题,但不知道浏览器如何知道变量" pTr"是DOM中先前单击过的事件。 JQuery Datatables Close Each Open Row with fnClose()

谢谢。

编辑:pTr指向当前的nTr。我之前没有意识到这一点。这个解决方案对我有用。

1 个答案:

答案 0 :(得分:0)

我能够弄清楚我在这里做错了什么是正确的代码:

//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;
    }