使用JavaScript更改dataTable中列的标题

Change header of columns in a dataTable with JavaScript

本文关键字：标题 dataTable JavaScript 更改 使用      更新时间：2023-09-26

我有一个dataTable的XHTML代码。

<p:dataTable id="processes" var="process" value="#{homeBean.processesList}" filteredValue="#{homeBean.filteredProcesses}"
                                    rowKey="#{process.pid}" selection="#{homeBean.selectedProcesses}" 
                                    paginator="true" rows="8" paginatorTemplate="{FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink}"
                                    rowsPerPageTemplate="5,10,15" >
                                <f:facet name="header">
                                    <h:outputText value="Processes" />
                                </f:facet>
                                <p:column name="owner" filterBy="owner" filterMatchMode="contains" sortBy="owner" headerText="Owner">
                                    <h:outputText value="#{process.owner}" />
                                </p:column>
                                <p:column name="pid" filterBy="pid" filterMatchMode="exact" sortBy="pid" headerText="PID">
                                    <h:outputText value="#{process.pid}" />
                                </p:column>
                                <p:column name="ppid" filterBy="ppid" filterMatchMode="exact" sortBy="ppid" headerText="PPID">
                                    <h:outputText value="#{process.ppid}" />
                                </p:column>
                                <p:column name="c" filterBy="c" filterMatchMode="exact" sortBy="c" headerText="C">
                                    <h:outputText value="#{process.c}" />
                                </p:column>
                                <p:column name="stime" filterBy="stime" filterMatchMode="contains" sortBy="stime" headerText="STIME">
                                    <h:outputText value="#{process.stime}" />
                                </p:column>
                                <p:column name="tty" filterBy="tty" filterMatchMode="contains" sortBy="tty" headerText="TTY">
                                    <h:outputText value="#{process.tty}" />
                                </p:column>
                                <p:column name="time" filterBy="time" filterMatchMode="contains" sortBy="time" headerText="TIME">
                                    <h:outputText value="#{process.time}" />
                                </p:column>
                                <p:column name="cmd" filterBy="cmd" filterMatchMode="contains" sortBy="cmd" headerText="CMD">
                                    <h:outputText value="#{process.cmd}" />
                                </p:column>
                            </p:dataTable>

这段代码在一个表中显示了所选服务器中每个进程的所有者、pid、ppid、c、stime、time、tty和cmd信息。我想改变headerText当我得到一个windows服务器，所以我写了这个javascript代码，我要通过正确的方式??

                    <script type="text/javascript">
                    var server_os = "#{homeBean.selectedLogicalServer.os}";
                    if (server_os.search("Windows") != -1 ) {
                        document.getElementById("owner").headerText="User Name";
                        document.getElementById("ppid").headerText="Sesion Number";
                        document.getElementById("c").headerText="Sesion Number";
                        document.getElementById("stime").headerText="User Name";
                        document.getElementById("tty").headerText="Sesion Name";
                        document.getElementById("cmd").headerText="Image Name";
                    }
                </script>

可以在服务器端这样做，而不是在JavaScript中，像这样:

<p:column name="tty" 
   headerText="#{homeBean.selectedLogicalServer.os eq 'Windows' ? 'Session Name' : 'TTY'}">
     <h:outputText value="#{process.tty}" />
</p:column>

我不确定语法，但应该有这样的效果。

相关文章：