Reading the contents of HTML Object and comparing it

[sahilchopra]

Hi, for the given structure of HTML below:___________________________________________________________________________________________________________________________________________________<DIV align=center __squish__onclick="true"><BR> <BR> <SPAN id=ctl00_ContentPlaceHolder1_lblSelTP style="FONT-WEIGHT: bold">Please select the timepoints</SPAN> <BR> <BR> <DIV id=ctl00_ContentPlaceHolder1_pnlGrdTP style="OVERFLOW-Y: scroll; WIDTH: 800px; HEIGHT: 300px"> <DIV> <TABLE class=grid id=ctl00_ContentPlaceHolder1_grd style="BORDER-COLLAPSE: collapse" cellSpacing=0 rules=rows border=1 widht="100%"> <TBODY> <TR class=headera style="COLOR: black; HEIGHT: 20px"> <TH scope=col>TP Stage</TH> <TH scope=col>TP Name</TH> <TH scope=col>Days From Enrollment</TH> <TH scope=col>Select</TH></TR> <TR class=row> <TD>Screening/Baseline</TD> <TD>Baseline</TD> <TD>0</TD> <TD><INPUT id=ctl00_ContentPlaceHolder1_grd_ctl02_CheckBoxTP type=checkbox name=ctl00$ContentPlaceHolder1$grd$ctl02$CheckBoxTP> </TD> </TR> </TBODY> </TABLE> </DIV> </DIV> <BR><INPUT id=ctl00_ContentPlaceHolder1_OkButton style="WIDTH: 60px" type=submit value=OK name=ctl00$ContentPlaceHolder1$OkButton> <INPUT id=ctl00_ContentPlaceHolder1_CancelButton style="WIDTH: 60px" type=submit value=Cancel name=ctl00$ContentPlaceHolder1$CancelButton> </DIV>_______________________________________________________________________________________________________________________________________________________I am interested in reading the following (also made BOLD above) values from the structure: <TD>Baseline</TD> <TD><INPUT id=ctl00_ContentPlaceHolder1_grd_ctl02_CheckBoxTP type=checkbox name=ctl00$ContentPlaceHolder1$grd$ctl02$CheckBoxTP> </TD>If 'Baseline' values match with the input I wish to toggle the state of checkbox in <TD><INPUT id=ctl00_ContentPlaceHolder1_grd_ctl02_CheckBoxTP type=checkbox name=ctl00$ContentPlaceHolder1$grd$ctl02$CheckBoxTP> </TD>

[thescientist]

give them ID's so you can reference them using document.getElementById and then compare the innerHTML/value.

[sahilchopra]

Hi, for the given structure of HTML below:___________________________________________________________________________________________________________________________________________________<DIV align=center __squish__onclick="true"><BR> <BR> <SPAN id=ctl00_ContentPlaceHolder1_lblSelTP style="FONT-WEIGHT: bold">Please select the timepoints</SPAN> <BR> <BR> <DIV id=ctl00_ContentPlaceHolder1_pnlGrdTP style="OVERFLOW-Y: scroll; WIDTH: 800px; HEIGHT: 300px"> <DIV> <TABLE class=grid id=ctl00_ContentPlaceHolder1_grd style="BORDER-COLLAPSE: collapse" cellSpacing=0 rules=rows border=1 widht="100%"> <TBODY> <TR class=headera style="COLOR: black; HEIGHT: 20px"> <TH scope=col>TP Stage</TH> <TH scope=col>TP Name</TH> <TH scope=col>Days From Enrollment</TH> <TH scope=col>Select</TH></TR> <TR class=row> <TD>Screening/Baseline</TD> <TD>Baseline</TD> <TD>0</TD> <TD><INPUT id=ctl00_ContentPlaceHolder1_grd_ctl02_CheckBoxTP type=checkbox name=ctl00$ContentPlaceHolder1$grd$ctl02$CheckBoxTP> </TD> </TR> </TBODY> </TABLE> </DIV> </DIV> <BR><INPUT id=ctl00_ContentPlaceHolder1_OkButton style="WIDTH: 60px" type=submit value=OK name=ctl00$ContentPlaceHolder1$OkButton> <INPUT id=ctl00_ContentPlaceHolder1_CancelButton style="WIDTH: 60px" type=submit value=Cancel name=ctl00$ContentPlaceHolder1$CancelButton> </DIV>_______________________________________________________________________________________________________________________________________________________I am interested in reading the following (also made BOLD above) values from the structure: <TD>Baseline</TD> <TD><INPUT id=ctl00_ContentPlaceHolder1_grd_ctl02_CheckBoxTP type=checkbox name=ctl00$ContentPlaceHolder1$grd$ctl02$CheckBoxTP> </TD>If 'Baseline' values match with the input I wish to toggle the state of checkbox in <TD><INPUT id=ctl00_ContentPlaceHolder1_grd_ctl02_CheckBoxTP type=checkbox name=ctl00$ContentPlaceHolder1$grd$ctl02$CheckBoxTP> </TD>

I am very new to programming, could you give me an example???

[jeffman]

Give your baseline element an ID so you can get a reference to it. Example:

<td id="ctl00_baseline">Baseline</td>

Note that all attributes should be "quoted". I notice that most of your attributes are not quoted. This can cause problems.Get a reference to an element like this:

var myElement = document.getElementById("ctl00_baseline");

Form elements have a value property. A checkbox has a value property only if you set one. Access the value of a form input like this:

var myElement = document.getElementById("ctl00_ContentPlaceHolder1_grd_ctl02_CheckBoxTP");var myValue = myElement.value;

Normal elements do not have a value property. You can find the contents of an element in its innerHTML property.

var myElement = document.getElementById("ctl00_baseline");var myText = myElement.innerHTML;

Note that if an element contains HTML tags in addition to text, they will also be returned in the innerHTML property. To get just the text content, you need to be able to identify the direct parent of the text.

[sahilchopra]

For the part below:HTML<td id="ctl00_baseline">Baseline</td>I do not have the access to the webpage other than just use it. How do I handle that?

[jeffman]

I do not have the access to the webpage other than just use it.

I'm confused. Where will you put javascript if you cannot put it in your document?

[sahilchopra]

There is a web app for which I am trying to automate the work that a user is supposed to by populating the fields.I wish to populate the fields based on an (valid)input(s) which I provide.When I click on a button an AJAX window pops-up which contains the table (as mentioned in the code above). This AJAX window is dynamic since the TR value can be as low as 1 to as high as ~ 50. For each TR there are 4 TD values. I am interested in acquiring the innerHTML or innerText of TD2 (which is Baseline in this case and will be available to me for comparison via an input ) and change the value of TD4.INPUT1(which is a checkbox).<TR class=row>// This is TR2<TD>Screening/Baseline</TD> // This is TD1<TD>Baseline</TD>// This is TD2<TD>0</TD>// This is TD3<TD><INPUT id=ctl00_ContentPlaceHolder1_grd_ctl02_CheckBoxTP type=checkbox name=ctl00$ContentPlaceHolder1$grd$ctl02$CheckBoxTP> </TD>// This is TD4</TR>domPath of TD4 = DOCUMENT.HTML1.BODY1.FORM1.DIV4.TABLE1.TBODY1.TR1.TD1.DIV4.DIV1.DIV1.DIV1.DIV1.TABLE1.TBODY1.TR2.TD4 domPath of INPUT1 of TD4 = DOCUMENT.HTML1.BODY1.FORM1.DIV4.TABLE1.TBODY1.TR1.TD1.DIV4.DIV1.DIV1.DIV1.DIV1.TABLE1.TBODY1.TR2.TD4.INPUT1