如何在弹出窗口中显示不同字段的图像点击列表

时间:2015-09-04 12:28:49

标签: jquery spring

      <table>
          <c:forEach items="${couponlist}" var="list">
          <tr>
            <td><a href="#myPopup" data-rel="popup" data-position-              to="window" ><input type="text" name="couponName" value="${list.couponName}"     readonly></a>

           <div data-role="popup" id="myPopup">
            <p>This is my Coupon Image!</p> 
             <a href="#pageone" data-role="back"  class="ui-btn ui-corner-all ui -                  shadow ui-btn-a ui-icon-delete ui-btn-icon-notext ui-btn-right" ></a>
            <img src="${list.ImagePath}" style="width:800px;height:400px;"      alt="Skaret View" id="src" >
           </div>
          </td>               

           </tr>
         </c:forEach>
         </table>

我正在使用spring mvc作为我的web应用程序。我从数据库中获取优惠券列表,其名称和imagepath.i正在列表中显示所有名称。我想在弹出窗口中显示图像,点击name.i试过下面的代码,但它只显示每个名字的第一个记录图像。我想为每个名字单独的图像。请帮助我解决它

1 个答案:

答案 0 :(得分:0)

试试这个:

在forEach中添加varStatus="loop"并动态创建id id="myPopup${loop.index}"

<table>
     <c:forEach items="${couponlist}" var="list" varStatus="loop">
          <tr>
            <td><a href="#myPopup${loop.index}" data-rel="popup" data-position-              to="window" ><input type="text" name="couponName" value="${list.couponName}"     readonly></a>

           <div data-role="popup" id="myPopup${loop.index}">
            <p>This is my Coupon Image!</p> 
             <a href="#pageone" data-role="back"  class="ui-btn ui-corner-all ui -                  shadow ui-btn-a ui-icon-delete ui-btn-icon-notext ui-btn-right" ></a>
            <img src="${list.ImagePath}" style="width:800px;height:400px;"      alt="Skaret View" id="src" >
           </div>
          </td>               

           </tr>
         </c:forEach>
         </table>