5

我正在使用 jQuery 的 DataTables 插件在我的网络应用程序上绘制表格。一切正常。但其中一种选择是按下详细信息按钮以打开一个信息窗口,该窗口将具有附加值。现在该部分工作正常,但我的表是用类定义的,所以当用户使用菜单更改语言时,我可以动态更改语言。

正如我在开始时所说的那样,我得到的唯一内容是英语。

我的预定义表:

function fnFormatDetails ( nTr )
{
    var aData = oTable.fnGetData( nTr );
    var sOut = '<table cellpadding="5" cellspacing="0" border="0" style="background-color:whitesmoke; padding-left:10%; padding-right:10%; width:100%">';
    sOut += '<tr><td style="text-align:left"><span class="id_prog">ID Program : '+aData[0]+'</span></td><td style="text-align:left"><span class="id_in_perc">Increment : '+aData[3]+'</span></td></tr>';
    sOut += '<tr><td style="text-align:left"><span class="id_var">Machine position : '+aData[1]+'</span></td><td style="text-align:left"><span class="id_tot_in_var">Total inc : '+aData[4]+'</span></td></tr>';
    sOut += '<tr><td style="text-align:left"><span class="id_dti_var">DTI : '+aData[2]+'</span></td></tr>';
    sOut += '</table>';

    return sOut;
}

当我更改语言并且我的 javascript 通过类名更改每个值时,什么都没有发生,但是对于我的其余代码,这可以正常工作,但对于这个预定义的表却没有。任何的想法?

编辑

这是一个事件监听器:

$('#jphit tbody td img').live( 'click', function () {
        var nTr = $(this).parents('tr')[0];
        if ( oTable.fnIsOpen(nTr) )
        {
            /* This row is already open - close it */
            this.src = "images/plus-icon.png";
            oTable.fnClose( nTr );
        }
        else
        {
            /* Open this row */
            this.src = "images/minus-icon.png";
            oTable.fnOpen( nTr, fnFormatDetails(nTr), 'details' );
        }
} );

因此,当单击按钮时,我调用fnFormatDetails()函数,但仅在设置时才绘制它。因此,当我动态更改该表的值时,没有任何变化。

你需要更多细节吗?

4

2 回答 2

4

如果我理解正确,您尝试动态更改始终在页面上的表格的内容。我不知道你为什么要把它放在你的 javascript 中,但是当你使用 jQuery 时,我建议使用不同的方法。

这将在您的 html 文件中。

<table id="myTable">
    <tr>
        <td><span id="id1"><!-- content will load here --></span></td>
        <td><span id="id2"><!-- content will load here --></span></td>
    </tr>
</table>

我会使用 id 而不是 class 因为这些值是唯一的。

并且用javascript来替换html标签的内容。

function fnFormatDetails ( nTr ) {
    var aData = oTable.fnGetData( nTr );
    $("#id1").html("My data here " + aData[0]);
    $("#id2").html("My data here " + aData[1]);
    ...
}

这会将具有指定 id 的标签的 html 内容替换为您指定为属性的内容。

我希望这可以帮助你。

于 2012-08-24T17:28:24.957 回答
1

1)我建议你通过console.log查看fnFormatDetails中的aData。这将确保函数被执行并且您在数组中看到正确的值。

2) 尝试通过 nTr.html("") 清除旧表,看看是否有任何改善。

您能否粘贴表格的图像以便我们更好地理解。

于 2012-08-30T14:26:28.790 回答