PDA

Click to See Complete Forum and Search --> : [RESOLVED] Problem writing in a text box

RRN
04-30-2007, 03:29 AM
Hi, please find the code below
------------------------------------------------------------------------------
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script language="javascript">
function rebuilder(){
var tablebody=document.createElement("Tbody");
var newtable = document.getElementById("XTable");
var trow=new Array(20);
var tcolumn=new Array(20);
var imagee=new Array(20);
var a= 100;
alert("image will appear click on it should open another alert.");
trow[0]=document.createElement("tr");
///add text box
tcolumn[0]=document.createElement("td");
trow[0].appendChild(tcolumn[0]);
imagee = document.createElement("input");
imagee.type="text";
imagee.className="Txtfield";
imagee.name="New"+a;
imagee.value="";
imagee.size="11";
imagee.maxLength="10";
tcolumn[0].appendChild(imagee);
//add image
tcolumn[1]=document.createElement("td");
trow[0].appendChild(tcolumn[1]);
imagee = document.createElement("img");
imagee.src = "Cars.gif";
imagee.alt = "IMG";
imagee.width = "16";
imagee.height = "16";
imagee.border = "1";
imagee.onmousedown = function(){
var param = New+a;
func(param);
};
tcolumn[1].width="9%";
tcolumn[1].appendChild(imagee);
tablebody.appendChild(trow[0]);
newtable.appendChild(tablebody);
}
function func(nnn){
nnn.value = "20";
}
</script>
</head>
<body>

<input type="button" onclick="rebuilder()" value="Click the button first" />
<div id="rb">
<table border="1" id="XTable" cellspacing="0" cellpadding="0" style="border-collapse: collapse" width="20%">
<tr>
<td>Click image that will appear below</td>
</tr>
</table>
</div>
</body>
</html>

--------------------------------------------------------------------------
Help me to solve this issue. On clicking button, an image and a textbox will appear.On clicking image 20 should be enterd in the text box. But it is not doing so. How can this issue be fixed????
\\.\
04-30-2007, 04:31 AM
looking at your code, I cant see where you have initalise the variable New.

you have a line that returns the result "New"+a; and later you have a similar reference of New+a but no quotes, I have quickly looked and cant see where you have initalised the variable New.

It also helps if you use the appropriate forum tags to seperate and display your code in a more user freindly format.

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script language="javascript">
function rebuilder(){
var tablebody=document.createElement("Tbody");
var newtable = document.getElementById("XTable");
var trow=new Array(20);
var tcolumn=new Array(20);
var imagee=new Array(20);
var a= 100;
alert("image will appear click on it should open another alert.");
trow[0]=document.createElement("tr");

///add text box
tcolumn[0]=document.createElement("td");
trow[0].appendChild(tcolumn[0]);
imagee = document.createElement("input");
imagee.type="text";
imagee.className="Txtfield";
imagee.name="New"+a;
imagee.value="";
imagee.size="11";
imagee.maxLength="10";
tcolumn[0].appendChild(imagee);

//add image
tcolumn[1]=document.createElement("td");
trow[0].appendChild(tcolumn[1]);
imagee = document.createElement("img");
imagee.src = "Cars.gif";
imagee.alt = "IMG";
imagee.width = "16";
imagee.height = "16";
imagee.border = "1";
imagee.onmousedown = function(){
var param = New+a;
func(param);
};
tcolumn[1].width="9%";
tcolumn[1].appendChild(imagee);
tablebody.appendChild(trow[0]);
newtable.appendChild(tablebody);
}

function func(nnn){
nnn.value = "20";
}
</script>
</head>
<body>
<input type="button" onclick="rebuilder()" value="Click the button first" />
<div id="rb">
<table border="1" id="XTable" cellspacing="0" cellpadding="0" style="border-collapse: collapse" width="20%">
<tr>
<td>Click image that will appear below</td>
</tr>
</table>
</div>
</body>
</html>

so your code is more accessable as well as your formatting is retained.
RRN
04-30-2007, 04:55 AM
I have given the textbox that will apear, the name "New+(value of 'a')", i pass thiis to function "func()". From there i set the value for the text as 20.....
Suhas Dhoke
04-30-2007, 05:28 AM
Hello RRN.

I modified the your code..
1) you are using the same id/name for all the text fields and image.
If you want, the user clicks on the image, then the value of the text box against the image will be set as "20".
2) I set the var var a = 100; outside the function rebuilder(), and increase it by '1' at the end of the function.
3) I also set the var, var param = "New"+a; outside the image event.

Here is the modified code.

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script language="javascript">
var a= 100;
function rebuilder(){
var tablebody=document.createElement("Tbody");
var newtable = document.getElementById("XTable");
var trow=new Array(20);
var tcolumn=new Array(20);
var imagee=new Array(20);
alert("image will appear click on it should open another alert.");
trow[0]=document.createElement("tr");
///add text box
tcolumn[0]=document.createElement("td");
trow[0].appendChild(tcolumn[0]);
imagee = document.createElement("input");
imagee.type="text";
imagee.className="Txtfield";
imagee.name="New"+a;
imagee.id="New"+a;
imagee.value="";
imagee.size="11";
imagee.maxLength="10";
tcolumn[0].appendChild(imagee);
//add image
tcolumn[1]=document.createElement("td");
trow[0].appendChild(tcolumn[1]);
imagee = document.createElement("img");
imagee.src = "ON.JPG";
imagee.alt = "IMG";
imagee.width = "16";
imagee.height = "16";
imagee.border = "1";
var param = "New"+a;
imagee.onmousedown = function(){
func(param);
};
tcolumn[1].width="9%";
tcolumn[1].appendChild(imagee);
tablebody.appendChild(trow[0]);
newtable.appendChild(tablebody);
a++;
}
function func(nnn){
document.getElementById(nnn).value = "20";
}
</script>
</head>
<body>

<input type="button" onclick="rebuilder()" value="Click the button first" />
<div id="rb">
<table border="1" id="XTable" cellspacing="0" cellpadding="0" style="border-collapse: collapse" width="20%">
<tr>
<td>Click image that will appear below</td>
</tr>
</table>
</div>
<a href=""><img id="my_img" src="ON.JPG" onmouseover="this.src='OFF.JPG';" onmouseout="this.src='ON.JPG';" /></a>
</body>
</html>
\\.\
04-30-2007, 06:20 AM
I have given the textbox that will apear, the name "New+(value of 'a')", i pass thiis to function "func()". From there i set the value for the text as 20.....
BUT You use the reference New.

here:imagee.name="New"+a;BUT here you have:var param = New+a; so WHERE have you declaired New?

I know what your trying to do but you havent answered my question which was an observation which you possibly need to see an optician about.

Also you need to set the name and the id tags for the image. because here your: document.getElementsById(nnn).value="20";

imagee.onmousedown = func(this.id); // you may need to wrap this in quotes!! so your passing a string value "func(this.id)";
RRN
04-30-2007, 06:26 AM
got it thx......
\\.\
04-30-2007, 06:46 AM
np.

You now have to check if that solves your issue, if it does, please mark post as resolved otherwise, ask again, plenty of people here to jump in and answer.