jsp - I want rows to be clickable an that highlights the corresponding button in the row.How to do it? -


my html table fetches data database.the row database fetched in html table.each table have button. want click particular row , highlight particular button.

  try{             class.forname("com.mysql.jdbc.driver");         connection conn = drivermanager.getconnection("jdbc:mysql://localhost/lvcdatabase","root","java");         string query = "select * kitchentable;";         preparedstatement pst = conn.preparestatement(query);         resultset rs =pst.executequery(query);         while(rs.next()){    %>     <form action="processorder" method="">       <table id="example" >       <%string s = string.valueof(rs.getint("orderno"));%>         <tr id="row<%=s%>" onclick="a(<%=s%>)">           <td><%=rs.getint("orderno")%></td>           <td><%=rs.getstring(3)%></td>           <td><%=rs.getstring(3)%></td>           <td><%=rs.getstring(5)%></td>           <td><input class="service" id="service<%=s%>" onclick="b(<%=s%>)" type="button" value="service status"></td>          </tr>              <tr id="buttonrow">            <td colspan="1"></td>            <td colspan="1"><input type="button" style="background-color:#ff0000" value="pending" id="redbutton<%=s%>" class="statusbutton"></td>            <td colspan="1"><input type="button" style="background-color:#ffbf50" value="cooking" id="amberbutton<%=s%>" class="statusbutton"></td>            <td colspan="1"><input type="button" style="background-color:#66ff66" value="cooked" id="greenbutton<%=s%>" class="statusbutton"></td>            <td colspan="1"></td>          </tr>       </form><br>    <%} %>    </table>    <%rs.close();    pst.close();    conn.close();    }catch(exception e){          system.out.println("error: "+e.getmessage());     }     %> 

my javascript code: (searches on google helped me nd got desired output)

<script>  function a(x){     document.getelementbyid("redbutton"+x).style.backgroundcolor ="#b20000";     document.getelementbyid("redbutton"+x).value="queued";    document.getelementbyid("amberbutton"+x).style.backgroundcolor="#ffbf00";     document.getelementbyid("amberbutton"+x).value ="processing"; }  function b(x){  document.getelementbyid("greenbutton"+x).style.backgroundcolor="green"; document.getelementbyid("amberbutton"+x).style.backgroundcolor="#ffbf50"; document.getelementbyid("service"+x).value="serviced";  } 


Comments