Need a help with html table i have a table with 2 columns. in a row of first column i have a text when clicked on it it should display in the same row of next column a textarea. Is that possible....can someone help me
I am not so sure I understand exactly what you are trying to accomplish. Do you mean you want to have a column with links to a certain content and when that link is clicked you would like the content to be displayed in the second column? Or are you saying that you have the Content in column one and you want it to duplicate the content into column two when it is clicked as if it were copy and pasted there? I think there are probably much better alternatives to cause either one of these effects than using html though to be honest.
Hey there, You will have todo this all in javascript. If you're making the whole site change around I would recommend looking at jQuery or something like that to handle it all. Either way, you'll have something like: <table> <tr> <td id="row1col1"><a href="#" onclick="fillColumn2('row1col2');">column1</td> <td id="row1col2"><!-- this is column 2 --></td> </tr> </table> Then you'd have a javascript function like: <script language="javascript"> function fillColumn2(id) { var html = "<textarea id='textarea_" + id + "'></textarea>"; document.getElementById(id).innerHTML = html; } </script> I haven't tested that but it should give you a good starter block. Thanks, Francisco
Thank you for the qucik response..i need further help...what if i have one more row with cloumn2 when i click on it it should display textarea2 and whn i click on column1 it should display textarea1...and same goes on...Also, need help; step by step procedure to connect the frontend to backend (MS-access) <html> <head> <title></title> </head> <body> <table border="2" width="240"> <tr> <td id="row1col1" width="51"><a href="#" onclick="fillColumn2('row1col2');">column1</td> <td id="row1col2" width="177"><!-- this is column 2 --></td> </tr> <tr> <td id="row1col1" width="51">column2</td> <td id="row1col2" width="177"> </td> </tr> </table> <script language="javascript"> function fillColumn2(id) { var html = "<textarea id='textarea_" + id + "'></textarea>"; document.getElementById(id).innerHTML = html; } </script> </a> </body> </html>
Also, what if in column 2 rows are merged for eg: <html> <head> <title></title> </head> <body> <table border="2" width="240"> <tr> <td id="row1col1" width="51"><a href="#" onclick="fillColumn2('row1col2');">column1</td> <td id="row1col2" width="177" rowspan="2"><!-- this is column 2 --></td> </tr> <tr> <td id="row1col1" width="51">column2</td> </tr> </table> <script language="javascript"> function fillColumn2(id) { var html = "<textarea id='textarea_" + id + "'></textarea>"; document.getElementById(id).innerHTML = html; } </script> </a> </body> </html>
html> <head> <title></title> </head><body> <table border="2" width="240"> <tr> <td ="row1col1" width="50"><a href="#" onclick="fillColumn2('row1col2');">column1</td> <td ="row1col2" width="160"></td> </tr> <tr> <td ="row1col1" width="51">column2</td> <td ="row1col2" width="177"> </td> </tr> </table> </body> </html>
You need to show and hide content divs based on clicks. It will be something like this. onClick="document.getElementById['g1'].visibility.style='hidden';'none';/'display' etc.
A simple HTML table, containing two columns and two rows: ... A simple HTML table consists of the table element and one or more tr, th, and td elements. ...