|
|
|
|
|
|
|
Newbie
Help for adding datepicker to a dynamically generated textbox in Javascript
I am dynamically adding a row to a table when the user clicks on addRow link.
In the dynamically created row I have a textBox to which I have to add datepicker.
Please suggest how to dynamically add the datepicker to it.
A test html for the required functionality is given below:
<html>
<head>
<title>Majors Upload</title>
<link rel="stylesheet" href="calendar.css"/>
<script language="JavaScript" src="calendar_us.js"></script>
<script type = "text/javascript">
function addRowToTable(){
var tbl = document.getElementById('majTable');
var lastRow = tbl.rows.length;
var iteration = lastRow;
var row = tbl.insertRow(lastRow);
var cellLeft = row.insertCell(0);
var el = document.createElement('input');
el.setAttribute('type', 'text');
el.setAttribute('name', 'applName' + iteration);
cellLeft.appendChild(el);
var cellRight = row.insertCell(1);
var el1 = document.createElement('input');
el1.setAttribute('type', 'text');
el1.setAttribute('name', 'startDate' + iteration);
el1.setAttribute('size', '10');
cellRight.appendChild(el1);
/*here i dynamically create text boxes with name startDate2, startDate3..and so on
** i want to add the datepicker to the added text boxes
**tried several ways, but not working
*/
}
function removeRowFromTable(){
var tbl = document.getElementById('majTable');
var lastRow = tbl.rows.length;
if (lastRow > 2) tbl.deleteRow(lastRow - 1);
}
</script>
</head>
<body >
<form method="post" name="upload" action="">
<table border="1" id="majTable" >
<tr>
<th >Application Name</th>
<th >Start Date</th>
</tr>
<tr>
<td><input type="text" name="applName1"/></td>
<td><input type="text" name="startDate1" value="" readonly="true" size="10"/>
<script language="JavaScript">
new myCal ({'formname': 'upload','controlname': 'startDate1'});
</script>
</td>
</tr>
</table>
<a href="javascript:addRowToTable();" >Add Row</a>
<a href="javascript:removeRowFromTable();" />Remove Last Row</a><br>
<input type="submit" value="Submit"/>
</form>
</body>
</html>
Thanks
Regards
Rusho Shaw
Last edited by rusho_shaw; 02 Jun 2011 at 05:04 AM. Reason: yellow colored text was not properly visible
Posting Permissions
Reply With Quote