SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Addict
    Join Date
    Sep 2004
    Location
    Denver
    Posts
    385
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Remove table with DOM

    Greetings, I use asp.net controls which produce a load of unneeded tables and wraps it around my data. I'm trying to get rid of of all the tables (<table><tbody><tr><td>) with the DOM while preserving everthing inside of them. Is this doable? and What's the most efficeient way to accomplish this? Any code samples would be appreciated. Thanks.

  2. #2
    I'll take mine raw silver trophy MikeFoster's Avatar
    Join Date
    Dec 2002
    Location
    Alabama, USA
    Posts
    2,560
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi cbiti,

    It is definitely doable, but we'd have to see your page to make any specific suggestions.

    Describe your overall "layout". Header, 2 columns, footer - etc.

    Btw... I know nothing about asp.net

  3. #3
    I'll take mine raw silver trophy MikeFoster's Avatar
    Join Date
    Dec 2002
    Location
    Alabama, USA
    Posts
    2,560
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Maybe I misunderstood your question. Now that I re-read it... you're not wanting to do this dynamically, are you?

    It seems that you should be able to "start" with a good CSS-based layout, then add your asp controls... but then again, I know nothing about asp

  4. #4
    SitePoint Wizard Pepejeria's Avatar
    Join Date
    Jan 2005
    Location
    Too far up north
    Posts
    1,566
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Assuming you want to delete this dynamically with JavaScript:
    Code:
    <html>
    <body>
    
    <table id="whateverData">
    <tr>
    	<td>Some random data</td>
    </tr>
    </table>
    
    <script>
    var oTableData = document.getElementById("whateverData");
    var oDeletedTable = oTableData.parentNode.removeChild(oTableData);
    </script>
    
    </body>
    </html>
    oDeletedTable will have the reference to the deleted table node (including its child nodes) that you can later resuse.

  5. #5
    SitePoint Addict
    Join Date
    Sep 2004
    Location
    Denver
    Posts
    385
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Mike, all I need is basicially just like what pepjeria is suggesting above, but his script removes the table and everything inside it. I want the script to move just the table while perserving everything inside it.
    ie: remove the <table><tr><td>'s but keep any other html elements inside the <td>'s
    thoughts? Thanks.

  6. #6
    SitePoint Wizard Pepejeria's Avatar
    Join Date
    Jan 2005
    Location
    Too far up north
    Posts
    1,566
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code:
    var oTableData = document.getElementById("whateverData");
    var oDeletedTable = oTableData.parentNode.removeChild(oTableData);
    
    // IE
    // oDeletedTable.innerText
    
    // Modern browsers
    // oDeletedTable.textContent
    
    /* Use whatever is supported, note that if both of these are not supported, then
       sTableText will be equal to undefined. 
    
       Mozilla will preserve the whitespace in the text, IE will not */
    var sTableText = oDeletedTable.innerText || oDeletedTable.textContent;
    
    alert(sTableText);

  7. #7
    SitePoint Enthusiast
    Join Date
    Sep 2002
    Location
    Melbourne, Australia
    Posts
    82
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I don't know about anyone else but in my experiances I would suggest using removeChild rather than deleteRow using sectionRowIndex because that always seems to stuff up if you have complex tables.
    sigy


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •