Calling Javascript function from dynamically created table

[YongJ]

Is it possible to have my table that loads an xml document and creates a table dynamically to store that information and create additional tags to receive information from a javascript function? Here is the code. At this moment, the only way for it to print is if the tags are manually created in the .htm file.

table+=("</td></tr>");var yr = 2018;var m = 5;var d = 10;var hr = 12;var min = 12;table+=("<tr>");table+=("<td onload="countdown(yr,m,d,hr,min)"> Time Left : </td>");

table+=("<td><div id="dday"></div></td>");table+=("<td><div id="dhour"></div></td>");table+=("<td><div id="dmin"></div></td>");table+=("<td><div id="dsec"></div></td>");table+=("</tr>");table+=("<tr><td>");

the function it calls is called countdown and it displays the result using inner.html

document.getElementById('dday').innerHTML=dday;document.getElementById('dhour').innerHTML=dhour;document.getElementById('dmin').innerHTML=dmin;document.getElementById('dsec').innerHTML=dsec;

Please help Thank you

Will this work?

[justsomeguy]

I don't think td elements have an onload event. You can call that function manually after creating the table though.

[YongJ]

table+=("<tr>");

table+=("<script type="text/javascript" src="countdown.js"></script>");

table+=("<td> Time Left : </td>");

table+=("<td><div id="dday"></div></td>");

table+=("<td><div id="dhour"></div></td>");

table+=("<td><div id="dmin"></div></td>");

table+=("<td><div id="dsec"></div></td>");

table+=("</tr>");

table+=("<script">);

table+=("countdown(yr,m,d,hr,min)");

table+=("</script">);

I have made some changes. It doesn't seem to work. Can you suggest a solution?

[justsomeguy]

Don't write a script tag into the document, just run the function. You're already writing Javascript code. Instead of using Javascript to write some Javascript code to put in the document and run, just run the code.

[YongJ]

table+=("<tr>");

table+=("<script type="text/javascript" src="countdown.js"></script>");

table+=("<td> Time Left : </td>");

table+=("<td><div id="dday"></div></td>");

table+=("<td><div id="dhour"></div></td>");

table+=("<td><div id="dmin"></div></td>");

table+=("<td><div id="dsec"></div></td>");

table+=("</tr>");

table+=("<script type="text/javascript">");

table+=("countdown(yr,m,d,hr,min)");

table+=("</script>");

table+=("<tr><td>");

This is my test. It loads however, there is no output anywhere. May I know how I can solve this

[justsomeguy]

Also, you don't need to surround each line with parentheses, that doesn't do anything in this case.

[YongJ]

Oh thanks.

May I know how i can solve this second issue. my second function which is located in the external javascript file isn't returning any information to the first function that was called from the script tag.

 

table+=("<td><div id="dday"></div></td>");

table+=("<td><div id="dhour"></div></td>");

table+=("<td><div id="dmin"></div></td>");

table+=("<td><div id="dsec"></div></td>");

table+=("</tr>");

table+=("<script type="text/javascript">");

table+=("countdown(yr,m,d,hr,min)");

table+=("</script>");

table+=("<tr><td>");

ignore the brackets for now.

document.getElementById('dday').innerHTML="AA";

document.getElementById('dhour').innerHTML=dhour;

document.getElementById('dmin').innerHTML=dmin;

document.getElementById('dsec').innerHTML=dsec;

setTimeout("countdown(theyear,themonth,theday,thehour,theminute)",1000);

[justsomeguy]

Which function isn't returning anything? I was just suggesting to build the table first, output it, then run the function. e.g.:

/* build table here */document.getElementById('table').innerHTML = table;countdown(yr,m,d,hr,min);