Tengo una tabla de 20 elementos con un link para cada uno, este link abre un popup donde se carga un jpg y la opción de descarga de un pdf.
No se como hacer para que cuando se haga click en el link correspondiente al 2, se envié esa información y se cambie en el div modal el 1.jpg por 2.jpg, asi este carga esa informacion. y asi mismo deberia hacer con los 20 items
Código HTML:
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>test</title> </head> <body> <table border="0" cellpadding="3" cellspacing="0" id="flattab" width="640"> <tbody> <tr> <td><strong>APPARTAMENTO</strong></td> <td><strong>LOCALI</strong></td> <td><strong>SUL/m<sup>2</sup>*</strong></td> <td><strong>TERRAZZA</strong></td> <td><strong>GIARDINO</strong></td> <td><strong>PREZZO</strong></td> <td><strong>SCHEDA PDF</strong></td> </tr> <tr class="rowog"> <td colspan="7"><strong>Piano terra</strong></td> </tr> <tr class="rowog" data-ogid="01"> <td>1</td> <td>4½ - 5½</td> <td>127,50 m<sup>2</sup> </td> <td>45 m<sup>2</sup></td> <td>60 m<sup>2</sup></td> <td>790.000 - Chf</td> <!-- en este caso deberia enviar a la div modal el numero 1 --> <td align="right"><a href="#modal" class="btn go"><img src="../images/pdf_icon.gif" /></a></td> </tr> <tr class="rowog" data-ogid="02"> <td>2</td> <td>4½ - 5½</td> <td>125,00 m<sup>2</sup></td> <td>40 m<sup>2</sup></td> <td>20 m<sup>2</sup></td> <td>750.000 - Chf</td> <!-- en este caso deberia enviar a la div modal el numero 2 --> <td align="right"><a href="#modal" class="btn go"><img src="../images/pdf_icon.gif" /></a></td> </tr> <tr class="rowog" data-ogid="03"> <td>3</td> <td>3½</td> <td>92,50 m<sup>2</sup></td> <td>40 m<sup>2</sup></td> <td>20 m<sup>2</sup></td> <td>585.000 - Chf</td> <!-- en este caso deberia enviar a la div modal el numero 3 --> <td align="right"><a href="#modal" class="btn go"><img src="../images/pdf_icon.gif" /></a></td> </tr> </tbody></table> <!-- --> <div id="modal"> <div class="modal-content"> <div class="header"><h2><table border="0" cellspacing="5" width="100%"> <tr> <!-- aqui esta el numero 1 (1.pdf), pero la proxima sera el 2 y asi sucesivamente --> <td align="left"><a href="1.pdf"><img src="../images/download.png" width="23" height="23" /></a></td> <td align="center"><a id="previousLink" href="#"><img src="../images/forward.png" width="23" height="23" /></a></td> <td align="right"><a href="#" class="btn"><img src="../images/close.png" width="23" height="23" /></a></td> </tr> </table></h2></div> <div class="copy"> <!-- aqui esta el numero 1 (1.jpg), pero la proxima sera el 2 y asi sucesivamente --> <img src="img/photos/1.jpg" width="732px" /> </div></div></div> </body>