CODEWITHSUNDEEP
javascriptjqueryjsp
user3462609
user3462609

Reputation: 105

Making the whole row clickable

I was trying to make a whole row of my tables on jsp page clickable for it i wrote following code in jsp page :

<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.ResultSet"%>
<%@page import="java.beans.Statement"%>
<%@page import="java.sql.Connection"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="js/clickablerow.js"></script>
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>MY DATA</title>
</head>
<body>
<%!Connection con; %>
<%!PreparedStatement s; %>
<%!ResultSet rs; %>

<% String name=request.getParameter("q");
//out.println(name);
try{
Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
con=DriverManager.getConnection("jdbc:odbc:SharedCryptography", "fyp", "fyp");

String groupidd = request.getSession().getAttribute("groupid").toString();

//out.println(groupidd);
/*String sql="select * from tbIndividual where I_NAME like ? "
        + "and I_ID in "
        + "(select I_ID from TBWAITINDIVIDUALS "
        + "where GROUP_ID <> '"+groupidd+"')";
*/
String sql="select * from tbIndividual where I_NAME like ?";




s = con.prepareStatement(sql);
s.setString(1, name + "%");
rs=s.executeQuery();
}
catch(Exception e){ 
e.printStackTrace(); 
}
%>

<div id="dtl_table"><table border='3' cellpadding='5' cellspacing='2' width="400px">
<tr bgcolor="66FF00">

<th>ID</th>
<th>NAME</th>
<th>FIRSTNAME</th>
<th>LASTNAME</th>
</tr>

    
<% while(rs.next())
{ %>
<%String storid=rs.getString(1);%>
<tr class="clickableRow" href="individualdetailstoadd.jsp?personid=<%=storid%>">
<td><%=storid%></td>
<td><%=rs.getString(2)%></td>
<td><%=rs.getString(4)%></td>
<td><%=rs.getString(5)%></td>
</tr>
<tr/>
<% } %>
</tr>
</table></div>

</body>
</html>

And included

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="js/clickablerow.js"></script>

at top of the page and in clickablerow.js i wrote :

jQuery(document).ready(function($) {
  $(".clickableRow").click(function() {
        window.document.location = $(this).attr("href");
  });
});

Am I doing something wrong? As this is not working.

Upvotes: 0

Views: 713

Answers (2)

Banana
Banana

Reputation: 7484

first of all, you can reduce your jQuery ready call to:

$(function() {
}

its the exact same.

now, i think you would want to delegate your click handler, meaning you attach it to the document instead, so the document will search for the clickable row and handle its click events:

$(function() {
  $(document).on("click",".clickableRow",function() {
        window.document.location = $(this).attr("href");
  });
});

Upvotes: 1

Siva Charan
Siva Charan

Reputation: 18064

href is a wrong attribute for tr

You can use the concept of data

Example:

Prefix href with data

<tr class="clickableRow" data-href="

Write JQuery as below

$(".clickableRow").click(function() {
        window.document.location = $(this).data("href");
});

Upvotes: 0

Related Questions