Can I reference controls relatively?

[tomouse]

Hi. I have an ASP page (with masterpage) in which users can add multiple Web User Controls (from ASCX file). These contain multiple controls including two radio buttons and a text field. I want to use javascript to disable the text field if the user clicks on one of the radio buttons.

Because there are potentially multiple sets of the text field and radio buttons on the page, I'm not sure how to reference the text field direction. I was thinking perhaps the way to do it would be to reference the text field relatively (if that's the word). I can pass the radio button object to my javascript function and am now looking for a way to say something like

function DisableField(rb) {
    var txtField = rb.parent.find('textfield');
    txtField.disabled = True;
}

Is this possible? Or is there a better way to approach this?

As you can see, I'm not big on javascript (though I do think it's great!). I've been searching for a while, but haven't found what I'm looking for. Any help much appreciated.

 

[vacunita]

You could go through the elements of the parent container of the radio button until you find a text field though unless you have some way of positively identifying the text field such as a unique name or id, or it being the only text field in the parent container there's no way to isolate it.

However if you know it will be the only text field in the parent container you could do something like this:

var elms=rb.parentNode.childNodes;
  for(var i=0; i <= elms.length-1; i++){
     if(elms[i].type=='text'){
       var textField=elms[i];
     }
  }
textField.disabled=True;

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.

http://behindtheweb.blogspot.com/

 

[tomouse]

Thanks for this Phil, looks like a good starting point for me.

Unfortunately there are a few text fields in all, but perhaps I could, by trial and error, set it to disable the first text field encountered and see if I get the right one. If not then I could change the function to disable the second text field encountered and so on, until I get the result I'm looking for?

Presumably the order in which the fields are encountered would be the same every time? Not exactly elegant I know, but would it work? I guess the danger would be that some change is made to the control in the future (e.g. another text field added) and that would break things. If I know the name of the field on the server side, is there no way that I can use this to identify the field as rendered on the client?

 

[vacunita]

Technically, yes the order is the same every time. Basically its the order in which they can be found in the source code.

However, if you have a name, perhaps you could send that as part of the function in the onClick event of the radio button, and then use that to search the childNodes to get the correct one:

function myfunction(rd,[red]nameParam[/red]){
...
var elms=rb.parentNode.childNodes;
  for(var i=0; i <= elms.length-1; i++){
     if(elms[i].type=='text' && elms[i].name==[red]nameParam[/red]){
       var textField=elms[i];
     }
  }
textField.disabled=True;



....



<input type="radio" onClick="myfunction(...,[red]serversSideNamevar[/red]");...>

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.

http://behindtheweb.blogspot.com/