Click here to Skip to main content
Rate this: bad
good
Please Sign up or sign in to vote.
See more: Javascript HTML
I want to get value from dynamically created textbox in html. but I can't.. plez help.
 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<title>Matrix for Life</title>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
		<style type="text/css">
		#newtable{
			border-left:2px solid #999;
			border-right:2px solid #999;
			font-family:verdana,arial,helvetica,sans-serif;
			font-size:18px;
			margin:auto;
		}
		input.node{
			hight: 45px;
			width: 55px;
			border:1px doted #999;
		}
		MatA{
			
		}
		</style>
		<script type="text/javascript">
		
		function AddMatrix() {
			row=new Array();
			cell=new Array();
			row_num=document.getElementById("noofrows").value;
			cell_num=document.getElementById("noofcols").value;
			tab=document.createElement('table');
			tab.setAttribute('id','newtable');
			tbo=document.createElement('tbody');
			for(c=0;c<row_num;c++){
				row[c]=document.createElement('tr');
				for(k=0;k<cell_num;k++) {
					cell[k]=document.createElement('td');
					var input = document.createElement("input"); 
					input.type = "text";
					input.name = 'node'+c+','+k;
					input.setAttribute('class','node');
					cell[k].appendChild(input);
					row[c].appendChild(cell[k]);
				}
				tbo.appendChild(row[c]);
			}
			tab.appendChild(tbo);
			document.getElementById('mytable').appendChild(tab);
		}
			
		function show(){
			var val = document.getElementById("mytable").rows[0].cells[0].getElementsByTagName("input").value; 
			alert(val);
		}
		</script>
	</head>
	<body>
		<div>
			<h3>Matrix</h3>
			Number of Rows: <input type="text" id="noofrows" value='2' />
			Number of Colomns: <input type="text" id="noofcols" value='3'/>
			<input type="button" id="add" value="Add" onclick="AddMatrix()"/>
		</div>
		<div id="mytable"></div>
		<input type="button" id="show" value="Show" onclick="show()"/>
	</body>
</html>
Posted 27-Mar-13 3:27am
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 1

I think you should provide the ids)property) to the textboxes and that's too in pattern.
 
Like if you have three textboxes initialy with ids tb1 , tb2,tb3 respectively.
 
Then fill the id attribute of dynamicaly created textbox with tb4(where 4 is from some counter
 
value or you may get it from getElementsByTagName("input").length).
 
Finaly,
 
through getElementById("tb"+counter).value=someValue you can insert value to the dynamicaly created textbox.
 
Best Of Luck..
  Permalink  
v2
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 2

try this code.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <title>Matrix for Life</title>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
        <style type="text/css">
        #newtable{
            border-left:2px solid #999;
            border-right:2px solid #999;
            font-family:verdana,arial,helvetica,sans-serif;
            font-size:18px;
            margin:auto;
        }
        input.node{
            hight: 45px;
            width: 55px;
            border:1px doted #999;
        }
        MatA{
 
        }
        </style>
        <script type="text/javascript">
 
        function AddMatrix() {
            row=new Array();
            cell=new Array();
            row_num=document.getElementById("noofrows").value;
            cell_num=document.getElementById("noofcols").value;
            tab=document.createElement('table');
            tab.setAttribute('id','newtable');
            tbo=document.createElement('tbody');
            for(c=0;c<row_num;c++){
                row[c]=document.createElement('tr');
                row[c].TagName="tr";
                for(k=0;k<cell_num;k++) {
                    cell[k]=document.createElement('td');
                    cell[k].TagName="td";
                    var input = document.createElement("input");
                    input.type = "text";
                    input.name = 'node'+c+','+k;
                    input.setAttribute('class','node');
                    cell[k].appendChild(input);
                    row[c].appendChild(cell[k]);
                }
                tbo.appendChild(row[c]);
            }
            tab.appendChild(tbo);
            document.getElementById('mytable').appendChild(tab);
        }
        </script>
    <script type="text/javascript">
        function show1()
        {
         var tblData = new Array();
        var table = document.getElementById("newtable");
        var i;
        var txt;
        var txt2;
        tr = table.getElementsByTagName('tr');
        for (i = 0; i < tr.length; i++) {
            td = tr[i].getElementsByTagName('td');
            var td2 = td[1].childNodes[0].value;
            var td1 = td[0].childNodes[0].value;
           var td3 = td[2].childNodes[0].value;
            var val = td1+td2+td3;
            alert(val);
 
            }
        }
        </script>
    </head>
    <body>
        <div>
            <h3>Matrix</h3>
            Number of Rows: <input type="text" id="noofrows" value='2' />
            Number of Colomns: <input type="text" id="noofcols" value='3'/>
            <input type="button" id="add" value="Add" onclick="AddMatrix()"/>
        </div>
        <div id="mytable"></div>
        <input type="button" id="show" value="Show" onclick="show1()"/>
    </body>
</html>
  Permalink  
v2
Comments
Member 10703757 at 17-Sep-14 6:04am
   
i want to create a pop up in which a form will show,and the field is name,address,city and image,and the image must store in database and i like to edit and update inside the pop up window,will anyone help me regarding tha??????
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 3

i want to create a pop up in which a form will show,and the field is name,address,city and image,and the image must store in database and i like to edit and update inside the pop up window,will anyone help me regarding tha??????
 

  Permalink  

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
0 OriginalGriff 365
1 Sergey Alexandrovich Kryukov 334
2 CPallini 275
3 DamithSL 230
4 Maciej Los 215
0 OriginalGriff 5,455
1 DamithSL 4,457
2 Maciej Los 3,885
3 Kornfeld Eliyahu Peter 3,480
4 Sergey Alexandrovich Kryukov 3,115


Advertise | Privacy | Mobile
Web04 | 2.8.141216.1 | Last Updated 17 Sep 2014
Copyright © CodeProject, 1999-2014
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100