473,325 Members | 2,712 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,325 software developers and data experts.

Learning JS, trying to figure out createelement

Hi there,

I haven't done a lot of Javascript programming, so I'm not having great
luck debugging something I put together, and I was hoping someone here
could give it a quick lookover and maybe see the obvious mistake I'm
making.

My challenge is, I've been asked to make a change to an internal tool.
It has a screen with a tree control and a series of buttons at the top.
The buttons at the top control which form is submitted, and are
enabled/disabled based on what type of things are selected in the tree
below.

It currently uses radio buttons, but I've changed the items that are
parents to be checkboxes instead so I can have multiselect. To
maintain compatibillity with the other forms that expect a single
variable (named testclass_id) to be posted, I've made the following
action to be executed on submit:

function dealWithMultiSelect ()
{
/*This function should parse through all tcl set checkboxes to see if
there are more then one
//selected. If so, it needs to create a new hidden field with the
same name for each so we can
//send multiple instances of testclass_id to fulfillments review.
//Suggested flow, go through all of the checkboxes and see if there
are more then one active.
//In a sub loop, for each found, add a new hidden field.
//We'll modify set_val to make sure that there isn't a combination of
tcs and tcls set*/
num = document.tc.id.length;
for (var i = 0; i < num; i++)
{
if (document.tc.id[i].checked == true && document.tc.id[i].type ==
"checkbox")
{
//if it's not the FIRST tcl selected, then create a new hidden
element named testclass_id
if (TotalTCLSelected)
{
var hidden = document.createElement('input');
hidden.setAttribute('type','hidden');
hidden.setAttribute('value',document.tc.id[i].value);
hidden.setAttribute('name','testclass_id');
document.getElementById(document.appendChild(hidde n));
}
TotalTCLSelected++;
}
}
}

As you can see, I'm trying to use createelement to add more hidden
variables of the same name (in this case, 'testclass_id') so that I'll
be emulating a multi-select GET on the next screen. The intention is
that it loops through all the inputs in the form and, if the item is
checked AND is of the type 'checkbox', it adds a new hidden input with
the value of that item. End result, it should submit multiple
instances of 'testclass_id'. I increment TotalTCLSelected so that it
doesn't start doing that until the second one it encounters on purpose,
that's also to maintain compatibillity with other forms.

Can anyone offer some suggestions? My main theory is that the problem
has to do with one or more of the following:
1. Can I really keep redefining the var hidden in the loop? And does
it get cleared each time?
2. Am I messing up the object inheritance by doing
document.createelement instead of something like
document.tc.createelement? (where tc is the name of the form being
parsed)
3. I didn't define TotalTCLSelected anywhere. It isn't erroring out,
but could this be silently killing it?
4. Other?

Thanks!

Jul 23 '05 #1
3 1767


Ben Hallert wrote:

var hidden = document.createElement('input');
hidden.setAttribute('type','hidden');
hidden.setAttribute('value',document.tc.id[i].value);
hidden.setAttribute('name','testclass_id');
document.getElementById(document.appendChild(hidde n));


The last line is somehow nonsense, you should call appendChild on the
element you want to append the input to, probably the form element or a
descendant of the form e.g.
document.forms.formName.appendChild(hidden);
The document.getElementById is not needed at all.
Also consider to set value and defaultValue of the input, otherwise some
browsers will not have the value set for the newly created input:
hidden.value = hidden.defaultValue =
document.tc.id[i].value;

--

Martin Honnen
http://JavaScript.FAQTs.com/
Jul 23 '05 #2
Ben Hallert wrote:
[...]
num = document.tc.id.length;
If this is intended to get all the input elements of a form with
id="tc", you should consider getting all the form elements and then
use that:

var ele = document.forms['tc'].elements;

and then you could change:
for (var i = 0; i < num; i++)
{
if (document.tc.id[i].checked == true && document.tc.id[i].type ==
"checkbox")
to

for (var i = 0; i < ele.length; i++) {
if (ele[i].type == "checkbox" && ele[i].checked ) {

If you test if it's checked first, then the second test is more or less
redundant since only a checkbox can be checked. But you also depend on
non-checkboxes returning evaluating to false, which probably should
happen but may not.
{
//if it's not the FIRST tcl selected, then create a new hidden
element named testclass_id
if (TotalTCLSelected)
You haven't declared TotalTCLSelected. Do so near the start of your
script (before the for loop), and change the if statement:

var TotalTCLSelected = 0; // set to zero
...
if (TotalTCLSelected == 0) // or <1 or !> 0 whatever
{ ... }
TotalTCLSelected++;

If you are not going to use the value of TotalTCLSelected, make it a
boolean:

var TotalTCLSelected = false;
if (TotalTCLSelected == 0)
{ ... }
TotalTCLSelected = true;

Of course you may then want to change the name to 'pastFirstTCL' or
similar.
{
var hidden = document.createElement('input');
hidden.setAttribute('type','hidden');
hidden.setAttribute('value',document.tc.id[i].value);
You really need better names for variables, change "hidden" the
variable name to hiddenInput or something otherwise it is very
confusing for anyone trying to maintain your code.

Why not (if you've used my suggestion above and renamed 'hidden')

hiddenInput.value = ele[i].value;
hidden.setAttribute('name','testclass_id');
This will give all your hidden inputs the same name, which whilst
invalid HTML will likely not cause any problems at the client end
(unless you want to refer to them by id). Consider:

hiddenInput.name = 'testclass_id' + i;
document.getElementById(document.appendChild(hidde n));
}
TotalTCLSelected++;
}
I think your appendChild error has been well covered. To make life
much easier, why not include the hidden inputs in the HTML?

[...] 1. Can I really keep redefining the var hidden in the loop? And does
it get cleared each time?
It's OK.
2. Am I messing up the object inheritance by doing
document.createelement instead of something like
document.tc.createelement? (where tc is the name of the form being
parsed)
No. You create the element, then add it to a collection.
3. I didn't define TotalTCLSelected anywhere. It isn't erroring out,
but could this be silently killing it?
Very likely (it doesn't work for me). Just declare it before using it
in the if statement.
4. Other?


Of course I haven't tested any of the above very much since I only have
your snippet and no HTML. If you have any issues post your modified
code & I'll have another go.

--
Rob
Jul 23 '05 #3
RobG wrote:
[...]
if (TotalTCLSelected == 0) // or <1 or !> 0 whatever


That should have been:

if (TotalTCLSelected != 0) // or <1 or !> 0 whatever
--
Rob
Jul 23 '05 #4

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

7
by: Ryan Walker | last post by:
Hi, I'm getting started with python and have almost zero programming experience. I'm finding that there are tons of tutorials on the internet -- such as the standard tutorial at python.org -- that...
25
by: kie | last post by:
hello, i have a table that creates and deletes rows dynamically using createElement, appendChild, removeChild. when i have added the required amount of rows and input my data, i would like to...
2
by: kie | last post by:
hello, when i create elements and want to assign events to them, i have realised that if the function assigned to that element has no parameters, then the parent node values can be attained. ...
0
by: Henry | last post by:
I am trying to figure out how to create a .NET windows Forms application that also use Microsoft Excel. I need help simply opening and closing the workbooks. Any help you can provide is greatly...
1
by: David Van D | last post by:
Hi there, A few weeks until I begin my journey towards a degree in Computer Science at Canterbury University in New Zealand, Anyway the course tutors are going to be teaching us JAVA wth bluej...
2
by: Thirsty Traveler | last post by:
How would I dynamcially create an XML document of the following form: <ReceiveTSSCallBack xmlns="http://LandAm.EAI.Mainframe.TSR"> <TSSCallBack...
3
by: acecraig100 | last post by:
I am fairly new to Javascript. I have a form that users fill out to enter an animal to exhibit at a fair. Because we have no way of knowing, how many animals a user may enter, I created a table...
4
tpgames
by: tpgames | last post by:
The original game worked for 15 tile sliding game. I wanted a 24 tile game. What's wrong? var tiles = ,,,,]; var grid = ,,,,]; var game = document.createElement("div"); game.className =...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
1
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.