CarkRoarryWab
New Member
I would first like to say that I spend the entire day looking up the answer to this question and could not find it anywhere. I hope someone can help me here. I am not experienced with jQuery at all and so please be patient with me. 
I have created code in classic ASP which generates a dynamic table of data which is pulled from a database. I want to be able to click on a DIV in the table and have it hide the data and show an input field. I wrote code which does this but it only does it for the first result which appears and does not work for the rest. The CLASS names are unique and so are the ID's but still doesnt allow the jQuery click event to function on the 2nd, 3rd, 4th etc rows.This is the jQuery code I have:\[code\]<script>$(document).ready(function(){ var taskId = $("div[class*='hide']").attr("id"); var edittaskId = $("div[class*='show']").attr("id"); $("#" + taskId).click(function(){ $("#" + taskId).hide(); $("#" + edittaskId).show(); });}); </script>\[/code\]This is the HTML/ASP code I have:\[code\] <div id="hide_<%=rs("id")%>" class="hide<%=rs("id")%>" align="right"><%=F_task_due_date%></div> <div id="show_<%=rs("id")%>" class="show<%=rs("id")%>" style="display: none;"> <div> <input type="text" name="edit_task_due_date" value="http://stackoverflow.com/questions/14542300/<%=F_task_due_date%>" /> </div> </div> </div>\[/code\]As I said, the code above works perfectly for the first DIV but doesnt work for the other DIVS below it in the table. How do I get this jQuery code to allow me to click on any of the other DIV elements, which match the response in the jQuery code, and also have them hide/show?Thank you in advance.
I have created code in classic ASP which generates a dynamic table of data which is pulled from a database. I want to be able to click on a DIV in the table and have it hide the data and show an input field. I wrote code which does this but it only does it for the first result which appears and does not work for the rest. The CLASS names are unique and so are the ID's but still doesnt allow the jQuery click event to function on the 2nd, 3rd, 4th etc rows.This is the jQuery code I have:\[code\]<script>$(document).ready(function(){ var taskId = $("div[class*='hide']").attr("id"); var edittaskId = $("div[class*='show']").attr("id"); $("#" + taskId).click(function(){ $("#" + taskId).hide(); $("#" + edittaskId).show(); });}); </script>\[/code\]This is the HTML/ASP code I have:\[code\] <div id="hide_<%=rs("id")%>" class="hide<%=rs("id")%>" align="right"><%=F_task_due_date%></div> <div id="show_<%=rs("id")%>" class="show<%=rs("id")%>" style="display: none;"> <div> <input type="text" name="edit_task_due_date" value="http://stackoverflow.com/questions/14542300/<%=F_task_due_date%>" /> </div> </div> </div>\[/code\]As I said, the code above works perfectly for the first DIV but doesnt work for the other DIVS below it in the table. How do I get this jQuery code to allow me to click on any of the other DIV elements, which match the response in the jQuery code, and also have them hide/show?Thank you in advance.