Member Avatar for feoperro

Hi,

I'm having a problem debugging a piece of code. I will paste the JSP version (that works) and then the exact same thing in Servlet form (that does not work). The code's function is to change a picture on mouseover and then revert onmouseout. I will paste for only one of the buttons, since they do the same thing.

JSP:

<script language='javascript'>
            function changeOn(object, objectId) {
                if (object == 'bookingsButton') {
                    document.getElementById(objectId).src = 'Images/BookingsOn.png';
                } else if (object == 'detailsButton') {
                    document.getElementById(objectId).src = 'Images/DetailsOn.png';
                }
            }
            function changeOff(object, objectId) {
                if (object == 'bookingsButton') {
                    document.getElementById(objectId).src = 'Images/Bookings.png';
                } else if (object == 'detailsButton'){
                    document.getElementById(objectId).src = 'Images/Details.png';
                }
            }
        </script>


    <body>
            <img src='Images/Details.png' alt='More information' id='detail1' onMouseover="document.body.style.cursor='hand'; changeOn('detailsButton', 'detail1');" onMouseout="document.body.style.cursor='default'; changeOff('detailsButton', 'detail1');">
    </body>

Servlet:

out.println("<script language='javascript'>");
            out.println("function changeOn(object, objectId) {");
            out.println("if (object == 'bookingsButton') {");
            out.println("document.getElementById(objectId).src = 'Images/BookingsOn.png';");
            out.println("} else if (object == 'detailsButton') {");
            out.println("document.getElementById(objectId).src = 'Images/DetailsOn.png';");
            out.println("}");
            out.println("}");
            out.println("function changeOff(object, objectId) {");
            out.println("if (object == 'bookingsButton') {");
            out.println("document.getElementById(objectId).src = 'Images/Bookings.png';");
            out.println("} else if (object == 'detailsButton'){");
            out.println("document.getElementById(objectId).src = 'Images/Details.png';");
            out.println("}");
            out.println("}");
            out.println("</script>");

int rowCounter = 0;
 while (flatResultSet.next()) {
                rowCounter++;
 out.println("<img src='Images/Details.png' alt='More information' id='detail" + rowCounter + "' onMouseover=\"document.body.style.cursor='hand'; changeOn('detailsButton', 'detail" + rowCounter + "');\" onMouseout=\"document.body.style.cursor='default'; changeOff('detailsButton', 'detail" + rowCounter + "');\">");

If you crack this, you are a genius.

Thanks,
-Ashton

The code looks ok. That's probably what your saying. Do a view source of the page after the servlet sends it out. There may be another element affecting it. Like a missing closing tag. When you do a view source, make sure all your quotation marks are correct.
Hope that helps

Member Avatar for feoperro

I tried to view source, it uses ajax so it doesn't present the source in view source. The reason why I did a multi-dimensional view (Servlet/JSP) above is because of that reason.

Thanks,
-Ashton.

Then you need to get a debugger. The best is Firefox and Firebug. With that you can inspect the dynamic content. Try it. You'll like it.

Member Avatar for feoperro

Thanks for your input.

I see no reason why you trying to force that JavaScript into servlet. Do you care to explain?
Servlet deals with server logic and process client request, it does not interfere with client side of view.

Member Avatar for feoperro

I understand.

The reason why I used javascript there is because further down the code section of the servlet are resultSet and db calls that print out table rows that hold the "<img />" buttons. There is no actual JSP page for this, only a set of servlet code that generates a page with DB content placed in table cells, etc...

I understand.

The reason why I used javascript there is because further down the code section of the servlet are resultSet and db calls that print out table rows that hold the "<img />" buttons. There is no actual JSP page for this, only a set of servlet code that generates a page with DB content placed in table cells, etc...

You should move away from this and deploy some framework to help you with client view...

Member Avatar for feoperro

Any suggestions?

Even use of JSTL would help you with this task. You can see simple usage in JSP section here (section at the end is showing how to get rid of sniplets and replace it with proper tag library). If you looking for more elegant solution consider any of the frameworks as suggested before. Here is quick overview

Member Avatar for feoperro

Thanks a lot, the original problem was:
As each row is generated, a button is created for that row (unique to that row, and identified by the "id" function). Although the button (or <img>) Id's are set to unique ID's, they cannot be found when referencing them at a later stage. Before I read all that, are you sure one of those technologies will solve this problem?

Yes

Member Avatar for feoperro

Coolbeans. Thanks.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.