hi everybody ,this is my first post.. :)

Am creating a dynamic text box along with datepicker image.. when I enter newdate into the text box, it simply goes to previous textbox and updating the textfield. How to enter the date into the newly created text box??? And also once I complete the first row data , that row should be disabled..
Any help would be higly appreciated...
thanks
indu

Comments

Try this :

<?xml version="1.0" encoding="utf-8" standalone="no"?>
<?xml-stylesheet type="text/css" href="#cssl21" media="screen"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html id="xhtml10S" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head profile="http://www.w3.org/2005/10/profile">
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<meta http-equiv="Window-Target" content="_top" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<title>Free Live Help!</title>
<style id="ccsl21" type="text/css" media="screen">
/* <![CDATA[ */
form {
   padding : 1em;
   margin : 0 0 0 1em;
   border : 1px solid #ccc; }

input[type="button"], input {
   border : thin solid #ccc;
   display : block;
   background-image : none;
   background-color : #fff;
   color : #696969;
   vertical-align : middle;
   height : 22px; }

input[type="text"] {
   letter-spacing : 3px;
   color : #365d95; }

label { color : #808080; }

table { border : none; border-collapse : collapse; }
td { padding-right : 1em; width auto; }
.borderL { border-left : 1px solid #ccc; }
/* ]]> */
</style>
<script type="text/javascript">
// <![CDATA[
var counter = 1;
var modern = Boolean( document.getElementById );
var ie = Boolean( document.all && !modern );
var disable = function() {
var num = parseInt(this.id.match(/\d+/i)[ 0 ]);
var previous = (( modern ) ? document.getElementById( "txt" + (( num ) - 1 )) : document.all[ "txt" + (( num ) - 1 ) ] );
   previous.value = this.value;
   this.disabled = 1;
   create();
};
var create = function() {
var now = new Date();
var dateObj = [ " January ", " February ", " March ", " April ", " May ", " June ", " July ", " August ", " September ", " October ", " November ", " December " ][now.getMonth()] + (( now.getDate() < 10 ) ? "0" : "" ) + now.getDate() + ", " + now.getFullYear();
var field;
var labels;
var fieldTxt;
var table = (( modern ) ? document.getElementById("table") : (( ie ) ? document.all[ "table" ] : undefined ));
   if ( table ) {

   var $row = table.rows;
   var cLen = $row[0].cells.length;
      try { 
         if ( document.createElement ) {
         labels = document.createElement("label")
         var textLabel = document.createTextNode( "TextField #" + (( counter ) + 1 ));
         labels.appendChild( textLabel );
         field = document.createElement("input");
         field.id = "txt" + counter;
         field.name = "txt" + counter;
         field.type = "text";
         field.size = 30;
         field.value = dateObj;
         field.onchange = disable;
         table.insertRow( counter );
            for ( var i = 0; i < cLen; i++ ) {
            $row[counter].insertCell( i );
            $row[counter].cells( i ).appendChild((( i < 1 ) ? labels : (( i < 2 ) ? field : null )));
            } 
         } 
      } catch( e ) {
      field = "unable to create object, please upgrade your browser!";
      alert((( e.description ) ? e.description : (( e.message ) ? e.message : field )));
      return;
      } ++counter;
   }
}; 
// ]]>
</script>
</head>
<body>
<div id="main">
<form id="form1" action="#" method="post" onsubmit="return false;">
<h3 style="margin-top : 0; color : #808080;">JAVASCRIPT LIVE DEMO!</h3>
<table id="table" frame="void" rules="none" summary="JavaScript Demo :: Creating Dynamic field">
<tr><td><label for="txt0">TextField #1</label></td>
<td><input type="text" id="txt0" name="txt0" value="" disabled="disabled" size="30" /></td>
<td><input type="button" id="btn0" name="btn0" value="- Add Field -" onclick="create();" /></td></tr>
</table>
</form>
</div>
</body>
</html>
i have created DOM table columns in javascript;


    Sl.no.    item & description   qty    rate   amount

    here i want to multiply the qty and rate where amount should be displayed.  When i write onclick function on column "amount" it is getting multiplied but in dynamic DOM table how to calculate in each row.
    pl. help.
This article has been dead for over six months. Start a new discussion instead.