asked on
How to fix this jquery fancybox/loop problem?
Hi,
I have a recordset loop in ASP, and when someone click in some row of this loop table, it launchs a fancybox iframe with some detailed information, when I click in the first item of the loop table the launchbox opens fine, but when I click in any other row below, it does not work. I believe the problem is something about the ID value (pergunta) of the link , I'm using the same ID to all rows to launchl the fancybox iframe, but I don't know how could I fix this, anyone may help?
Thanks
I have a recordset loop in ASP, and when someone click in some row of this loop table, it launchs a fancybox iframe with some detailed information, when I click in the first item of the loop table the launchbox opens fine, but when I click in any other row below, it does not work. I believe the problem is something about the ID value (pergunta) of the link , I'm using the same ID to all rows to launchl the fancybox iframe, but I don't know how could I fix this, anyone may help?
Thanks
<script>
$("#pergunta").fancybox({
'padding' : 0,
'autoScale' : false,
'width' : 650,
'height' : 500,
'transitionIn' : 'none',
'transitionOut' : 'none',
'centerOnScroll' : true,
'type' : 'iframe'
});
</script>
<%
while RS3.eof = false
%>
<div class="pane spam">
<h3 class="destaque-laranja-1"><%=left(ConverterDataOut(RS3("data")),10)%> - <%=RS3("nome")%> pergunta:</h3>
<p class="texto-geral-1"><%=RS3("texto")%></p>
<p class="texto-geral-2"><a id="pergunta" href="ver-resposta.asp?cod=<%=RS3("cod")%>&cod_pergunta=<%=RS3("cod_pergunta")%>" class="btn-unapprove">RESPOSTA COMPLETA</a></p>
</div>
<%
RS3.movenext
wend
%>
JavaScriptjQuery
Last Comment
Onthrax
ASKER CERTIFIED SOLUTION
THIS SOLUTION ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
That will work indeed as that searched for all elements with that class. However it is still not a good idea to use duplicate ID's.
ASKER
Hello,
Thank you Seo Expert, I used the code below and it worked, but it's still with duplicated classes (anymore IDs), besides the code is working fine with this adaptation, what are the problems I can have with it?
Onthrax, you showed how I could do the differents IDs to each row, but about the jquery code, I also have to make any change in the code to it works, no?
Thank you Seo Expert, I used the code below and it worked, but it's still with duplicated classes (anymore IDs), besides the code is working fine with this adaptation, what are the problems I can have with it?
Onthrax, you showed how I could do the differents IDs to each row, but about the jquery code, I also have to make any change in the code to it works, no?
ASKER
the code I used
<script>
$(".pergunta").fancybox({
'padding' : 0,
'autoScale' : false,
'width' : 650,
'height' : 500,
'transitionIn' : 'none',
'transitionOut' : 'none',
'centerOnScroll' : true,
'type' : 'iframe'
});
</script>
<%
while RS3.eof = false
%>
<div class="pane spam">
<h3 class="destaque-laranja-1"><%=left(ConverterDataOut(RS3("data")),10)%> - <%=RS3("nome")%> pergunta:</h3>
<p class="texto-geral-1"><%=RS3("texto")%></p>
<p class="texto-geral-2"><a class="pergunta" href="ver-resposta.asp?cod=<%=RS3("cod")%>&cod_pergunta=<%=RS3("cod_pergunta")%>" class="pergunta btn-unapprove">RESPOSTA COMPLETA</a></p>
</div>
<%
RS3.movenext
wend
%>
SOLUTION
THIS SOLUTION ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
To give an unique ID do something like this:
<%
Dim i
i = 0
while RS3.eof = false
%>
<div class="pane spam">
<h3 class="destaque-laranja-1"
<p class="texto-geral-1"><%=R
<p class="texto-geral-2"><a id="pergunta<% =i %>" href="ver-resposta.asp?cod
</div>
<%
i = i + 1
RS3.movenext
wend
%>
This will create each row with a new iD e.g. pergunta0, pergunta1, pergunta2 etc.
I'm not that familiar with jQuery though, but from what I've seen there is probably some method of binding your script to each hyperlink within the divs that have class texto-geral-2.