Создание кнопок с al oop in JSP, где каждая кнопка задает различное значение - PullRequest
0 голосов
/ 06 апреля 2020

Здесь таблица чисел генерируется с помощью al oop. Каждое значение в таблице представляет собой кнопку, которая при нажатии отображает значение, в 10 раз превышающее значение во всплывающем окне. В реальном проекте данные находятся в jsp, поэтому я не могу использовать javascript.

Пожалуйста, помогите.

Вот мой JSP:

<HTML>
<title> Hi </title>
<%
out.println("         <table border = \"1\" align=\"center\" width='600'>\n" +
                "         <tr>\n" +
                "            <th> Number </th>\n" +
                "         </tr>");
int i;
for(i=0;i<10;i++){
 out.println("         <tr>\n" +
                             "            <td style = \"text-align:center\" height=\"40\"> <font style=\"color: black >" + "<button onclick=\"document.getElementById('id01').style.display='block'\" style=\"width:auto; -webkit-box-align: center; \"> " +i+ " </button>  </a>" +"</font> </td>\n" +
                    "         </tr>   ");

}

%>
</HTML>

DIV:

   <div id="id01" class="modal">

        <div class="modal-content animate" >
            <div class="imgcontainer">
                <span onclick="document.getElementById('id01').style.display='none'" class="close" title="Close Modal">&times;</span>
                <img src="doctor.jpg" alt="Avatar" class="avatar">
            </div>

            <div class="container"><centre>
                <%
                    //                    
                    // I need to display id*10;
                    // 
                    //
                %>
            </centre></div>


        </div>
    </div>

Проблема в том, что я равен 9 к концу l oop, поэтому «я» из отдельных кнопок теряется. Пожалуйста помоги.

1 Ответ

0 голосов
/ 06 апреля 2020

Вы можете написать весь модальный <div> код внутри другого for l oop с изменением id s, и onclick для каждой кнопки отобразит соответствующее модальное всплывающее окно.

Здесь ваш JSP:

<HTML>
<title> Hi </title>
<%
out.println("         <table border = \"1\" align=\"center\" width='600'>\n" +
                "         <tr>\n" +
                "            <th> Number </th>\n" +
                "         </tr>");
int i;
for(i=0;i<10;i++){
 out.println("         <tr>\n" +
                             "            <td style = \"text-align:center\" height=\"40\"> <font style=\"color: black >" + "<button onclick=\"document.getElementById('" + "id" + i + "').style.display='block'\" style=\"width:auto; -webkit-box-align: center; \"> " +i+ " </button>  </a>" +"</font> </td>\n" +
                    "         </tr>   ");

}

%>
</HTML>

DIV:

<%  int j=0;
    for (j=0;j<10;j++){ %>

   <div id='<%= "id"+j %>' class="modal">

        <div class="modal-content animate" >
            <div class="imgcontainer">
                <span onclick="document.getElementById('<%= "id"+j %>').style.display='none'" class="close" title="Close Modal">&times;</span>
                <img src="doctor.jpg" alt="Avatar" class="avatar">
            </div>

            <div class="container"><centre>
                <%= "id"+j %>
            </centre></div>


        </div>
    </div>

<%  } %>

Я протестировал его на TutorialsPoint и, кажется, работает нормально.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...