GetElementByID - Partial IDs - WebDeveloper.com Forums

GetElementByID - Partial IDs

pkavanagh

Been wondering about this. With .net and controls that runat server, the ids are often changed to reflect their hierarchy on the control tree for the page. So, a link with the id "lnkNav" might become something like "ctl10_ctl15_lnkNav" when rendered to the browser.

Given this, and that I don't know exactly what the rendered id will be at runtime, if I want to access client side (assume no server side code for this), how can I find the actual id from the partial string lnkNav?

Thanks,

Paul

Kor

This should work

function getRealId(partialid){
var re= new RegExp(partialid,'g')
var el = document.getElementsByTagName('*');
for(var i=0;i<el.length;i++){
if(el[i].id.match(re)){
alert(el[i].id)
}
}
}

Now pass the partial id to the function.

The code will work with reasonable speed if the page has a reasonable number of tags. If too many, the loop should be restricted somehow, for instance if your element with that id is nested in a certain parent (a table, a div, ...something like that)

For instance:
var el = document.getElementById('myTable').getElementsByTagName('*');

pkavanagh

Thanks Kor!!! I see what you mean about limiting the loop. Problem is that parent or container element ids may also be generated/modified by .net at runtime.

But I think that specifying a tag name should work in most cases. In any cases that I have needed this, I would know the element that I want to get a handle on. So I will try something like:

Kor

To speed the code, you may also break the loop, if you are looking for a single element

if(el.id.match(re)){
alert(el.id);break;
}

StrikeEagle

I know you said no-server-side code, but you really should be using the 'ClientID' attribute in .net to get the ID of a control. This way you are guaranteed to get the correct client-side ID.

pkavanagh

StrikeEagle wrote:
I know you said no-server-side code, but you really should be using the 'ClientID' attribute in .net to get the ID of a control. This way you are guaranteed to get the correct client-side ID.

Yep, agreed, but there are cases where I am modifying or working with controls where I do not have access to the source. For this type of case I am trying to kludge together a method for getting access some page elements via Javascript.

DssTrainer

Just wanted to say thank you here. I came across this code and this was exactly what i needed for my project.

Kor

DssTrainer wrote:
Just wanted to say thank you here. I came across this code and this was exactly what i needed for my project.

You are welcome. That was an old post. Meanwhile I have learned that a while loop is faster:

function getRealId(partialid){
var re= new RegExp(partialid,'g');
var elems = document.getElementsByTagName('*'), i=0, el;
while(el=elems[i++]){
if(el.id.match(re)){
alert(el.id);
}
}
}