>source

Struts 2 및 Tiles 3을 사용하는 JSP 사이트에서 작업하고 있습니다. 탭이 다르며 각 탭에는 테이블이있는 DIV가 표시됩니다. 2 개의 테이블이있는 탭을 추가하고 버튼에 따라 하나 또는 다른 하나를 표시해야합니다.

JS를 어떻게 든 보여 주거나 숨길 수 있습니까? 나는 지금 잠시 동안 노력하고 있었고, 타일은 JS에서하는 일을 돌보는 것처럼 보이지 않습니다.

나는 이것을 사용 해왔다. 그러나 몇 가지 변형이 있지만, 지금까지는 행운을 낸다. 나는 뭔가 잘못하고 있을지도 모른다. 그러나 내가 모르는 런타임 동안 뭔가를 숨기거나 숨길 수있는 방법이있다.

document.getElementById('controlPools').style.display='none';
document.getElementById('controlPools').style.display='inline';

​​ControlPools그 이름입니다이면, 그것이 들어있는 타일의 이름은ControlPool....에

이것은 JSP 페이지의 code입니다.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%><%@taglib prefix="s" uri="/struts-tags"%><%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%><%@ taglib uri="http://displaytag.sf.net" prefix="display"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><body>    <fieldset>        <div id="controlPools">            <display:table name="lstPools" class="displaytag" id="tablaPools" >                <display:column style="width: 90%"     >                    <a href="javascript:getNodosPool('${tablaPools.name}')" >${tablaPools.name}</a>                </display:column>                <display:column style="width: 10%" property="nodes"/>            </display:table>        </div>        <div id="nodosPool" style="display: none;" >            <display:table name="lstMembers" class="displaytag" id="tablaNodesPool">                <display:column style="width: 5%" >                            <input type="checkbox" id="${tablaNodesPool.name}"  class="node" value="${tablaNodesPool.name}"  style="margin: 0 0 0 4px"   />                         </display:column>                         <display:column title="Status CBS" style="width: 10%">                            <div id="iconStatus"  class="${tablaNodesPool.classStatus}" /></div>                         </display:column>                         <display:column title="Status STF" style="width: 10%">                            <div id="iconStatus"  class="${tablaNodesPool.classStatus2}" /></div>                         </display:column>                         <display:column property="name"    />                         <display:column property="ip"    />                         <display:column property="description"   />            </display:table>            <button onclick="enableNodesPool();"  ><s:text name="controlSnmp.enableSelected"/></button>            <button onclick="disableNodesPool();" ><s:text name="controlSnmp.disableSelected"/></button>            <button onclick="getNodosPool();"><s:text name="controlSnmp.buttonRefresh"/></button>        </div>    </fieldset></body><script></script>

타일은 서버 측입니다. 렌더링 된 HTML이 많은 JS 조언을 제공하는 것은 불가능한 것처럼 보이는 것처럼 보이는 것에 대해 알지 못하고 있습니다.

Dave Newton2021-04-21 09:15:40

나는 JSP code를 추가했는데, 타일 구성을 추가해야합니까?

Nagarz2021-04-21 09:15:40

JSP에는 타일이 없습니다. 정확히 일어나지 않는 것은 무엇입니까? 이 JS 스크립트를 어디서 사용합니까?

Aleksandr M2021-04-21 09:15:40

일부 함수가있는 JS 파일이 있습니다.이 중 하나는 ID NodoSpool을 사용하여 Document.getElementByID ( 'Nodospool')로 숨겨진 가시성을 설정해야합니다. StyleDisplay= 'None'. 그러나 그것은 작동하지 않습니다.

Nagarz2021-04-21 09:15:40
  • 답변 # 1

    @ roman-c resware가 나를 생각하게하고, 그 문제에 대한 해결책을 이끌었고, 그것은 부분적으로 타일 때문에 이끌었습니다.

    이 JS 블록을 사용하여 데이터를 My JSP로 공급했습니다.

    document.getElementById('controlPools').style.display='none';
    $.ajax({
            type : "GET",
            url  : "ControlNodesPoolAct.action",
            data : {"pool": pool},
            success : function(result){
              if (result != null &amp;
    &amp;
     result.length > 0){
                var aux= $("#tabs-11");
                aux.html(result);
                //inicializamos la tabla con el plugin de jquery
                $('#tablaNodesPool').DataTable(
                        {
                            "lengthMenu": [[150, 75, 10, -1], [150, 75, 10, "All"]]
                        }
                );
                spinner.stop();
                document.getElementById('poolLegend').innerHTML=pool;
              }
            },
            error : function(xhr, errmsg) {
                console.log("error en funcion getMiembrosSnmp " + errmsg);
                spinner.stop();
            }
        });
    

    및 분명히 DisplayTags가 런타임 중에 렌더링 되었기 때문에 Div가 펑션이 호출 된 순간에 존재하지 않았으므로 DisplayTags가 DIV가 존재할 때까지 렌더링 할 때까지 기다려야했습니다. 나는 그를 옮겼다document.getElementById ( 'ControlPools'). style.display= 'none';테이블이 렌더링 된 지점까지 렌더링되어 문제를 해결하는 것처럼 보입니다.

    이 변경 사항이 수정되었습니다.

    $.ajax({
            type : "GET",
            url  : "ControlNodesPoolAct.action",
            data : {"pool": pool},
            success : function(result){
              if (result != null &amp;
    &amp;
     result.length > 0){
                var aux= $("#tabs-11");
                aux.html(result);
                //inicializamos la tabla con el plugin de jquery
                $('#tablaNodesPool').DataTable(
                        {
                            "lengthMenu": [[150, 75, 10, -1], [150, 75, 10, "All"]]
                        }
                );
                spinner.stop();
                document.getElementById('controlPools').style.display='none';
                document.getElementById('poolLegend').innerHTML=pool;
              }
            },
            error : function(xhr, errmsg) {
                console.log("error en funcion getMiembrosSnmp " + errmsg);
                spinner.stop();
            }
        });
    

  • 답변 # 2

    타일은 클라이언트 측에서 아무 것도 할 필요가 없으므로 이미 DOM으로 작업하는 JS code를 사용하는 경우이 문서는 타일 결과를 사용하여 렌더링 될 수 있습니다. 어쨌든 일부 JS 함수를 사용하여 일부 HTML 컨텐츠를 표시하거나 숨기도록 수정 해야하는 적절한 스타일을 변경하지는 않습니다.

    숨기기 :

    document.getElementById('controlPools').style.display='none';
    

    표시 :

    document.getElementById('controlPools').style.display='block';
    

  • 이전 Amazon Redshift에서 구체화 된보기에 인덱스 만들기
  • 다음 팬더 시리즈 (Python)의 핵심 오류 표시