как разбить столбцы в таблице с помощью JDBC

0

Я делаю простую таблицу, в которой хранятся данные о продукте из базы данных с использованием соединения jdbc.

Моя таблица выглядит так:

    <table>

     <td>

    <img border="3"  
        src="image path" height="200" width="200" />

        <p align="center"></p>    // these tag contains specific product details from db
        <p align="center"></p> 

      </td>   
      </table>

прямо сейчас я получаю детали каждого продукта в определенном столбце (т.е. несколько столбцов в пределах одной строки), но моя проблема в том, что эта строка продолжает расширяться, и я хочу, чтобы эта строка (состоящая из нескольких столбцов) автоматически прерывалась, скажем, после каждые 5 продуктов.

Простыми словами я хочу упорядочить детали своих продуктов в формате 4 xn, как и в flipkart, как показано ниже:

http://www.flipkart.com/mobiles/android-phones~type/pr?sid=tyy,4io&otracker=hp_nmenu_sub_electronics_0_Android%20phones

вы можете увидеть первый продукт sony experia, затем lg, после того, как продукт галактики samsung, новый ряд начинается, а затем снова 4 продукта, а затем новый ряд. Таким образом, мне нужно показать свои продукты, которые поступают из базы данных, используя соединение jdbc.

Может ли кто-нибудь предложить мне, какой наилучший способ достичь этого. & Есть ли возможность разбить столбцы после 4-го и затем начать новую строку?

Я показываю содержимое базы данных в jsp, как показано ниже, только для демонстрации:

       <%   
        //1. Retrieve all products from database   

        //1a.  Load the Driver   
        Class.forName("com.mysql.jdbc.Driver");   
        //1b.  Get a connection to the database   
        Connection con = DriverManager.getConnection("url", "un", "pwd
        PreparedStatement ps = con.prepareStatement("SELECT * FROM table");   
        //1d.  Execute and retrieve our result   
        ResultSet rs = ps.executeQuery();   

        //2. Base on the results returned, construct a table   
    %>   
    </p>   

    <table border="0">    
     <%     

     if(rs.next()) {        
     rs.beforeFirst();  // for making sure you dont miss the first record.      
      while(rs.next())      
          {                        // opening while loop brackets.      

     %>        



        <td>   
     <div style=""><img border="3"  
        src="<%=rs.getString("image") %>" height="200" width="200" /></div>   


        <p align="center"><%=rs.getString("title")%></p>
        <p align="center"><%=rs.getString("price")%></p> 

       </td>   


        <%        
            } //closing while loop bracket      
         }        
         else {        
             //if no record is found, simply display a no record message        
     %>        
         Nothing.        
         <%        
         }        
      %>     

       </table>
  • 0
    <tr> и </tr> могут оказаться полезными здесь.
  • 0
    Используйте div вместо таблицы для жидкого макета ... тот, который будет перемещаться в следующую строку в зависимости от ширины экрана.
Показать ещё 2 комментария
Теги:
jsp
html-table
jdbc

2 ответа

1

Используйте теги <tr> чтобы упорядочить таблицу в строках. (Это то, что он обозначает - * t * able * r * ow.)

Следите за тем, сколько продуктов (N) вы прочитали из базы данных. Если N кратно 4 (n % 4 == 0), закройте <tr> и запустите новый.

Результат выглядит так:

<table>
  <tr>
    <td>...</td>
    <td>...</td>
    <td>...</td>
    <td>...</td>
  </tr>
  <tr>
    <td>...</td>
    <td>...</td>
    <td>...</td>
    <td>...</td>
  </tr>
</table>

ОБНОВЛЕНИЕ на основе обновленного вопроса:

Здесь моя настройка основана на вашем коде. Я действительно не защищаю выполнение SQL-вызовов (или, действительно, любого кода без уровня представления) из JSP, но это вопрос для другого вопроса.

<%   
    //1. Retrieve all products from database   

    //1a.  Load the Driver   
    Class.forName("com.mysql.jdbc.Driver");   
    //1b.  Get a connection to the database   
    Connection con = DriverManager.getConnection("url", "un", "pwd
    PreparedStatement ps = con.prepareStatement("SELECT * FROM table");   
    //1d.  Execute and retrieve our result   
    ResultSet rs = ps.executeQuery();   

    //2. Base on the results returned, construct a table   
%>   
</p>   

<table border="0">
  <tr>
   <%     

   int i = 0;
   if(rs.next()) {
   rs.beforeFirst();  // for making sure you dont miss the first record.      
     while(rs.next())      
       {                        // opening while loop brackets.
   %>

    <td>   
      <div style=""><img border="3"  
          src="<%=rs.getString("image") %>" height="200" width="200" /></div>   


      <p align="center"><%=rs.getString("title")%></p>
      <p align="center"><%=rs.getString("price")%></p> 

    </td>

    <%
      i++;
      if ((i % 4) == 0) {
    %>
        </tr>
    <%
      }

      if (!rs.isLast()) {  // don't open a new row if this is the last result
    %>
        <tr>
    <%
      }  // closing isLast check
    %>

    <%        
        } //closing while loop bracket      
     }        
     else {        
         //if no record is found, simply display a no record message        
 %>        
     Nothing.        
     <%        
     }        
  %>     
    </tr>

   </table>

У меня действительно нет терпения, чтобы исправить пробелы здесь, и я на самом деле не скомпилировал это, но, надеюсь, вы получите суть.

Поделиться
  • 0
    эй, но где уместно поставить цикл while в соответствии с приведенной выше структурой таблицы, чтобы получить 4 столбца и n строк
  • 0
    Структура таблицы, которую я предоставил, является вашим выводом. Каждый <tr> является строкой таблицы. Поместите 4 <td> в каждый <tr> и у вас есть 4 столбца и N строк. Вы не помещаете петлю в таблицу; Вы делаете цикл в своем коде для генерации вышеуказанной структуры. Какой ваш текущий код для генерации вашей текущей таблицы? Обновите свой вопрос, и я обновлю свой ответ.
Показать ещё 3 комментария
1

Помимо ответа от dcsohl, вы можете использовать комбинацию элементов <div> и <span>. Элемент <div> является блочным элементом, то есть каждый <div> будет отображаться в новой строке. Элемент <span> является встроенным элементом.

Это должно помочь вам:

<div>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
</div>
<div>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
</div>
<div>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
</div>
Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню