1. We have moved from vBulletin to XenForo and you are viewing the site in the middle of the move. Though the functional aspect of everything is working fine, we are still working on other changes including the new design on Xenforo.
    Dismiss Notice

How can I remove DOM element using Tag type and not by ID?

Discussion in 'Web Design, HTML And CSS Forums' started by nimesh, Jun 18, 2009.

  1. nimesh

    nimesh New Member

    I'm using ASP.NET gridview, with Sorting, which automatically generated the link for sorting.
    And I want to copy all the data from Gridview to clipboard, except the anchor tags for sorting.

    Currently I'm copying the HTML using outerhtml property, which also brings the anchor tags with it.

    This is the code I used to copy the html content.
    Code:
    javascript:window.clipboardData.setData('Text', document.getElementById('GridView1').outerHTML)
    which now I've modified to a function
    Code:
        function copydata(){
            var obj = document.getElementById('GridView1');
            if (!obj) return false;
            var Elem = obj.getElementsByTagName('a');
            for (var i = 0; i < Elem.length; i++) {
                obj.removeChild(Elem[i]);
            }
            window.clipboardData.setData('Text', obj.outerHTML);
        }
    But the problem is that the function removeChild only works with tag ID and not tag name.

    The HTML that is getting generated does not contain ID in the anchor tags
    Code:
    <table cellspacing="0" cellpadding="4" rules="all" border="1" id="GridView1" style="color:Black;background-color:White;font-family:Arial;font-size:X-Small;border-collapse:collapse;">
    	<tr style="color:White;background-color:#6B696B;font-weight:bold;">
    		<th scope="col"><a href="javascript:__doPostBack('GridView1','Sort$SID')" style="color:White;">SID</a></th>
    		<th scope="col"><a href="javascript:__doPostBack('GridView1','Sort$SERIAL#')" style="color:White;">SERIAL#</a></th>
    		<th scope="col"><a href="javascript:__doPostBack('GridView1','Sort$OSUSER')" style="color:White;">OSUSER</a></th>
    		<th scope="col"><a href="javascript:__doPostBack('GridView1','Sort$USERNAME')" style="color:White;">USERNAME</a></th>
    		<th scope="col"><a href="javascript:__doPostBack('GridView1','Sort$MACHINE')" style="color:White;">MACHINE</a></th>
    		<th scope="col"><a href="javascript:__doPostBack('GridView1','Sort$TERMINAL')" style="color:White;">TERMINAL</a></th>
    		<th scope="col"><a href="javascript:__doPostBack('GridView1','Sort$PROGRAM')" style="color:White;">PROGRAM</a></th>
    		<th scope="col"><a href="javascript:__doPostBack('GridView1','Sort$STATUS')" style="color:White;">STATUS</a></th>
    		<th scope="col"><a href="javascript:__doPostBack('GridView1','Sort$LOGON_TIME')" style="color:White;">LOGON_TIME</a></th>
    </tr>
    Can anyone help me in doing this? or suggest a better option
     
    Last edited: Jun 18, 2009
  2. nimesh

    nimesh New Member

    Well... no ones here to answer :)

    I just set it to style.display="none"
     

Share This Page