javascript - createElement Image Source -


i'm dynamically adding rows/fields in code. have text field date, , next calendar button/image, user can use select appropriate date. however, if click "add new item" button add new row, can't quite image re-appear correctly calendar. rows being added, , field added calendar button, isn't locating image source , can't select pick date. can tell me i'm doing wrong , can correct it? thanks.

<html> <head> <script language="javascript"> function addnewitem() {     var ix = document.getelementbyid("txtindex").value;     ix ++;     document.getelementbyid("txtindex").value = ix;      var tbl = document.getelementbyid("tbloffsetdetail").getelementsbytagname("tbody")[0];     var tr = document.createelement("tr");     tbl.appendchild(tr);      //txtoffsetdatecleared1     var tdoffsetdatecleared = document.createelement("td");     tr.appendchild(tdoffsetdatecleared);      var p = document.createelement("p");     tdoffsetdatecleared.appendchild(p);      var txtoffsetdatecleared = document.createelement("input");      p.appendchild(txtoffsetdatecleared);      var imgoffsetdateclearedcalendar = document.createelement("img");      p.appendchild(imgoffsetdateclearedcalendar);      txtoffsetdatecleared.id = "txtoffsetdatecleared" + ix;     txtoffsetdatecleared.setattribute('size',10);  //set width using html        //txtoffsetdatecleared.style.width = '85px';  //set width using css      var txtoffsetdatecleared1 = document.getelementbyid("txtoffsetdatecleared1");     var = 0;      (i = 0; < txtoffsetdatecleared1.children.length; i++)         {             var opt = document.createelement("option");             opt.value = txtoffsetdatecleared1 [i].value;             opt.innertext = txtoffsetdatecleared1 [i].innertext;             txtoffsetdatecleared.appendchild(opt);         }             //imgoffsetdateclearedcalendar       var imgoffsetdateclearedcalendar1 = document.getelementbyid("imgoffsetdateclearedcalendar1");     var = 0;      (i = 0; < imgoffsetdateclearedcalendar1.children.length; i++)         {             var opt = document.createelement("img");             opt.setattribute('src', '../images/cal.gif');             opt.setattribute('pick date', 'alternate text');             opt.setattribute('height', '16px');             opt.setattribute('width', '16px');             //opt.value = imgoffsetdateclearedcalendar1 [i].value;             //opt.innertext = imgoffsetdateclearedcalendar1 [i].innertext;             imgoffsetdateclearedcalendar1.appendchild(opt);         } </script> </head>       <body>     <table width="99%" border="1" cellpadding="2" cellspacing="2" class="webapps" id="tbloffsetdetail">     <tbody>     <tr>     <input type="button" class="button" value= "add new item" id="btnnewitem" name="btnnewitem" onclick="javascript:addnewitem();">     <input type="text" id="txtindex" name="txtindex" value="1"> <td><p><a href="javascript:newcal('txtoffsetdatecleared1','mmmddyyyy')">                 <input name="txtoffsetdatecleared1" type="text" id="txtoffsetdatecleared1" size="10" maxlength="10">                 <img src="../images/cal.gif" width="16" height="16" border="0" alt="pick date" id="imgoffsetdateclearedcalendar1" name="imgoffsetdateclearedcalendar1"></a></p>             </td>     </tr>     </tbody>     </table>     </body>     </html> 

there no such thing <image> tag in html. do:

document.createelement("img"); 

also, table manipulation, i'd recommend using dom methods specific tables rather createelement/appendchild. see:

https://developer.mozilla.org/en/gecko_dom_reference/examples#example_8.3a_using_the_dom_table_interface

https://developer.mozilla.org/en/dom/table

https://developer.mozilla.org/en/dom/table.insertrow

https://developer.mozilla.org/en/dom/tablerow


Comments

Popular posts from this blog

c++ - Convert big endian to little endian when reading from a binary file -

C#: Application without a window or taskbar item (background app) that can still use Console.WriteLine() -

unicode - Are email addresses allowed to contain non-alphanumeric characters? -