Problems with twitter bootstrap carousel control?

Question

What I am trying to do is dynamically create slides in the Twitter Bootstrap Carousel control by connecting to a database, taking pictures from that database and populating the carousel with those images. For some reason, the carousel that I am working on will not slide. Anything wrong with my code?

<div id="myCarousel" class="carousel slide" data-interval="false">
    <!-- Carousel items -->
    <div class="carousel-inner">
        <%
            rs = stmt.executeQuery("SELECT IMG_NAME FROM IMAGES WHERE IMG_NAME LIKE 'Material%'");

            ResultSetMetaData rsmd = rs.getMetaData();

            while (rs.next()) {
                names.add(rs.getString(1));
            }

            double testDouble = names.size() / 3;
            int divider = names.size() / 3;

            if (testDouble > divider) {
                divider++;

            }

            int totalSpaces = divider * 3;
            int lastBit = totalSpaces % names.size();

            for (int j = 0; j < divider + 0; j++) {
                List<String> content = new ArrayList<String>();
                if (names.size() >= 3) {
                %>
                    <div class="active item">
                <%

                for (int x = 0; x < 3; x++) {
                    content.add(names.get(x));
                    String theUrl_2 = "http://localhost:8085/assignment/GetImage?name=" + content.get(x);                                           
                %>

                <a href="<%=theUrl_2%>">                                        
                    <div class="thumbnail">
                        <div class="caption">
                            <h4>3</h4>
                        </div>
                        <img src="<%=theUrl_2%>" alt="ALT NAME">
                        <div class="caption-btm">
                            <p>kjlkj</p>
                        </div>
                    </div>
                </a>

                <%
                }
                names.remove(2);
                names.remove(1);
                names.remove(0);
                %>

    </div>

                <%
                } else {
                %>
                <div class="item">
                <%
                    for (int i = 0; i < lastBit; i++) {

                        content.add(names.get(i));
                        String theUrl = "http://localhost:8085/assignment/GetImage?name=" + content.get(i);
                %>

                    <a href="<%=theUrl%>">
                        <div class="thumbnail">
                            <div class="caption">
                                <h4>1</h4>
                            </div>
                            <img src="<%=theUrl%>" alt="ALT NAME">
                            <div class="caption-btm">
                                <p>test</p>
                            </div>
                        </div>
                    </a>

                <%
                }
                %>

                </div>

                <%
                }
            }
        %>
</div>

Answer 1

What happened was I made it so that every set of three pictures that was possible were set as the "active item", or the set of three pictures that appeared first on the carousel. As a result, the carousel could not move because every set of three pictures technically came first. I used an if statement to test if the first three pictures were actually the first three pictures and called them the "active item" while every other image were added as default sets, which came later.

EDIT:

I used

if (names.size() >= 3 && j == 0) //j indicates which iteration we are on, j==0 is the first, j==1 is the second, etc.

instead of just

if (names.size() >=3)