|
JavaScript - Adding Rows Dynamically
Hellooo. So I'm having trouble figuring out how to dynamically add another set of rows to a table when a button is clicked. The code below shows what goes into one set. When the button is clicked, it needs to create another three rows with the same format as the code below, but the variable names need to show what row they're on so I can easily call the values that have been inputed in another function that saves the information. Sooo for example the first variable, bhrs1-1 needs to become bhrs4-1 in the next set (because there's already a bhrs2-1 and bhrs3-1 in this set, which would become bhrs5-1 and bhrs6-1 in the new set).
Sorry the code's so long! Help would be greatly appreciated. Thanksss!! Code: <TBODY>
<INPUT TYPE=HIDDEN id=bhrs1-1 name=bhrs1-1><INPUT TYPE=HIDDEN id=comment1-1 name=comment1-1>
<INPUT TYPE=HIDDEN id=bhrs1-2 name=bhrs1-2><INPUT TYPE=HIDDEN id=comment1-2 name=comment1-2>
<INPUT TYPE=HIDDEN id=bhrs1-3 name=bhrs1-3><INPUT TYPE=HIDDEN id=comment1-3 name=comment1-3>
<INPUT TYPE=HIDDEN id=bhrs1-4 name=bhrs1-4><INPUT TYPE=HIDDEN id=comment1-4 name=comment1-4>
<INPUT TYPE=HIDDEN id=bhrs1-5 name=bhrs1-5><INPUT TYPE=HIDDEN id=comment1-5 name=comment1-5>
<INPUT TYPE=HIDDEN id=bhrs1-6 name=bhrs1-6><INPUT TYPE=HIDDEN id=comment1-6 name=comment1-6>
<INPUT TYPE=HIDDEN id=bhrs1-7 name=bhrs1-7><INPUT TYPE=HIDDEN id=comment1-7 name=comment1-7>
<TR>
<TD HEIGHT=20 SDVAL="1" SDNUM="1033;1033;#,##0_);[RED](#,##0)">
<SELECT style="width:500px;" name=project_id1 size=1 onChange='onProjectChanged(1);'>
<?
//
// Load Projects
//
// $sresults = mysql_query("SELECT project_id, project, billable_rate, customer_id, Customer.CustomerName FROM Project LEFT OUTER JOIN Customer ON Project.customer_id=Customer.customer_id WHERE status_id='active' ORDER BY project");
$sresults = mysql_query("SELECT project_id, project, billable_rate, Project.customer_id, CostCenter.DisplayNameShort FROM Project LEFT OUTER JOIN CostCenter ON Project.customer_id=CostCenter.customer_id WHERE status_id='active' ORDER BY customer_id,CostCenter.DisplayNameShort,project");
// $srate = 0;
print "<OPTION value='0'>--</OPTION>\n";
while($arow = mysql_fetch_assoc($sresults))
{
// $srate = $arow["billable_rate"];
print "<OPTION value=\"" . $arow["project_id"] . "\">" . substr($arow["DisplayNameShort"], 0, 15) . ": " . $arow["project"] . "</OPTION>\n";
}
// print "\n</SELECT>Billable Rate: <INPUT name=billable_rate value=\"" . $srate . "\" size=10 DISABLED></TD>\n";
?>
</TD>
<TD>
<SELECT name=task11 size=1 style="width:220px;" onChange='onTaskChange(1);'>
<?
print "<OPTION value='0'>--</OPTION>\n";
print "<OPTION value='1'>Sales Support</OPTION>\n";
print "<OPTION value='2'>Project Management</OPTION>\n";
print "<OPTION value='3'>Discovery and Requirements Documentation</OPTION>\n";
print "<OPTION value='4'>Analysis and Design</OPTION>\n";
print "<OPTION value='5'>Coding, Unit Testing, Infrastructure Changes</OPTION>\n";
print "<OPTION value='6'>QA, Planning, System Testing</OPTION>\n";
print "<OPTION value='7'>User Acceptance Testing</OPTION>\n";
print "<OPTION value='8'>User Documentation and Training</OPTION>\n";
print "<OPTION value='9'>Launch</OPTION>\n";
print "<OPTION value='10'>Maintenance, Support, Account Management</OPTION>\n";
?>
</TD>
<TD SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><INPUT id=hrs1-1 name=hrs1-1 size=2 maxlength=2 onFocus='onCellFocus(1,1);' onChange='calcRowTotal(1,1);'><BR>
</P>
</TD>
<TD SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><INPUT id=hrs1-2 name=hrs1-2 size=2 maxlength=2 onFocus='onCellFocus(1,2);' onChange='calcRowTotal(1,2);'><BR>
</P>
</TD>
<TD SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><INPUT id=hrs1-3 name=hrs1-3 size=2 maxlength=2 onFocus='onCellFocus(1,3);' onChange='calcRowTotal(1,3);'><BR>
</P>
</TD>
<TD SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><INPUT id=hrs1-4 name=hrs1-4 size=2 maxlength=2 onFocus='onCellFocus(1,4);' onChange='calcRowTotal(1,4);'><BR>
</P>
</TD>
<TD SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><INPUT id=hrs1-5 name=hrs1-5 size=2 maxlength=2 onFocus='onCellFocus(1,5);' onChange='calcRowTotal(1,5);'><BR>
</P>
</TD>
<TD SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><INPUT id=hrs1-6 name=hrs1-6 size=2 maxlength=2 onFocus='onCellFocus(1,6);' onChange='calcRowTotal(1,6);'><BR>
</P>
</TD>
<TD SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><INPUT id=hrs1-7 name=hrs1-7 size=2 maxlength=2 onFocus='onCellFocus(1,7);' onChange='calcRowTotal(1,7);'><BR>
</P>
</TD>
<TD BGCOLOR="#ffff99" SDVAL="0" SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><FONT SIZE=3><B><INPUT id=task1total size=2 maxlength=4 DISABLED></B></FONT>
</P>
</TD>
</TR>
<INPUT TYPE=HIDDEN id=bhrs2-1 name=bhrs2-1><INPUT TYPE=HIDDEN id=comment2-1 name=comment2-1>
<INPUT TYPE=HIDDEN id=bhrs2-2 name=bhrs2-2><INPUT TYPE=HIDDEN id=comment2-2 name=comment2-2>
<INPUT TYPE=HIDDEN id=bhrs2-3 name=bhrs2-3><INPUT TYPE=HIDDEN id=comment2-3 name=comment2-3>
<INPUT TYPE=HIDDEN id=bhrs2-4 name=bhrs2-4><INPUT TYPE=HIDDEN id=comment2-4 name=comment2-4>
<INPUT TYPE=HIDDEN id=bhrs2-5 name=bhrs2-5><INPUT TYPE=HIDDEN id=comment2-5 name=comment2-5>
<INPUT TYPE=HIDDEN id=bhrs2-6 name=bhrs2-6><INPUT TYPE=HIDDEN id=comment2-6 name=comment2-6>
<INPUT TYPE=HIDDEN id=bhrs2-7 name=bhrs2-7><INPUT TYPE=HIDDEN id=comment2-7 name=comment2-7>
<TR>
<TD HEIGHT=20 SDVAL="2" SDNUM="1033;1033;#,##0_);[RED](#,##0)">
<INPUT name=remove1 value=Remove type=button onClick='removeProject(1);'>
</TD>
<TD>
<SELECT name=task12 size=1 style="width:220px;" onChange='onTaskChange(2);'>
<?
print "<OPTION value='0'>--</OPTION>\n";
print "<OPTION value='1'>Sales Support</OPTION>\n";
print "<OPTION value='2'>Project Management</OPTION>\n";
print "<OPTION value='3'>Discovery and Requirements Documentation</OPTION>\n";
print "<OPTION value='4'>Analysis and Design</OPTION>\n";
print "<OPTION value='5'>Coding, Unit Testing, Infrastructure Changes</OPTION>\n";
print "<OPTION value='6'>QA, Planning, System Testing</OPTION>\n";
print "<OPTION value='7'>User Acceptance Testing</OPTION>\n";
print "<OPTION value='8'>User Documentation and Training</OPTION>\n";
print "<OPTION value='9'>Launch</OPTION>\n";
print "<OPTION value='10'>Maintenance, Support, Account Management</OPTION>\n";
?>
</TD>
<TD SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><INPUT id=hrs2-1 name=hrs2-1 size=2 maxlength=2 onFocus='onCellFocus(2,1);' onChange='calcRowTotal(2,1);'><BR>
</P>
</TD>
<TD SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><INPUT id=hrs2-2 name=hrs2-2 size=2 maxlength=2 onFocus='onCellFocus(2,2);' onChange='calcRowTotal(2,2);'><BR>
</P>
</TD>
<TD SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><INPUT id=hrs2-3 name=hrs2-3 size=2 maxlength=2 onFocus='onCellFocus(2,3);' onChange='calcRowTotal(2,3);'><BR>
</P>
</TD>
<TD SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><INPUT id=hrs2-4 name=hrs2-4 size=2 maxlength=2 onFocus='onCellFocus(2,4);' onChange='calcRowTotal(2,4);'><BR>
</P>
</TD>
<TD SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><INPUT id=hrs2-5 name=hrs2-5 size=2 maxlength=2 onFocus='onCellFocus(2,5);' onChange='calcRowTotal(2,5);'><BR>
</P>
</TD>
<TD SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><INPUT id=hrs2-6 name=hrs2-6 size=2 maxlength=2 onFocus='onCellFocus(2,6);' onChange='calcRowTotal(2,6);'><BR>
</P>
</TD>
<TD SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><INPUT id=hrs2-7 name=hrs2-7 size=2 maxlength=2 onFocus='onCellFocus(2,7);' onChange='calcRowTotal(2,7);'><BR>
</P>
</TD>
<TD BGCOLOR="#ffff99" SDVAL="0" SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><FONT SIZE=3><B><INPUT id=task2total size=2 maxlength=4 DISABLED></B></FONT>
</P>
</TD>
</TR>
<INPUT TYPE=HIDDEN id=bhrs3-1 name=bhrs3-1><INPUT TYPE=HIDDEN id=comment3-1 name=comment3-1>
<INPUT TYPE=HIDDEN id=bhrs3-2 name=bhrs3-2><INPUT TYPE=HIDDEN id=comment3-2 name=comment3-2>
<INPUT TYPE=HIDDEN id=bhrs3-3 name=bhrs3-3><INPUT TYPE=HIDDEN id=comment3-3 name=comment3-3>
<INPUT TYPE=HIDDEN id=bhrs3-4 name=bhrs3-4><INPUT TYPE=HIDDEN id=comment3-4 name=comment3-4>
<INPUT TYPE=HIDDEN id=bhrs3-5 name=bhrs3-5><INPUT TYPE=HIDDEN id=comment3-5 name=comment3-5>
<INPUT TYPE=HIDDEN id=bhrs3-6 name=bhrs3-6><INPUT TYPE=HIDDEN id=comment3-6 name=comment3-6>
<INPUT TYPE=HIDDEN id=bhrs3-7 name=bhrs3-7><INPUT TYPE=HIDDEN id=comment3-7 name=comment3-7>
<TR>
<TD HEIGHT=20 SDVAL="3" SDNUM="1033;1033;#,##0_);[RED](#,##0)">
<P><BR>
</P>
</TD>
<TD>
<SELECT name=task13 size=1 style="width:220px;" onChange='onTaskChange(3);'>
<?
print "<OPTION value='0'>--</OPTION>\n";
print "<OPTION value='1'>Sales Support</OPTION>\n";
print "<OPTION value='2'>Project Management</OPTION>\n";
print "<OPTION value='3'>Discovery and Requirements Documentation</OPTION>\n";
print "<OPTION value='4'>Analysis and Design</OPTION>\n";
print "<OPTION value='5'>Coding, Unit Testing, Infrastructure Changes</OPTION>\n";
print "<OPTION value='6'>QA, Planning, System Testing</OPTION>\n";
print "<OPTION value='7'>User Acceptance Testing</OPTION>\n";
print "<OPTION value='8'>User Documentation and Training</OPTION>\n";
print "<OPTION value='9'>Launch</OPTION>\n";
print "<OPTION value='10'>Maintenance, Support, Account Management</OPTION>\n";
?>
</TD>
<TD SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><INPUT id=hrs3-1 name=hrs3-1 size=2 maxlength=2 onFocus='onCellFocus(3,1);' onChange='calcRowTotal(3,1);'><BR>
</P>
</TD>
<TD SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><INPUT id=hrs3-2 name=hrs3-2 size=2 maxlength=2 onFocus='onCellFocus(3,2);' onChange='calcRowTotal(3,2);'><BR>
</P>
</TD>
<TD SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><INPUT id=hrs3-3 name=hrs3-3 size=2 maxlength=2 onFocus='onCellFocus(3,3);' onChange='calcRowTotal(3,3);'><BR>
</P>
</TD>
<TD SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><INPUT id=hrs3-4 name=hrs3-4 size=2 maxlength=2 onFocus='onCellFocus(3,4);' onChange='calcRowTotal(3,4);'><BR>
</P>
</TD>
<TD SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><INPUT id=hrs3-5 name=hrs3-5 size=2 maxlength=2 onFocus='onCellFocus(3,5);' onChange='calcRowTotal(3,5);'><BR>
</P>
</TD>
<TD SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><INPUT id=hrs3-6 name=hrs3-6 size=2 maxlength=2 onFocus='onCellFocus(3,6);' onChange='calcRowTotal(3,6);'><BR>
</P>
</TD>
<TD SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><INPUT id=hrs3-7 name=hrs3-7 size=2 maxlength=2 onFocus='onCellFocus(3,7);' onChange='calcRowTotal(3,7);'><BR>
</P>
</TD>
<TD BGCOLOR="#ffff99" SDVAL="0" SDNUM="1033;0;#,##0.0_);[RED]\(#,##0.0\)">
<P ALIGN=CENTER><FONT SIZE=3><B><INPUT id=task3total size=2 maxlength=4 DISABLED></B></FONT>
</P>
</TD>
</TR>
</TBODY>
Similar TutorialsHi there, so i am working on a website, and on it there is a video with youtube api. I need to hide all Table-rows that are not during each 5 second time frame. So for example, when it is at 0:36, it will hide all TR's besides the TR that has to do with the video between 0:35 and 0:40. Each TR displays a start time, content, and end time. Here is what the tables currently look like. Code: <table width="600" class="table" >
<tr class="item-titles">
<td width="75" class="none">Start</td>
<td width="400">Caption</td>
<td width="75">End</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(0, false)">0</a></td>
<td><a href="javascript:player.seekTo(0, false)"></a></td>
<td><a href="javascript:player.seekTo(5, false)">5</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(5, false)">5</a></td>
<td><a href="javascript:player.seekTo(5, false)"></a></td>
<td><a href="javascript:player.seekTo(10, false)">10</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(10, false)">10</a></td>
<td><a href="javascript:player.seekTo(10, false)"></a></td>
<td><a href="javascript:player.seekTo(15, false)">15</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(15, false)">15</a></td>
<td><a href="javascript:player.seekTo(15, false)"></a></td>
<td><a href="javascript:player.seekTo(20, false)">20</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(20, false)">20</a></td>
<td><a href="javascript:player.seekTo(20, false)"></a></td>
<td><a href="javascript:player.seekTo(25, false)">25</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(25, false)">25</a></td>
<td><a href="javascript:player.seekTo(25, false)"></a></td>
<td><a href="javascript:player.seekTo(30, false)">30</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(30, false)">30</a></td>
<td><a href="javascript:player.seekTo(30, false)"></a></td>
<td><a href="javascript:player.seekTo(35, false)">35</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(35, false)">35</a></td>
<td><a href="javascript:player.seekTo(35, false)"></a></td>
<td><a href="javascript:player.seekTo(40, false)">40</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(40, false)">40</a></td>
<td><a href="javascript:player.seekTo(40, false)"></a></td>
<td><a href="javascript:player.seekTo(45, false)">45</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(45, false)">45</a></td>
<td><a href="javascript:player.seekTo(45, false)"></a></td>
<td><a href="javascript:player.seekTo(50, false)">50</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(50, false)">50</a></td>
<td><a href="javascript:player.seekTo(50, false)"></a></td>
<td><a href="javascript:player.seekTo(55, false)">55</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(55, false)">55</a></td>
<td><a href="javascript:player.seekTo(55, false)"></a></td>
<td><a href="javascript:player.seekTo(60, false)">60</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(60, false)">60</a></td>
<td><a href="javascript:player.seekTo(60, false)"></a></td>
<td><a href="javascript:player.seekTo(65, false)">65</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(65, false)">65</a></td>
<td><a href="javascript:player.seekTo(65, false)"></a></td>
<td><a href="javascript:player.seekTo(70, false)">70</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(70, false)">70</a></td>
<td><a href="javascript:player.seekTo(70, false)"></a></td>
<td><a href="javascript:player.seekTo(75, false)">75</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(75, false)">75</a></td>
<td><a href="javascript:player.seekTo(75, false)"></a></td>
<td><a href="javascript:player.seekTo(80, false)">80</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(80, false)">80</a></td>
<td><a href="javascript:player.seekTo(80, false)"></a></td>
<td><a href="javascript:player.seekTo(85, false)">85</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(85, false)">85</a></td>
<td><a href="javascript:player.seekTo(85, false)"></a></td>
<td><a href="javascript:player.seekTo(90, false)">90</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(90, false)">90</a></td>
<td><a href="javascript:player.seekTo(90, false)"></a></td>
<td><a href="javascript:player.seekTo(95, false)">95</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(95, false)">95</a></td>
<td><a href="javascript:player.seekTo(95, false)"></a></td>
<td><a href="javascript:player.seekTo(100, false)">100</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(100, false)">100</a></td>
<td><a href="javascript:player.seekTo(100, false)"></a></td>
<td><a href="javascript:player.seekTo(105, false)">105</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(105, false)">105</a></td>
<td><a href="javascript:player.seekTo(105, false)"></a></td>
<td><a href="javascript:player.seekTo(110, false)">110</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(110, false)">110</a></td>
<td><a href="javascript:player.seekTo(110, false)"></a></td>
<td><a href="javascript:player.seekTo(115, false)">115</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(115, false)">115</a></td>
<td><a href="javascript:player.seekTo(115, false)"></a></td>
<td><a href="javascript:player.seekTo(120, false)">120</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(120, false)">120</a></td>
<td><a href="javascript:player.seekTo(120, false)"></a></td>
<td><a href="javascript:player.seekTo(125, false)">125</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(125, false)">125</a></td>
<td><a href="javascript:player.seekTo(125, false)"></a></td>
<td><a href="javascript:player.seekTo(130, false)">130</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(130, false)">130</a></td>
<td><a href="javascript:player.seekTo(130, false)"></a></td>
<td><a href="javascript:player.seekTo(135, false)">135</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(135, false)">135</a></td>
<td><a href="javascript:player.seekTo(135, false)"></a></td>
<td><a href="javascript:player.seekTo(140, false)">140</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(140, false)">140</a></td>
<td><a href="javascript:player.seekTo(140, false)"></a></td>
<td><a href="javascript:player.seekTo(145, false)">145</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(145, false)">145</a></td>
<td><a href="javascript:player.seekTo(145, false)"></a></td>
<td><a href="javascript:player.seekTo(150, false)">150</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(150, false)">150</a></td>
<td><a href="javascript:player.seekTo(150, false)"></a></td>
<td><a href="javascript:player.seekTo(155, false)">155</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(155, false)">155</a></td>
<td><a href="javascript:player.seekTo(155, false)"></a></td>
<td><a href="javascript:player.seekTo(160, false)">160</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(160, false)">160</a></td>
<td><a href="javascript:player.seekTo(160, false)"></a></td>
<td><a href="javascript:player.seekTo(165, false)">165</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(165, false)">165</a></td>
<td><a href="javascript:player.seekTo(165, false)"></a></td>
<td><a href="javascript:player.seekTo(170, false)">170</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(170, false)">170</a></td>
<td><a href="javascript:player.seekTo(170, false)"></a></td>
<td><a href="javascript:player.seekTo(175, false)">175</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(175, false)">175</a></td>
<td><a href="javascript:player.seekTo(175, false)"></a></td>
<td><a href="javascript:player.seekTo(180, false)">180</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(180, false)">180</a></td>
<td><a href="javascript:player.seekTo(180, false)"></a></td>
<td><a href="javascript:player.seekTo(185, false)">185</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(185, false)">185</a></td>
<td><a href="javascript:player.seekTo(185, false)"></a></td>
<td><a href="javascript:player.seekTo(190, false)">190</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(190, false)">190</a></td>
<td><a href="javascript:player.seekTo(190, false)"></a></td>
<td><a href="javascript:player.seekTo(195, false)">195</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(195, false)">195</a></td>
<td><a href="javascript:player.seekTo(195, false)"></a></td>
<td><a href="javascript:player.seekTo(200, false)">200</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(200, false)">200</a></td>
<td><a href="javascript:player.seekTo(200, false)"></a></td>
<td><a href="javascript:player.seekTo(205, false)">205</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(205, false)">205</a></td>
<td><a href="javascript:player.seekTo(205, false)"></a></td>
<td><a href="javascript:player.seekTo(210, false)">210</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(210, false)">210</a></td>
<td><a href="javascript:player.seekTo(210, false)"></a></td>
<td><a href="javascript:player.seekTo(215, false)">215</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(215, false)">215</a></td>
<td><a href="javascript:player.seekTo(215, false)"></a></td>
<td><a href="javascript:player.seekTo(220, false)">220</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(220, false)">220</a></td>
<td><a href="javascript:player.seekTo(220, false)"></a></td>
<td><a href="javascript:player.seekTo(225, false)">225</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(225, false)">225</a></td>
<td><a href="javascript:player.seekTo(225, false)"></a></td>
<td><a href="javascript:player.seekTo(230, false)">230</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(230, false)">230</a></td>
<td><a href="javascript:player.seekTo(230, false)"></a></td>
<td><a href="javascript:player.seekTo(235, false)">235</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(235, false)">235</a></td>
<td><a href="javascript:player.seekTo(235, false)"></a></td>
<td><a href="javascript:player.seekTo(240, false)">240</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(240, false)">240</a></td>
<td><a href="javascript:player.seekTo(240, false)"></a></td>
<td><a href="javascript:player.seekTo(245, false)">245</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(245, false)">245</a></td>
<td><a href="javascript:player.seekTo(245, false)"></a></td>
<td><a href="javascript:player.seekTo(250, false)">250</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(250, false)">250</a></td>
<td><a href="javascript:player.seekTo(250, false)"></a></td>
<td><a href="javascript:player.seekTo(255, false)">255</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(255, false)">255</a></td>
<td><a href="javascript:player.seekTo(255, false)"></a></td>
<td><a href="javascript:player.seekTo(260, false)">260</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(260, false)">260</a></td>
<td><a href="javascript:player.seekTo(260, false)"></a></td>
<td><a href="javascript:player.seekTo(265, false)">265</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(265, false)">265</a></td>
<td><a href="javascript:player.seekTo(265, false)"></a></td>
<td><a href="javascript:player.seekTo(270, false)">270</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(270, false)">270</a></td>
<td><a href="javascript:player.seekTo(270, false)"></a></td>
<td><a href="javascript:player.seekTo(275, false)">275</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(275, false)">275</a></td>
<td><a href="javascript:player.seekTo(275, false)"></a></td>
<td><a href="javascript:player.seekTo(280, false)">280</td>
</tr>
<tr>
<td class="none"><a href="javascript:player.seekTo(280, false)">280</a></td>
<td><a href="javascript:player.seekTo(280, false)"></a></td>
<td><a href="javascript:player.seekTo(285, false)">285</td>
</tr>
</table>
And you can see the page at http://134.117.226.43:8000/check_sub...ty/test101/91/ any help ? I have written this code but when i include code for pop calender in a row, then button was disabled, So please help me i just struck in this problem from last one week Thanking you, L.Rajesh rajboy13@gmail.com my code is Code: function addRow()
{
var tbl = document.getElementById('tblMed');
var lastRow = tbl.rows.length;
var iteration = lastRow;
var row = tbl.insertRow(lastRow);
var cellLeft = row.insertCell(0);
var sl = document.createElement('input');
sl.type = 'text';
sl.name = 'sln' ;
sl.id = 'sln' + iteration;
sl.value = iteration;
sl.size = 3;
sl.readOnly = true;
cellLeft.appendChild(sl);
var cellRights= row.insertCell(1);
var elm= document.createElement('input');
elm.type = 'text';
elm.name = 'txtMdesc' ;
elm.id = 'Mdesc' + iteration;
elm.size = 20;
cellRights.appendChild(elm);
var cellRightt= row.insertCell(2);
var elmn= document.createElement('input');
elmn.type = 'text';
elmn.name = 'txtMqty' ;
elmn.onclick = "cal1xx.select(document.forms[0].sdate,'anchor1xx','dd-MM-yy');
elmn.id = 'Mqty' + iteration;
elmn.size = 20;
cellRightt.appendChild(elmn)";
var cellRightu= row.insertCell(3);
var elmno= document.createElement('input');
elmno.type = 'text';
elmno.name = 'txtMbill' ;
elmno.id = 'Mbill' + iteration;
elmno.size = 20;
cellRightu.appendChild(elmno);
}
the button code is : Code: </br>
<fieldset style="width:60%;" align="center"> <legend>
<SCRIPT LANGUAGE="JavaScript">
function deleteRow(b){
document.getElementById('table_formcontainer').deleteRow(b)
}
function CompareDates1()
{
var str1 = document.getElementById("start").value;
var str2 = document.getElementById("edate").value;
var dt1 = parseInt(str1.substring(0,2),10);
var mon1 = parseInt(str1.substring(3,5),10);
var yr1 = parseInt(str1.substring(6,10),10);
var dt2 = parseInt(str2.substring(0,2),10);
var mon2 = parseInt(str2.substring(3,5),10);
var yr2 = parseInt(str2.substring(6,10),10);
var date1 = new Date(yr1, mon1, dt1);
var date2 = new Date(yr2, mon2, dt2);
if(date2 < date1)
{
alert("To date cannot be greater than from date");
return false;
}
else
{
alert("Submitting ...");
document.form1.submit();
}
return true;
}
function addRow()
{
var tbl = document.getElementById('tblMed');
var lastRow = tbl.rows.length;
var iteration = lastRow;
var row = tbl.insertRow(lastRow);
var cellLeft = row.insertCell(0);
var sl = document.createElement('input');
sl.type = 'text';
sl.name = 'sln' ;
sl.id = 'sln' + iteration;
sl.value = iteration;
sl.size = 3;
sl.readOnly = true;
cellLeft.appendChild(sl);
var cellRights= row.insertCell(1);
var elm= document.createElement('input');
elm.type = 'text';
elm.name = 'txtMdesc' ;
elm.id = 'Mdesc' + iteration;
elm.size = 20;
cellRights.appendChild(elm);
var cellRightt= row.insertCell(2);
var elmn= document.createElement('input');
elmn.type = 'text';
elmn.name = 'txtMqty' ;
elmn.onclick = "cal1xx.select(document.forms[0].sdate,'anchor1xx','dd-MM-yy');
elmn.id = 'Mqty' + iteration;
elmn.size = 20;
cellRightt.appendChild(elmn)";
var cellRightu= row.insertCell(3);
var elmno= document.createElement('input');
elmno.type = 'text';
elmno.name = 'txtMbill' ;
elmno.id = 'Mbill' + iteration;
elmno.size = 20;
cellRightu.appendChild(elmno);
}
function delRow1(c)
{
document.getElementById('tblMed').deleteRow(c)
}
function validate()
{
var tbl = document.getElementById('tblMed');
var lastRow= tbl.rows.length-1;
var a;
for (a=1; a<=lastRow; a++)
{
var def = document.getElementById('sln'+ a);
var ghi = document.getElementById('Mdesc'+ a);
var jkl = document.getElementById('Mqty'+ a);
var jkl1 = document.getElementById('Mqty'+ a).value;
var abc = document.getElementById('Mbill'+ a);
var gpexpdt2 = document.getElementById('tblMed').value;
var str11 = document.getElementById("sdate").value;
var str12 = document.getElementById("edate").value;
var tranday = jkl1.substring(0,2);
var tranmon = jkl1.substring(3,5);
var tranyear = jkl1.substring(6,10);
var trandate = new Date(tranyear,tranmon,tranday);
var tranday2 = str11.substring(0,2);
var tranmon2 = str11.substring(3,5);
var tranyear2 = str11.substring(6,10);
var trandate2 = new Date(tranyear2,tranmon2,tranday2);
var tranday3 = str12.substring(0,2);
var tranmon3 = str12.substring(3,5);
var tranyear3 = str12.substring(6,10);
if ((document.getElementById("AC").value == ""))
{
alert ( "Please enter Amount Claimed." );
document.form5.AC.focus();
return false;
}
else if((document.getElementById("Amb").value == ""))
{
alert ( "Please enter Relationship" );
document.form5.Amb.focus();
return false;
}
if ( document.form5.Treat.selectedIndex == "")
{
alert ( "Please select Treatment Type" );
document.form5.Treat.focus();
return false;
}
else if((document.getElementById("C10").value == ""))
{
alert ( "Please enter Total " );
document.form5.C10.focus();
return false;
}
else if((document.getElementById("C11").value == ""))
{
alert ( "Please enter Place " );
document.form5.C11.focus();
return false;
}
else if((document.getElementById("start").value == ""))
{
alert ( "Please enter from date" );
document.form5.start.focus();
return false;
}
else if((document.getElementById("edate").value == ""))
{
alert ( "Please enter to date" );
document.form5.edate.focus();
return false;
}
if (ghi.value.length == "")
{
alert('Please enter Bill No');
ghi.focus();
return false;
}
if (jkl.value.length == "")
{
alert('Please enter Date');
jkl.focus();
return false;
}
var trandate3 = new Date(tranyear3,tranmon3,tranday3);
if (tranmon > 12|| tranmon < 1)
{
alert('Invalid Month In Date Field .Enter as dd-mm-yy');
jkl.focus();
return false;
}
if (tranday > 31|| tranday < 1)
{
alert('Invalid Date In Date Field Enter as dd-mm-yy');
jkl.focus();
return false;
}
if(trandate2.getTime() > trandate.getTime())
{
alert("Bill date should be less than From date");
jkl.focus();
return false;
}
if(trandate3.getTime() < trandate.getTime())
{
alert("Bill date should not be greater than End date");
jkl.focus();
return false;
}
if (abc.value.length == "")
{
alert('Please enter Amount');
abc.focus();
return false;
}
var str3 = document.getElementById("AC").value;
var str4 = document.getElementById("Amb").value;
if(parseInt(str3) > parseInt(str4))
{
alert('Amount Claimed must be less than Amount Balance');
document.form5.AC.focus();
return false;
}
var alertsay = "";
if (form5.Treat.value > 4)
{
alert("Sorry You Can Not This Employee Data In Database..........");
form5.Treat.focus();
return (false);
}
var checkOK = "0123456789";
var checkStr = abc.value;
var allValid = true;
var allNum = "";
for (e = 0; e < checkStr.length; e++)
{
ch = checkStr.charAt(e);
for (f = 0; f < checkOK.length; f++)
if (ch == checkOK.charAt(f))
break;
if (f == checkOK.length)
{
allValid = false;
break;
}
if (ch != ",")
allNum += ch;
}
if (!allValid)
{
alert("Invalid Data Please enter only digits'");
abc.focus();
return (false);
}
}
return true;
}
var count =0;
function Check()
{
if (!validate())
return true;
addRow()
}
function removeRow1()
{
var tbl = document.getElementById('tblMed');
var lastRow = tbl.rows.length;
if (lastRow > 1) tbl.deleteRow(lastRow - 1);
}
function deleteRow(node) {
if (rowNum > 1) {
var td = node.parentNode;
while (td.tblMed.toLowerCase() != "tr")
td = td.parentNode;
td.parentNode.removeChild(td);
rowNum = rowNum - 1;
document.form1.count.value = rowNum;
}
else {
alert ("You cannot delete the last remaining row");
}
}
</script>
<b><font color="#153E7E"border="1">Bill Details</b></legend><br>
<table id="tblMed" width="75%">
<tr>
<th>Sl.No.</th>
<th align="left">Bill No</th>
<th align="left" onClick="cal1xx.select(document.forms[0].edate,'anchor1xx','dd-MM-yy'); return false;" NAME="anchor1xx" ID="anchor1xx" onFocus="self.status='Select Treatment Start Date';return true; " onBlur="self.status='';return true;">Bill Date(DD-MON-YY)</th>
<th>Bill Amount( <span class="WebRupee">Rs.</span> )</th>
</tr>
</table>
<tr><br/>
    <input name="button" type="button" value="Add Bill" onClick="Check()"/>
................................................................................................ i want popup calender in 3rd row of the table please help and if any one got solution then please please mail it to my gmail id : rajboy13@gmail.com Hi, I would just like to know how I would dynamically add another table once text fields in the existing table is clicked on. So pretty much what I have is a table with 5 textboxes lined up horizontally in the first row along with couple of buttons in the second row. What I want is that once one text box is clicked, another table like the one above is created and appears below that initial table. So this is the inital table that should be replicated on each click: Code: <table> <tr> <td><input type="text" /></td> <td><input type="text" /></td> <td><input type="text" /></td> <td><input type="text" /></td> <td><input type="text" ></td> </tr> <tr> <td><button /></td> <td><button /></td> </tr> </table> How would I go about achieving this? Thanks Hello, I want to add rows and columns on click. So, i have a table with columns and rows and I had a add and remove button. So I want the user to be able to add/remove more rows if they have multiple inputs/outputs. So what I want is when the user clicks on add.png, I want another row of Input and Description to appear underneath the current one. Here is my code.. Code: <img src="images/add.png" width="15" height="15" align="right" >
<div class="open">
<table width="200" border="0">
<tr>
<td class="propertyCol">Input: </th>
<td class="propertyCol"><input class="text ui-widget-content ui-corner-all" value="" style="width:210px"></input></th>
<td class="propertyCol">Description: </th>
<td class="propertyCol"><textarea name="" cols="45" rows="1" class="text ui-widget-content ui-corner-all"></textarea> </th>
<td class="propertyCol"><a href="javascript:removeElement();" ><img src="images/remove.png" alt="" width="15" height="15" /></a> </th>
</tr>
</table>
<table width="200" border="0">
<tr>
<td class="propertyCol">Output: </th>
<td class="propertyCol"><input class="text ui-widget-content ui-corner-all" style="width:200px"></input></th>
<td class="propertyCol">Description: </th>
<td class="propertyCol"><textarea name="" cols="45" rows="1" class="text ui-widget-content ui-corner-all"></textarea> </th>
<td class="propertyCol"><a href="javascript:removeElement();" ><img src="images/remove.png" alt="" width="15" height="15" /></a> </th>
</tr>
</table>
</div
So I have been struggling with a Javascript issues for a couple of days now and can't find an answer anywhere online that has helped. I have a javascript loop that is looping through all of my <dfn> html tags. These tags are used to show a glossary term on my page. When the user mouses over the term it shows a popup with the term name and the definition. Here is my javascript function: Code: function definitionRollover(){
var j;
var dfns = document.getElementsByTagName('dfn')
for (j=0; j<dfns.length;j++){
var term = dfns[j].innerHTML.charAt(0).toUpperCase() + dfns[j].innerHTML.slice(1);
var definitionArray = new Array(term, dfns[j].title);
dfns[j].onmouseover = function(){stm(definitionArray,Style[0])}
dfns[j].onmouseout = function(){htm();};
}
}
As you can see I am adding a onmouseover event to these <dfn> tags which calls another function (stm) with the definition and term being held in the definitionArray. This works great until I have multiple terms on a page. When I have multiple terms it only shows the last terms definition for all terms. My question is how I can get it to work for all terms. I know that throughout the loop the definitionArray is holding the correct info at the correct time but for some reason it only shows the last one. I hope that this makes sense and if anyone could give me any tips or leads it would be very much appreciated. Hi, i'm a newbie in javascript. To make all clear of what I wanna do is, take a look at this URL: http://danecdotes.hostei.com/addproposal.html What i wanna do is when you click add more input link, you can have more rows to input more things. Note that in those <td> there's an input field in each <td> and I want those input to have their own names with increment ID (e.g like name1, name2, name3.). How can I make that possible? Thanks I have created a calculator for my site but I am having troubles figuring out a way to make the "add row" and "delete row" functionality work correctly. I would like the user to only see 1 row of information and then add/delete rows as needed. I currently only have 4 static rows. If anyone can help it would be greatly appreciated. Thanks The page is at https://learningportal.juniper.net/j...lator/Calc.htm Hi, I am using a javascript datepicker which works fine with simple textboxes: For example: I have a textBox startDate1 in the table below: <form method="post" name="upload" action=""> <table id="tableId"> <tr> <td> <input type="text" name="startDate1" value="" readonly="true" size="10"/> <script language="JavaScript"> new tcal ({'formname': 'upload','controlname': 'startDate1'}); </script> <td> </tr> <table> </form> --Now I want to add rows dynamically to this table for which I have <a href="javascript:addRowToTable();" >Add Row</a> and the corresponding javascript function: <script type = "text/javascript"> function addRowToTable() { var tbl = document.getElementById('tableId'); var lastRow = tbl.rows.length; var iteration = lastRow; var row = tbl.insertRow(lastRow); var box = row.insertCell(0); var element = document.createElement('input'); element.setAttribute('type', 'text'); element.setAttribute('name', 'startDate' + iteration); box.appendChild(element); } </script> --This code creates the text boxes properly, but I am not being able to add the datepicker to it. Please suggest me a way to add the datepicker to the textboxes in the dynamically generated rows. Thank You Regards Rusho Shaw ok i have a script which will make a copy of the html in a div and place it into another div the problem with this it creates a duplicate element with the same id so what i want to know is can i create a new id based off old ids using a generic type script Code: function scope(e)
{
var popin = document.getElementById('popin');
popin.innerHTML = "<div class='container'>"+e.innerHTML+"</div>";
popin.style.display = "block";
}
this code is designed for taking content in a small div and placing it into a larger div to increase the viewing area so what i would need is sumthing that can look for Code: id="sum text" and maybe amend it to Code: id="sum textP" or sumthing to that extent if sum1 could point me in the right direction that would be great if my post is not clear enough just ask me to be more specific or sumthing and i will see what i can do to try and make it more clear if needed Hi Guys, I am using the following bit of code to toggle information inside a webpage. Is there a way i can make this code more dynamic so that i do not have to use the next() function to initiate slidetoggle()? I would like to have it so i can pass an ID through to the function and it will then toggle my box but i can't figure it out. Javascript is not my strong suite. Here the function Code: function initMenu() {
//$('.items_wrapper').hide();//object to be hidden
$('.headline').click(//object to be clicked
function() {
$(this).next().slideToggle('slow');
//alert("doesn't work");
}
);
}
$(document).ready(function() {initMenu();});
I would like to create a link inside .headline such as .ViewItems If you need to see the code let me know and i will post it. --EDIT-- Right Now my code is like this and you click headline Code: <div class='headline'></div> <div class='items_wrapper'> </div> I would like it work with an internal element like this, so i can't use next() Code: <div class='headline'><div class='selector'>Click Here</div></div> <div class='items_wrapper'> </div> Thanks in advance. note: this is not homework Hi all, Currently I am doing this: Code: var e = document.getElementById('id');
e.style.color = '#ff0000';
e.style.fontFamily = 'sans-serif';
e.innerHTML = time;
...blah blah...
What I'm actually doing is inserting the current time into an existing DIV and updating it every second. THAT all works. What I want to do is also set an event for that div.... something like this: e.event.onclick = 'runThisCode()'; Of course, the above doesn't work... and I'm not even sure what to ask for doing a Google search... because I get no hits (or maybe it's not possible). So, is it possible, and if so, how? Thanks! -- Roger p.s. I really don't want to edit the code itself (where that div is) because it's part of another app that may change as they update it and I don't want to have to re-patch every new release. hello, I'm trying to load the ads on my site dynamically and have ran into an issue and was hoping for some help. First - I can get the ads to load using vanilla javascript with the code below. Code: var ifrm = document.createElement("iframe");
ifrm.setAttribute("src", OAS_url + "adstream_sx.ads/" +sitePage + "/" + uniqid() + "@" + pos);
var ifrmId = "ifrm_" + uniqid();
ifrm.setAttribute("id", ifrmId);
ifrm.setAttribute("marginwidth", 0);
ifrm.setAttribute("marginheight", 0);
ifrm.setAttribute("frameborder", 0);
ifrm.setAttribute("scrolling", 0);
ifrm.setAttribute("height", container.scrollHeight + (container.offsetHeight - container.clientHeight));
ifrm.setAttribute("width", container.scrollWidth + (container.offsetWidth - container.clientWidth));
container.appendChild(ifrm);
But since the site is using jquery I wanted to develop it out that way. So I have the following code, Code: iRandom = oas.uniqid();
sAdURL = opt.url + 'adstream_mjx.ads/' + opt.sitepage + '/1' + iRandom + '@' + sPos + '?' + opt.query;
$('<iframe />', {
src: sAdURL,
id: sPos
}).appendTo(thisAd);
I figured the reason this isn't working is the difference between appendChild and appendTo and the fact that things are jquery objects. So again the top code block renders the ads and the lower code block just shows the javascript code from the ad provider. Any help to get this to work in jquery would be grateful. Thanks Hi, Here are sample divisions: Code: <style type="text/css">
#grandparent {width:100px;}
#parent {overflow:auto; height:100px; }
.child {overflow:hidden; margin-left:10px;}
</style>
<div id="grandparent">
<div id="parent">
<div class="child">1000000000000000000000000</div>
<div class="child">1000000000000000000000000</div>
<div class="child">1000000000000000000000000</div>
<div class="child">1000000000000000000000000</div>
<div class="child">1000000000000000000000000</div>
<div class="child">1000000000000000000000000</div>
<div class="child">1000000000000000000000000</div>
</div>
</div>
The <div class="child"> width value is always 10 pixels less than <div id="parent"> width value. How can it be calculated so any width value is given to <div id="parent">, its child gets 10 pixels less than that? Any help is very much appreciated! Mike Hey all! My supervisor is tasking me with having a webpage resize the windows media player dynamically based on the users resolution. I have tried everything I can think of to make this happen but no luck. Is this even possible? I'm using the following code to embed the video: Code: <object
classid="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95"
codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=6,4,5,1112"
type="application/x-oleobject" width="800" height="600" align="left"
standby="Loading Microsoft Windows Media Player components..." id="mediaPlayer">
<param name="AutoStart" value="1" />
<param name="FileName" value="../../../videos/Welcome_1.wmv" />
<param name="ShowDisplay" value="False" />
<param name="ShowControls" value="True" />
<param name="ShowStatusBar" value="False" />
<param name="Loop" value="False" />
<embed
src="../../../videos/Welcome_1.wmv"
width="800"
height="600"
autostart="1" align="left" type="application/x-mplayer2"
pluginspage="http://www.microsoft.com/Windows/MediaPlayer/"
name="mediaPlayer"> </embed>
</object>
I've tried creating variables and substituting those for the width and height of the object code e.g., Code: <script type="text/javascript">var _width=screen.width; var _height=screen.height;</script> followed by Code: <object
classid="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95"
codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=6,4,5,1112"
type="application/x-oleobject" width=_width height=_height align="left"
standby="Loading Microsoft Windows Media Player components..." id="mediaPlayer">
<param name="AutoStart" value="1" />
<param name="FileName" value="../../../videos/Welcome_1.wmv" />
<param name="ShowDisplay" value="False" />
<param name="ShowControls" value="True" />
<param name="ShowStatusBar" value="False" />
<param name="Loop" value="False" />
<embed
src="../../../videos/Welcome_1.wmv"
width=_width
height=_height
autostart="1" align="left" type="application/x-mplayer2"
pluginspage="http://www.microsoft.com/Windows/MediaPlayer/"
name="mediaPlayer"> </embed>
</object>
but of course, this doesn't work. Is it even possible?? If so, your help is greatly appreciated. Thank you, M. Hi, I have the following function to dynamically create an image (in this case a toolbox button): Code: function createButton(srcid,bttn)
{
if (bttn=='mag') {s='Magnify';h='Magnify';o='DoZoom(event,\'0\',\''+srcid+'\')';}
if (bttn=='frz') {s='Pause';h='Freeze/Unfreeze';o='setPicture(\''+srcid+'\',0)';}
if (bttn=='swp') {s='Swap';h='Swap maps';o='setPicture(\''+srcid+'\',2)';}
btn=document.createElement('img');
btn.setAttribute('src','toolbox/'+s+'.gif');
btn.setAttribute('width','16px');
btn.setAttribute('height','16px');
btn.setAttribute('id',bttn+'btn_'+srcid);
btn.setAttribute('class','button');
btn.setAttribute('name','Toolbox');
btn.setAttribute('title',h);
btn.setAttribute('onclick',o);
document.getElementById('ctrlDiv').appendChild(btn);
}
which works fine in IE8 and IE9, but in IE7 it refuses to pick up the style 'button'. I've even tried putting in btn.class='button' but JS throws up an error. If I specify the style by btn.style.position='Absolute' it picks this up OK. However, it won't respond to the onclick event either. I have heard that setAttribute is buggy with IE7, which is why I tried to specify each attribute directly. The style sheet for class button is: Code: .button
{
position: absolute;
left: 5;
top: 5;
z-index: 1;
}
(BTW, no link to a website as this is local on my machine atm) TIA, Gerald. I have been over this code several times and through as many tutorials as I can fine and I still can not figure out why it does not work. Is anyone here able to point out my error? The objective of the code is to get the size in pixels of the viewport when the browser loads page, and when the browser window is resized. After obtaining that number I want to use it to set the size of my DIV to 770px if the viewport has gotten shorter than than 770, and to auto if my viewport is larger than 770. Note, I am not posting the HTML or CSS code because it seems like this should be simple - I will gladly post that code if it turns out my question is not simple. Code: <script language="JavaScript" type = "text/javascript">
<!--
function inspectview() {
var viewportheight;
// most modern browsers
if (typeof window.innerWidth != 'undefined')
{
viewportheight = window.innerHeight;
}
// IE6 in standards compliant mode
else if (typeof document.documentElement != 'undefined'
&& typeof document.documentElement.clientWidth !=
'undefined' && document.documentElement.clientWidth != 0)
{
viewportheight = document.documentElement.clientHeight;
}
// older versions of IE
else
{
viewportheight = document.getElementsByTagName('body')[0].clientHeight;
if (viewportheight <= 770){
document.getElementById("bg").style.height = "770px";
} else {
document.getElementById("bg").style.height = "100%";
}
}
window.onload = inspectview;
window.onresize = inspectview;
//-->
</script>
Thank you in advance -Alaric_ I need help, please. How would you write javascript code to check (add tick mark) the checkbox in the below code snippet based on a condition? I have tried using the structu if(x) {document.form.name.checked=true;} but it did not work. I think the checkbox name format below, is a problem. This is all done client-side. Anyone know how to do this? Thanks for any help. Jman Quote: <TABLE id= sec1_sec2_area border=0> <TBODY> <TR> <TD><INPUT id= sec1_sec2_area_0 type=checkbox name= sec1:sec2:area:0><LABEL for= sec1_sec2_area_0>Colors </LABEL></TD></TR> <TR> <TD><INPUT id= sec1_sec2_area_1 type=checkbox name= sec1:sec2:area:1><LABEL for= sec1_sec2_area_1>Size </LABEL></TD></TR> </TBODY></TABLE> |
|||||||