Hi,
I'm stuck at the moment trying to work out how to access the value of a
textfield which gets added in a DIV element.
I have functions to add and remove the textfields from the elements as
shown here:
function addListen(){
var ni = document.getElementById('listendiv');
var numi = document.getElementById('listendivval');
var num = (document.getElementById("listendivval").value -1)+
2;
numi.value = num;
var divIdName = "listen"+num;
var newdiv = document.createElement('div');
newdiv.setAttribute("id",divIdName);
var htmlstr="<td><input type=text id="+divIdName+"
name="+divIdName+" size=21 maxlength=21 /> ";
htmlstr=htmlstr+"<input type=button value=\" -\"
onclick=\"javascript:removeListen(\'" + divIdName + "\');\"> ";
htmlstr=htmlstr+"<input type=button value=\" +\"
onclick=\"javascript:addListen();\" /></td>";
newdiv.innerHTML=htmlstr;
ni.appendChild(newdiv);
}
//remove a listen textfield in the apache config form
function removeListen(divNum){
var d = document.getElementById('listendiv');
var olddiv = document.getElementById(divNum);
d.removeChild(olddiv);
}
And I'm trying to write a function here to verify the contents of the
new textfields added:
//check listen values
function checklistens(divNum){
var num = document.getElementById("listendivval").value;
var lnum= "listen"+num;
var numi = document.getElementById(lnum).value;
alert("numi="+numi);
var numi = document.getElementById(lnum).focus;
return false;
}
However I keep getting an undefined object in the alert. Can anyone see
what I'm doing wrong please?
Thanks,
Ed. 2 2340
Ed wrote: Hi,
I'm stuck at the moment trying to work out how to access the value of a textfield which gets added in a DIV element.
I have functions to add and remove the textfields from the elements as shown here:
function addListen(){ var ni = document.getElementById('listendiv'); var numi = document.getElementById('listendivval'); var num = (document.getElementById("listendivval").value -1)+ 2;
Rather than using subtraction to ensure num is a number, use unary
'+'. There also seems little point in using numi:
var num = +document.getElementById("listendivval").value+1;
numi.value = num;
Unless you are going to use numi somewhere else, just do:
document.getElementById('listendivval') = num;
var divIdName = "listen"+num; var newdiv = document.createElement('div'); newdiv.setAttribute("id",divIdName);
Why not access the attribute directly:
newdiv.id = 'listen' + num;
var htmlstr="<td><input type=text id="+divIdName+" name="+divIdName+" size=21 maxlength=21 /> ";
I'm not sure what this line was before it was wrapped, but if there
was no space between divIdName and the 'name' attribute then that will
likely cause a problem. It's always a good idea to quote attribute
values even it it isn't strictly needed.
You have also given the input the same ID as the div which is invalid
HTML and will cause problems.
You are using innerHTML to add part of a table, and adding it to a div
which again is invalid HTML.
Do not allow posted code to be automatically wrapped, manually wrap it
at about 70 characters.
htmlstr=htmlstr+"<input type=button value=\" -\"
htmlstr += "<input type=button value=\" -\"
onclick=\"javascript:removeListen(\'" + divIdName + "\');\"> ";
There is no need for 'javascript:' in the value of an onclick attribute.
Your button can be:
var oBut = document.createElement('input');
oBut.type = 'button';
oBut.value = '-';
oBut.onclick = function() {removeListen(newdiv);};
newdiv.appendChild(oBut);
Untested, but newdiv creates a closure that will refer back to the div
you are creating, even after the function has ended.
htmlstr=htmlstr+"<input type=button value=\" +\" onclick=\"javascript:addListen();\" /></td>"; newdiv.innerHTML=htmlstr;
I'm not sure what most browsers will do with this, but it is invalid
HTML. You should never use innerHTML to write parts of tables, either
write the entire table or just cell contents.
If you are modifying tables, use the DOM.
The same comments for the remove button apply to the add button.
ni.appendChild(newdiv); }
//remove a listen textfield in the apache config form function removeListen(divNum){ var d = document.getElementById('listendiv'); var olddiv = document.getElementById(divNum); d.removeChild(olddiv);
You could do:
var olddiv = document.getElementById(divNum);
olddiv.parentNode.removeChild(olddiv);
Maybe when the above is fixed your other functions may work...
[...]
--
Rob
Hi Rob,
Many thanks for your detailed reply. I have updated my code as per your
suggestions, and it works now. The only snag I have is when I click on
a link on the page and then go back, my div element has vanished, and I
have to enter the form values again.
Any ideas how I could get round this?
Thanks,
Ed.
<code>
//add another listen textfield in the apache config form
function addListen(){
var olddiv = document.getElementById('listendiv');
var num = +document.getElementById("listendivval").value+1;
document.getElementById('listendivval').value = num;
var divIdName = "listen"+num;
var newdiv = document.createElement('div');
newdiv.id = divIdName;
//add text box
var otext = document.createElement('input');
otext.type = 'text';
otext.size=21;
otext.maxlength=21;
newdiv.appendChild(otext);
//add space
var onbsp = document.createTextNode(" ");
newdiv.appendChild(onbsp);
//add minus button
var oBut = document.createElement('input');
oBut.type = 'button';
oBut.value = '-';
oBut.onclick = function() {removeListen(divIdName);};
newdiv.appendChild(oBut);
//add plus button
oBut = document.createElement('input');
oBut.type = 'button';
oBut.value = '+';
oBut.onclick = function() {addListen();};
newdiv.appendChild(oBut);
olddiv.appendChild(newdiv);
}
//remove a listen textfield in the apache config form
function removeListen(divNum){
var d = document.getElementById('listendiv');
var olddiv = document.getElementById(divNum);
d.removeChild(olddiv);
}
//check listen values
function verifyListens(){
var d=document.apacheconfig;
var i=0;
var listenPattern=/^listen/;
for(;d[i]!=null;i++){
if( d[i].name.match(listenPattern)){
if(!verifyListenValue(d[i])){
d[i].focus();
return false;
}
}
}
}
</code> This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics
by: C. Armour |
last post by:
Help me, I'm suffering!
Situation: I have a load() function which loads a bunch
of TextFields with values. There are TextListeners
registered for each of these TextFields. Thus, changing the...
|
by: Johnny Funder |
last post by:
Hi,
I'm working on a GUI using many textfields. Which textfield to put
data into depends on data received via a telnet session. To avoid
doing a huge block of if/else if/else if I wondered if it...
|
by: Mats |
last post by:
It's good practice to validate input, not only where it should be coming
from, but from anywhere it's possible to change or add input for a
"client".
If all user input is transfered using "post"...
|
by: Rob |
last post by:
Hi everyone,
I have a form that has several disabled text fields. In these text
fields, I have initial values. Next to each text field lies a "copy"
button. When clicked, the content of the...
|
by: Suresh |
last post by:
How do I insert a char into the textfield on the keypress event of another textfield?
I have two textboxes, "text1" and "text2".
Important:
"text1" is outside the table.
"text2" is inside...
|
by: damjanu |
last post by:
Hi All;
I need little help.
I have a datasheet form.
I allow user to do 'filter by selection'.
My form contains a column with values.
As user changes selections, I want to
calculate totals....
|
by: Briton |
last post by:
Hi
I am using Access and want to do som SQL in the event builder.
I got a Form with a textfield named "Number" and another named "Name".
When the user type a number in "Number" i should start...
|
by: Mark Phillips |
last post by:
Hello,
I am having a problem in which a file can get stuck open when a thread
that is attempting to write to it gets aborted (ThreadAbortedException
occurs). The log file gets stuck open until...
|
by: adamselearning |
last post by:
Hi...
I've followed Colin Moock's AS3 notes to create a VirtualPet
I've got it working from the code at: http://www.adobe.com/devnet/actionsc...n_moock_f6.pdf
...but am now trying to add a...
|
by: BarryA |
last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
|
by: nemocccc |
last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
|
by: Sonnysonu |
last post by:
This is the data of csv file
1 2 3
1 2 3
1 2 3
1 2 3
2 3
2 3
3
the lengths should be different i have to store the data by column-wise with in the specific length.
suppose the i have to...
|
by: marktang |
last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
|
by: Hystou |
last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
|
by: Oralloy |
last post by:
Hello folks,
I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>".
The problem is that using the GNU compilers,...
|
by: jinu1996 |
last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
|
by: agi2029 |
last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...
|
by: conductexam |
last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and...
| |