如何动态地从一个文本框中获取值到动态表中的另一个文本框? [英] How to dynamically get values from one text box into another textbox in dynamic table ?

查看:59
本文介绍了如何动态地从一个文本框中获取值到动态表中的另一个文本框?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

以下是我的代码。在这里我使用java script.it创建一个动态表工作正常。问题是当我试图从一个文本框中获取值到anohter文本框时它不起作用。



i希望动态地将数据从一个文本框传输到另一个文本框。 br />


我尝试过:



< ;%@ Page Language =C#AutoEventWireup =trueCodeBehind =WebForm1.aspx.csInherits =example.WebForm1%> 

<!DOCTYPE html PUBLIC - // W3C // DTD XHTML 1.0 Transitional // ENhttp://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional。 DTD>

< html xmlns =http://www.w3.org/1999/xhtml>
< head runat =server>
< title>< / title>
< style>
.mytable {
border:1px solid#000000;
border-collapse:collapse;
宽度:100%;
身高:99px;
}
.mytable td {

border:1px solid#000000;
身高:50px;
}
< / style>

< script>
函数Createtbl(){
var count = document.getElementById(txtbox)。value;
var table = document.createElement('table');
table.className =mytable;
for(var i = 1; i< = count; i ++){
var tr = document.createElement('tr');
var td1 = document.createElement('td');
td1.setAttribute('colSpan','5');
var text1 = document.createTextNode('Header');
td1.appendChild(text1);
tr.appendChild(td1);
table.appendChild(tr);

var tr1 = document.createElement('tr');
var td11 = document.createElement('td');
var td22 = document.createElement('td');
td22.setAttribute('colSpan','3');
var td33 = document.createElement('td');
var text11 = document.createTextNode('Name');
var text22 = document.createTextNode('Age');
var text33 = document.createTextNode('Sex');
td11.appendChild(text11);
td22.appendChild(text22);
td33.appendChild(text33);
tr1.appendChild(td11);
tr1.appendChild(td22);
tr1.appendChild(td33);
table.appendChild(tr1);

var tr2 = document.createElement('tr');
var td111 = document.createElement('td');
td111.setAttribute('rowSpan','3');
var td222 = document.createElement('td');
var td333 = document.createElement('td');
var td444 = document.createElement('td');
var td555 = document.createElement('td');
td555.setAttribute('rowSpan','3');





var text111 = document.createElement(input);
text111.id =txtbox-1;
text111.className =tbox1;
var text222 = document.createTextNode('');
var text333 = document.createTextNode('');
var text444 = document.createTextNode('');
var text555 = document.createTextNode('');

td111.appendChild(text111);
td222.appendChild(text222);
td333.appendChild(text333);
td444.appendChild(text444);
td555.appendChild(text555);
tr2.appendChild(td111);
tr2.appendChild(td222);
tr2.appendChild(td333);
tr2.appendChild(td444);
tr2.appendChild(td555);
table.appendChild(tr2);



var tr3 = document.createElement('tr');
var td1111 = document.createElement('td');
var td2222 = document.createElement('td');
var td3333 = document.createElement('td');
var text1111 = document.createTextNode('');
var text2222 = document.createTextNode('');
var text3333 = document.createTextNode('');
td1111.appendChild(text1111);
td2222.appendChild(text2222);
td3333.appendChild(text3333);
tr3.appendChild(td1111);
tr3.appendChild(td2222);
tr3.appendChild(td3333);
table.appendChild(tr3);



var tr4 = document.createElement('tr');
var td115 = document.createElement('td');
var td225 = document.createElement('td');
var td335 = document.createElement('td');
var text115 = document.createTextNode('');
var text225 = document.createTextNode('');
var text335 = document.createTextNode('');
td115.appendChild(text115);
td225.appendChild(text225);
td335.appendChild(text335);
tr4.appendChild(td115);
tr4.appendChild(td225);
tr4.appendChild(td335);
table.appendChild(tr4);



var tr5 = document.createElement('tr');
var td116 = document.createElement('td');
var td226 = document.createElement('td');
td226.setAttribute('colSpan','4');
var text116 = document.createTextNode('');
var text226 = document.createTextNode('');
td116.appendChild(text116);
td226.appendChild(text226);
tr5.appendChild(td116);
tr5.appendChild(td226);
table.appendChild(tr5);

var tr6 = document.createElement('tr');
var td117 = document.createElement('td');
td117.setAttribute('colSpan','5');
var text117 = document.createTextNode('Footer');
td117.appendChild(text117);
tr6.appendChild(td117);
table.appendChild(tr6);


var tr7 = document.createElement('tr');
var td118 = document.createElement('td');
td118.setAttribute('colSpan','5');
var text118 = document.createElement(button);
text118.innerHTML =获取数据;
// text118.onclick = getdata();
td118.appendChild(text118);
tr7.appendChild(td118);
table.appendChild(tr7);


var tr8 = document.createElement('tr');
var td119 = document.createElement('td');
td119.setAttribute('colSpan','5');
var text119 = document.createElement(input);
text119.id =txtbox-2;
text119.className =tbox2;
td119.appendChild(text119);
tr8.appendChild(td119);
table.appendChild(tr8);


}
document.body.appendChild(table);
};


< / script>
< script>
函数getdata(){
for(j = 0; j< = i; j ++)
{
document.getElementById(id).getElementsByClassName(tbox2)[0 ] .value = document.getElementById(id).getElementsByClassName(tbox1)[0] .value;

}
< / script>
< / head>
< body>
< form id =form1runat =server>
< div>

< input id =txtboxtype =text/>
< input id =Button1type =buttonvalue =COPYonclick =Createtbl()/>

< / div>
< / form>
< / body>
< / html>

解决方案

而不是使用:

 document.getElementById(id).getElementsByClassName(tbox2)[0] .value = document.getElementById(id).getElementsByClassName(tbox1)[0] .value; 





试试这个:



 document.getElementsByClassName(tbox2)[0] .value = document.getElementsByClassName(tbox1)[0] .value; 






 text118.innerHTML =   Get Data<行后面添加以下代码/ span>; 





 text118.onclick =  function (){
document .getElementsByClassName( tbox2)[ 0 ]。value = document .getElementsByClassName( tbox1)[ 0 ]值。
};



我们必须为每个按钮分配onclick功能



谢谢


Below is my code. here i am creating a dynamic table using java script.it works fine. the problem is when i try to get value from one textbox into anohter textbox it does not working.

i want to get data from one text box to another textbox dynamically.

What I have tried:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="example.WebForm1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style>
.mytable {
border:1px solid #000000;
border-collapse:collapse;
width:100%;
height:99px;
}
.mytable td{

border:1px solid #000000;
height:50px;
}
</style>

<script>
function Createtbl(){
var count = document.getElementById("txtbox").value;
var table = document.createElement('table');
table.className = "mytable";
for (var i = 1; i <= count; i++){
    var tr = document.createElement('tr');
    var td1 = document.createElement('td');
    td1.setAttribute('colSpan', '5');
    var text1 = document.createTextNode('Header');
    td1.appendChild(text1);
    tr.appendChild(td1);
    table.appendChild(tr);

    var tr1 = document.createElement('tr');
    var td11 = document.createElement('td');
    var td22 = document.createElement('td');
    td22.setAttribute('colSpan', '3');
    var td33 = document.createElement('td');
    var text11 = document.createTextNode('Name');
    var text22 = document.createTextNode('Age');
    var text33 = document.createTextNode('Sex');
    td11.appendChild(text11);
    td22.appendChild(text22);
    td33.appendChild(text33);
    tr1.appendChild(td11);
    tr1.appendChild(td22);
    tr1.appendChild(td33);
    table.appendChild(tr1);

    var tr2 = document.createElement('tr');
    var td111 = document.createElement('td');
    td111.setAttribute('rowSpan', '3');
    var td222 = document.createElement('td');
    var td333 = document.createElement('td');
    var td444 = document.createElement('td');
    var td555 = document.createElement('td');
    td555.setAttribute('rowSpan', '3');
    
    
    
               
        
    var text111 = document.createElement("input");
    text111.id = "txtbox-1";
    text111.className = "tbox1";
    var text222 = document.createTextNode('');                
    var text333 = document.createTextNode('');
    var text444 = document.createTextNode('');
    var text555 = document.createTextNode('');

    td111.appendChild(text111);
    td222.appendChild(text222);
    td333.appendChild(text333);
    td444.appendChild(text444);
    td555.appendChild(text555);
    tr2.appendChild(td111);
    tr2.appendChild(td222);
    tr2.appendChild(td333);
    tr2.appendChild(td444);
    tr2.appendChild(td555);
    table.appendChild(tr2);



    var tr3 = document.createElement('tr');
    var td1111 = document.createElement('td');
    var td2222 = document.createElement('td');
    var td3333 = document.createElement('td');
    var text1111 = document.createTextNode('');
    var text2222 = document.createTextNode('');
    var text3333 = document.createTextNode('');
    td1111.appendChild(text1111);
    td2222.appendChild(text2222);
    td3333.appendChild(text3333);
    tr3.appendChild(td1111);
    tr3.appendChild(td2222);
    tr3.appendChild(td3333);
    table.appendChild(tr3);



    var tr4 = document.createElement('tr');
    var td115 = document.createElement('td');
    var td225 = document.createElement('td');
    var td335 = document.createElement('td');
    var text115 = document.createTextNode('');
    var text225 = document.createTextNode('');
    var text335 = document.createTextNode('');
    td115.appendChild(text115);
    td225.appendChild(text225);
    td335.appendChild(text335);
    tr4.appendChild(td115);
    tr4.appendChild(td225);
    tr4.appendChild(td335);
    table.appendChild(tr4);



    var tr5 = document.createElement('tr');
    var td116 = document.createElement('td');
    var td226 = document.createElement('td');
    td226.setAttribute('colSpan', '4');
    var text116 = document.createTextNode('');
    var text226 = document.createTextNode('');
    td116.appendChild(text116);
    td226.appendChild(text226);
    tr5.appendChild(td116);
    tr5.appendChild(td226);
    table.appendChild(tr5);

    var tr6 = document.createElement('tr');
    var td117 = document.createElement('td');
    td117.setAttribute('colSpan', '5');
    var text117 = document.createTextNode('Footer');
    td117.appendChild(text117);
    tr6.appendChild(td117);
    table.appendChild(tr6);


    var tr7 = document.createElement('tr');
    var td118 = document.createElement('td');
    td118.setAttribute('colSpan', '5');
    var text118 = document.createElement("button");
    text118.innerHTML = "Get Data";
   // text118.onclick = getdata();
    td118.appendChild(text118);
    tr7.appendChild(td118);
    table.appendChild(tr7);


    var tr8 = document.createElement('tr');
    var td119 = document.createElement('td');
    td119.setAttribute('colSpan', '5');
    var text119 = document.createElement("input");
    text119.id = "txtbox-2";
    text119.className = "tbox2";
    td119.appendChild(text119);
    tr8.appendChild(td119);
    table.appendChild(tr8);


}
document.body.appendChild(table);
};


</script>
<script>
    function getdata() {
        for (j=0;j<= i ;j++)
        {
          document.getElementById(id).getElementsByClassName("tbox2")[0].value = document.getElementById(id).getElementsByClassName("tbox1")[0].value;
 
        }
</script>
</head>
<body>
<form id="form1" runat="server">
<div>

 <input id="txtbox" type="text"/>
 <input id="Button1" type="button" value="COPY"  onclick="Createtbl()"/>

</div>
</form>
</body>
</html>

解决方案

Instead of using :

document.getElementById(id).getElementsByClassName("tbox2")[0].value = document.getElementById(id).getElementsByClassName("tbox1")[0].value;



Try this:

document.getElementsByClassName("tbox2")[0].value = document.getElementsByClassName("tbox1")[0].value;


Hi,

Add the following code on after the line

text118.innerHTML = "Get Data";



text118.onclick = function () {
                document.getElementsByClassName("tbox2")[0].value = document.getElementsByClassName("tbox1")[0].value;
            };


we have to assign onclick function for each button

Thanks


这篇关于如何动态地从一个文本框中获取值到动态表中的另一个文本框?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆