How to arrange ArrayList values into rows and columns of html table?

Question

I am a beginner to programming, please be kind if I have committed any blunders in programming.

Below is my MySql table, it have one more row "Priority"

+-----------+-------------+-------------+-------------+--------+---------------------+
| pk_vcl_id | vehicle_nm  | reg_nu      | officer_mob | active | updated_at          |
+-----------+-------------+-------------+-------------+--------+---------------------+
|         1 | FireEngine1 | KL 07 AB 11 | 9744231482  |      0 | 2016-01-19 21:42:36 |
|         2 | Ambulance1  | KL 07 CD 43 | 9446238433  |      0 | 2016-01-15 00:23:20 |
|         3 | policecar1  | KL 07 E 52  | 8129938273  |      0 | 2016-01-15 00:23:38 |
|         8 | Signal      | NIL         | 1111111111  |      0 | 2016-01-18 23:42:01 |
+-----------+-------------+-------------+-------------+--------+---------------------+

I need to arrange the above data obtained from array list to the rows and columns of an html table. I tried several ways but not getting properly aligned.

Below is my arraylist in Java page:-

    while(rsgsts.next())
        {
        database.add(rsgsts.getString("vehicle_nm"));
        database.add(rsgsts.getString("reg_nu"));
        database.add(rsgsts.getString("active"));
        database.add(rsgsts.getString("officer_mob"));
        database.add(rsgsts.getString("priority"));
        database.add(rsgsts.getString("updated_at"));

        }

Below is my jsp page:-

    <%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%--     <%@page contentType="text/html; charset=UTF-8" errorPage="errorpage.jsp" pageEncoding="UTF-8"%> --%>
<%--      <%@ page import="com.my.classes.*" %> --%>

<%@ page import="java.util.*"%>
<%@ page import="java.util.Map"%>

<%@ page import="java.util.Arrays.*"%>
<%--         <%@page import="org.json.JSONArray"%> --%>
<%@ page import="java.util.ArrayList.*"%>
<%@ page import="java.io.*,java.util.*,java.sql.*"%>
<%@ page import="javax.servlet.http.*,javax.servlet.*"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta name="HandheldFriendly" content="true">
<meta name="viewport"
    content="width=device-width, initial-scale=0.666667, maximum-scale=0.666667, user-scalable=0">
<meta name="viewport" content="width=device-width">
<link rel="icon" type="image/png" href="favicon.png">

<title>Database</title>
</head>


<div id="header"></div>

<div id="logo"></div>



<%
    String xyz="name";
    //dbLayer db=new dbLayer();
    ArrayList<String> data = new ArrayList<String>();
    data.add("Test");
    data.add("Test1");
    data.add("Test2");
    data.add("Test3");
    data.add("Test4");
    data.add("Test5");
    data.add("Test6");
//    data.add("Test7");
//    data.add("Test8");
//    data.add("Test9");
    //db.getdata(xyz);

    int dbsize=data.size();
    int i=0;
    %>


<div>
    <table border="1" align="center">


        <tr>
            <td><b>Vehicle</b></td>
            <td><b>RegNumber</b></td>
            <td><b>Status</b></td>
            <td><b>MobileNum</b></td>
            <td><b>Priority</b></td>
            <td><b>Last_seen</b></td>
        </tr>
        <% //java goes here
            //int num = data.size() % 5;
            //if(num){}
                        /*To know how many 5 columns rows are in the arraylist*/
                        for (int n = 1; n < data.size() % 5; n++ ){
            %>
        <tr>
            <% //Loop through first row of table, aka first set of strings in arraylist

                        for (String str : data){
            %>

            <td>
                <% out.print(str);%>
            </td>


            <%
                     }
                 %>
            <%
                  }
                 %>
        </tr>
    </table>
</div>
</html>

Updated Output 23-Jan-2016:-

Vehicle RegNumber   Status  MobileNum   Priority    Last_seen
Test    Test1   Test2   Test3   Test4   Test5   Test6

Test 6 is printed as an additional row after Last_seen and when I added "test7, 8, 9" to arraylist nothing is being printed. Same when I tried with my actual arraylist returned from database.

I am able to get the same output as you got but that is not the exact result i need. from you arraylist values, i need to print "Test 1","Test 2","Test 3","Test 4" under column 'Regnumber' , 'Status', 'Priority', 'last seen' respectively — Ashref, Jan 22 '16 at 05:54
@Perdomoff Still everything is printing below the column "Vehicle" :( — Ashref, Jan 22 '16 at 11:25
@ Perdomoff Still it is not working properly. please see my updated question. :( — Ashref, Jan 23 '16 at 05:59
@Perdomoff I really appreciate your effort. but my original question was not just printing arrraylist into html table, i am able to do it myself. It was about arranging the arraylist values into rows and columns. You are able to get closer but still i cant use this code in my program. I am sorry — Ashref, Jan 23 '16 at 17:24

How to arrange ArrayList values into rows and columns of html table?

0 Answers0