킹인더노쓰
21
2018-11-22 16:11:56
12
756

jstl forEach문으로 list 의 n번째 것만 뽑아오는 코드... 알려주세요... ㅠㅠ


<c:choose>

<c:when test="${fn:length(list) > 0}">

<c:forEach var="item" items="${list}" varStatus="status">

<table class="info">

<tbody>

<tr>

<td>

<span style="font-size:18px">

${list[i].name}

</span>

<a class="info_remove"><span class="glyphicon glyphicon-remove" ></span></a></td>

</tr>

<tr>

<td class="info_img"><img src="${pageContext.request.contextPath}${list[i].Img}"  /></td>

</tr>

</tr>

</tbody>

</table>

</c:forEach>

</c:when>

</c:choose>



제가 하고 싶은 것은 ${list}에 name 값과 img 값이 들어있는데 name과 img 하나씩만을 뽑아서

각각 다른 새 창에 띄우고 싶습니다. 

해서 ${list[i].name} 과 ${list[i].img} 부분의 i를 1이나 2로 바꾸면 제대로 나오는데요

[] 안에 i를 list의 크기만큼 돌려서 하나씩 뽑아내고 싶습니다.

아무리 해도 [i] 를 제어를 할 수가 없습니다 

어떻게 하면 될까요 도와주세요

0
0
  • 답변 12

  • odyssey320
    670
    2018-11-22 16:15:08

    i -> status.index

    0
  • 킹인더노쓰
    21
    2018-11-22 16:19:22

    odyssey 님 말씀대로 i를 status.index로 바꿨는데요

    똑같은 자리에 새 창이 여러개가 뜹니다. 

    i를 1이나 2로 바꿨을 때는 창이 하나만 떴는데 지금은 같은 자리에 창이 배열 수만큼 겹쳐서 떠요..ㅠㅠ

    0
  • 포기해..
    770
    2018-11-22 16:20:19

    foreach 문에서 var 에 선언한 변수에 list 데이타가 담깁니다.

    ${list[i].name} --> ${item.name} 


    foreach 문의 속성들에 대해서 공부하세요

    0
  • ktsedd
    6k
    2018-11-22 16:21:56


    2
    3
    <c:foreach items="${list}" var="list" varStatus="status">
        <c:out value="${status.index}" /> / <c:out value="${status.end}" />
    </c:foreach>



    https://jetalog.net/20
    0
  • odyssey320
    670
    2018-11-22 16:22:48

    1이나 2로했을때는 하나만 뜨니깐 겹치는지 안겹치는지 몰랐던거 아닌가요?

    table을 통으로 for문 돌려버리면 당연히 같은 자리에 table이 다 겹치게 되겠죠.

    table의 위치를 동적으로 변경해야될거같네요. 

    0
  • 킹인더노쓰
    21
    2018-11-22 16:40:52 작성 2018-11-22 16:41:36 수정됨


    <table class="info">

    <tbody>

    <c:choose>

    <c:when test="${fn:length(list) > 0}">

    <c:forEach var="item" items="${list}" varStatus="status">

    <tr>

    <td>

    <span style="font-size:18px">

    ${list[status.index].name}

    </span>

    <a class="info_remove"><span class="glyphicon glyphicon-remove" ></span></a></td>

    </tr>

    <tr>

    <td class="info_img"><img src="${pageContext.request.contextPath}${list[status.index].Img}"  /></td>

    </tr>

    </tr>

                          </c:forEach>

    </c:when>

    </c:choose>

    </tbody>

    </table>

    이렇게 반복문을 table 안에도 넣어보고 tbody 안에도 넣어봤는데요

    이번에는 테이블이 배열 길이만큼 붙어서 일자로 쭉 늘어집니다.

    하나만 띄우게 하려면 어떻게 해야 할까요...

    0
  • 포기해..
    770
    2018-11-22 16:50:01

    <table class="info">

    <tbody>

    <c:choose>

    <c:when test="${fn:length(list) > 0}">

    <c:forEach var="item" items="${list}" varStatus="status">

    <tr>

    <td>

    <span style="font-size:18px">

    ${list[status.index].name}

    </span>

    <a class="info_remove"><span class="glyphicon glyphicon-remove" ></span></a></td>

    </tr>

    <tr>

    <td class="info_img"><img src="${pageContext.request.contextPath}${list[status.index].Img}"  /></td>

    </tr>

    </tr> <--   코드에 </tr> 태그가 하나 더 붙어있네요

                          </c:forEach>

    </c:when>

    </c:choose>

    </tbody>

    </table>

    0
  • odyssey320
    670
    2018-11-22 16:50:35

    [name][삭제 icon]

    [image]


    위에처럼 for문 돌리면 이렇게 생긴게 아래로 for문 갯수만큼 만들어지겠지요. 

    그런데 여기서 어떻게 나오기를 원하시는 건가요?

    for문을 돌려놓고 한개만 뽑고싶다는 말자체가 이해가 안가네요.

    0
  • 킹인더노쓰
    21
    2018-11-22 16:56:34

    위에 쓴 코드는 여러개의 이미지 중에서 한 개를 클릭하면

    해당 이미지와 이름만 팝업창으로 뜨게 만든 팝업창의 코드입니다.

    컨트롤러에서 받아오는 list는 똑같은데 

    큰 페이지에서는 list로 이름과 이미지를 전부 나오게 하되

    큰 페이지에서 이미지를 클릭하면 팝업창으로 해당 아이템의 이미지와 이름이 나와야 합니다...

    0
  • 포기해..
    770
    2018-11-22 17:06:11

    뭔가 이상하네요

    스크립트부터 전체 소스를 다올리세요 

    팝업창을 하나만 띄우고 싶으면 팝업창에 이름을 부여하면 됩니다.

    <a href="window.open(${pageContext.request.contextPath}${item.Img}, 'pop')" target="_blank">

    <img src="${pageContext.request.contextPath}${item.Img}">

    </a>


    0
  • odyssey320
    670
    2018-11-22 17:07:29

    팝업창에서 선택한 값의 key or index는 가지고 오나요?

    img가 나오는 tr에 if문을 넣어야될거같네요.

    0
  • 포기해..
    770
    2018-11-22 17:56:16

    이벤트 객체에 filter로 쓸 키값을 담아서

    cigar_info 팝업창 에서 해당 이미지를 제외한 것들을 숨기게 해야 될것 같네요


    <img src="${pageContext.request.contextPath}${item.cigarImg}" class="cigar_pic" imgname="${item.name}"/></a>


    <!--    cigar_info 팝업창 영역    -->

    <span style="font-size:18px" popfilter="${item.name}">

    ${list[status.index].name}

    </span>


    <c:if test="${list[status.index].cigarPoint > 0 }" >

    <img src="${pageContext.request.contextPath}/assets/img/tabacco_pic/starOne.png" popfilter="${item.name}">

    </c:if>

    <!--    cigar_info 팝업창 영역    -->


    <!--    스크립트 영역   -->

    $(".cigar_pic").click(function(){

    var filter = $(this).attr("imgname");  <-- 필터 조건

    $(".cigar_info[popfilter^=" + filter + "]").hide();  <-- 선택된 것을 제외한 리스트 숨김

            $(".cigar_info[popfilter=" + filter + "]").show(); <-- 선택된 놈 보이기

      $(".cigar_info").fadeIn();


    });

    <!--    스크립트 영역    -->

    0
  • 로그인을 하시면 답변을 등록할 수 있습니다.