CODEWITHSUNDEEP
javascripthtmlasp.net
Charlie
Charlie

Reputation: 110

getElementByID with dynamic ID

Hi I have a problem with my javascript within an ASP SharePoint web part page. The page is built the same as any other ASP page so the fact that its hosted within SharePoint shouldn't make any difference.

The problem is with my javascript within the page. I have Html Table made up of 8 cells. For each of these cells I am displaying a different div with different data within it onmouseover.

The problem comes with the ID for the Divs that I am trying to display. The Divs ID is changed at runtime but also changes daily so cant be inputted manually.

HTML:

<div id="Main" style="display: none;
    <div id="hover1" runat="server" style="display: none">
        Test
    </div>
</div>

<table id="Table3" runat="server" >
    <tr id="Tr8" runat="server" >
        <td id="status1" runat="server" onmouseover="getDataXML('hover1')" onmouseout="hideDiv('hover1')">
            Received
        </td>
    </tr>
</table>

The id 'hover1' at runtime is replaced with something like 'ctl00_m_g_6ddac285_ceb9_4b5a_9095_c4b216cf7dfd_ctl00_hover1'

Javascript:

function getDataXML(getID) {
        document.getElementById('Main').style.display = "block";
        document.getElementById(getID).style.display = "block";
    };

The javascript works if I take the ID which is generated and hard code it but the ID changes daily meaning it becomes a problem. Any help I would greatly appreciate

Regards,

Upvotes: 1

Views: 1117

Answers (2)

Ehsan Sajjad
Ehsan Sajjad

Reputation: 62488

you have to pass clientId like this:

onmouseover="getDataXML('<%=hover1.ClientID %>')"

or alternatively set ClientIDMode to Static, but in that case if you change div id in aspx, you have to explicitly change where you have used Id and it will be difficult to catch becuse there will be no compile time error.

Upvotes: 0

Mr.Cocococo
Mr.Cocococo

Reputation: 1451

Set clientIdMode = static to the element

 <div id="hover1" clientIdMode="static" runat="server" style="display: none">

Upvotes: 2

Related Questions