Win a copy of Re-engineering Legacy Software this week in the Refactoring forum
or Docker in Action in the Cloud/Virtualization forum!
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

How to fill an HTML table using javascript

 
Olivier López
Ranch Hand
Posts: 32
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hello People
I would really appreciate if you can help me with this one

Theres a website with an HTML table, and it looks like this:


I developed a java software with an embeded internet browser on it, and i want to open the website of the picture above and fill
all the table fields by just clicking a button on my software.
I extract all the data from a data base, and now i need to run a javascript command to paste that data into the website table fields.

The problem is that I dont have any knowledge on javascript, so i dont know how to start. I would appreciate if someone can give me a piece of javascript
code to fill just one of the fields, so then i can figure out how to fill the other fields.


To make things easier, here I attach the source code from the website, so you can see the table inputs and code:

<TABLE class=tableLayout id=table4 cellSpacing=0 cellPadding=0 border=0>
<TBODY>
<TR style="DISPLAY: none">
<TD class="" style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; HEIGHT: 0px; BACKGROUND-COLOR: red" width=47></TD>
<TD class="" style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; HEIGHT: 0px; BACKGROUND-COLOR: red" width=47></TD>
<TD class="" style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; HEIGHT: 0px; BACKGROUND-COLOR: red" width=47></TD>
<TD class="" style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; HEIGHT: 0px; BACKGROUND-COLOR: red" width=47></TD>
<TD class="" style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; HEIGHT: 0px; BACKGROUND-COLOR: red" width=47></TD>
<TD class="" style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; HEIGHT: 0px; BACKGROUND-COLOR: red" width=47></TD>
<TD class="" style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; HEIGHT: 0px; BACKGROUND-COLOR: red" width=47></TD></TR>
<TR id="" style="HEIGHT: 35px">
<TD class="h_border_onlyColumn_first ellipsisCell subgroupings-right" onclick="" colSpan=7 height=35>  </TD></TR>
<TR id="" style="HEIGHT: 35px">


<TD class="h_border_middleRow_first ellipsisCell tab-list-data-R" onclick="" height=35><INPUT class="field-value-nopad field-right-aligned" id=TASK_3697650_30065_0 onblur=timesheet.cellBlur(this); maxLength=6 onchange="timesheet.cellChangeDaily(this,0,0, 'ae(3697650)');" size=1 value=0.00 name=TASK_3697650_30065_0><INPUT id=TASK_3697650_30065_0_date type=hidden value=10/07/11> </TD>


<TD class="h_border_middleRow_middle ellipsisCell tab-list-data-R" onclick="" height=35><INPUT class="field-value-nopad field-right-aligned" id=TASK_3697650_30065_1 onblur=timesheet.cellBlur(this); maxLength=6 onchange="timesheet.cellChangeDaily(this,0,1, 'ae(3697650)');" size=1 value=0.00 name=TASK_3697650_30065_1><INPUT id=TASK_3697650_30065_1_date type=hidden value=11/07/11> </TD>



As I told before, i dont have javascript knowledges, but i believe the " id=TASK_3697650_30065_1" and "value=0.00" fields i set on bold color, are important fields I need.
For instance, i need a javascript code that let me replace the value "0.00" for a different one, like "1.99" or "2.04", but i dont really know the syntax of the javascript code
i need to run for this purpose.



In case the HTML code i posted is not helpful, i found another piece of code that could contain related info about this table:


<SCRIPT language=javascript src="/itg/js/tm/WorkItem.js?v=d456163ed2ef6308dfd3c3909b8dba9e"></SCRIPT>

<SCRIPT language=javascript>
timesheet.workItems = [
new WorkItem('0','3697650','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'18',0.0,false,1),
new WorkItem('1','3697642','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'12',0.0,false,1),
new WorkItem('2','3697643','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'6',0.0,false,1),
new WorkItem('3','3697644','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'15',0.0,false,1),
new WorkItem('4','3697645','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'24',0.0,false,1),
new WorkItem('5','3697646','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'25',0.0,false,1),
new WorkItem('6','3697647','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'22',0.0,false,1),
new WorkItem('7','3697648','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'17',0.0,false,1),
new WorkItem('8','3697649','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'26',0.0,false,1),
new WorkItem('9','3697641','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'21',0.0,false,1),
new WorkItem('10','3697633','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'1',0.0,false,1),
new WorkItem('11','3697635','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'8',0.0,false,1),
new WorkItem('12','3697637','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'10',0.0,false,1),
new WorkItem('13','3697638','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'14',0.0,false,1),
new WorkItem('14','3697639','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'11',0.0,false,1),
new WorkItem('15','3697640','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'3',0.0,false,1),
new WorkItem('16','3697659','TASK','91672','30102',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'19',0.0,false,1),
new WorkItem('17','3697632','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'20',0.0,false,1),
new WorkItem('18','3697634','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'2',0.0,false,1),
new WorkItem('19','3697651','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'7',0.0,false,1),
new WorkItem('20','3697636','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'9',0.0,false,1),
new WorkItem('21','3697652','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'23',0.0,false,1),
new WorkItem('22','3799692','TASK','91672','30102',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'5',0.0,false,1),
new WorkItem('23','3697654','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'27',0.0,false,1),
new WorkItem('24','3697653','TASK','91672','30065',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'4',0.0,false,1),
new WorkItem('25','3697657','TASK','91672','30300',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'13',0.0,false,1),
new WorkItem('26','3697658','TASK','91672','30102',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'16',0.0,false,1),
new WorkItem('27','12','MISC','1','30322',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'0',0.0,false,1),
new WorkItem('28','5','MISC','1','30105',0,0,[0.0,0.0,0.0,0.0,0.0,0.0,0.0],[0.0,0.0,0.0,0.0,0.0,0.0,0.0],'28',0.0,false,1)];
</SCRIPT>



Thanks in advance for taking the time to read this¡
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64629
86
IntelliJ IDE Java jQuery Mac Mac OS X
  • Likes 1
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
To set the value of a field with an id value of xyz, you'd use:
 
Olivier López
Ranch Hand
Posts: 32
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Bear Bibeault wrote:To set the value of a file with an id value of xyz, you'd use:


You dont have an idea how much I was looking for this¡¡¡
Thanks a ton¡¡¡
You are a life saver¡¡¡
It worked like a charm¡¡¡
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64629
86
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
You're welcome!
 
With a little knowledge, a cast iron skillet is non-stick and lasts a lifetime.
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic