471,582 Members | 1,351 Online
Bytes | Software Development & Data Engineering Community
Post +

Home Posts Topics Members FAQ

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

Creating Form & Element Objects

I'm curious as to whether it's possible to create a Form object and
populate it with form element objects, strictly in Javascript, without
the need to apply the form to a document.

Essentially, I want to do this:

tmpFormObj = new Form();
tmpFormObj.target = document.location; // For example.
tmpFormObj.method = "POST";

tmpElementObj = new Input();
tmpElementObj.type = "text";
tmpElementObj.value = "HELLO WORLD";

.... but I'm not sure whether it's possible to insert the Element object
into the Form object. Furthermore, my Javascript seems to terminate at
the 'new Form()' statement. Is this even possible?

TIA,

- skubik.
Jul 23 '05 #1
2 2026


skubik wrote:
I'm curious as to whether it's possible to create a Form object and
populate it with form element objects, strictly in Javascript, without
the need to apply the form to a document.

Essentially, I want to do this:

tmpFormObj = new Form();
tmpFormObj.target = document.location; // For example.
tmpFormObj.method = "POST";

tmpElementObj = new Input();
tmpElementObj.type = "text";
tmpElementObj.value = "HELLO WORLD";

... but I'm not sure whether it's possible to insert the Element object
into the Form object. Furthermore, my Javascript seems to terminate at
the 'new Form()' statement. Is this even possible?


With modern browsers like IE 5/6, Netscape 6/7, Mozilla, Firefox, Opera
7 you can create any HTML element dynamically, you use the W3C DOM to do
that, there are no constructors (e.g Form, Input) as you have tried
above but there is a factory method
document.createElement
that takes the tag name as a string argument so you can do
var form, input;
if (document.createElement && (form = document.createElement('form'))) {
form.action = 'whatever.php';
form.method = 'POST';

input = document.createElement('input');
input.type = 'text';
input.name = 'inputName';
input.value = input.defaultValue = 'Kibology';

However that just creates those elements in memory, you need then to
insert one into the other and also insert the form into the document

form.appendChild(input);
document.body.appendChild(form);
}

Theoretically you could just keep the form object in memory but I doubt
that (all) browsers let you then submit such a form.
If all you want to do is post data to the server then a considerable
amount of browsers allows that using the XMLHTTP request object, see
<http://www.faqts.com/knowledge_base/view.phtml/aid/17226/fid/616>
and a link in the FAQ
<http://jibbering.com/faq/>

--

Martin Honnen
http://JavaScript.FAQTs.com/
Jul 23 '05 #2
"skubik" <vk***@yahoo.com> skrev i meddelandet
news:cCuyd.564723$nl.93802@pd7tw3no...
I'm curious as to whether it's possible to create a Form object and
populate it with form element objects, strictly in Javascript, without
the need to apply the form to a document.

Essentially, I want to do this:

tmpFormObj = new Form();
tmpFormObj.target = document.location; // For example.
tmpFormObj.method = "POST";

tmpElementObj = new Input();
tmpElementObj.type = "text";
tmpElementObj.value = "HELLO WORLD";

... but I'm not sure whether it's possible to insert the Element object
into the Form object. Furthermore, my Javascript seems to terminate at
the 'new Form()' statement. Is this even possible?


You'll be able to do this with DOM functions - createElement(),
setAttribute(), appendChild() and so on. Your code will look something like
this:

var theForm = document.createElement("form");
theForm.action = "...";
theForm.method = "...";

var theElement = document.createElement("input");
theElement.type = "button";
....
theForm.appendChild(theElement);
....
var nodeSomewhereInDocument = .....; // using, for instance,
document.getElementById()
nodeSomewhereInDocument.appendChild(theForm);

Joakim Braun
Jul 23 '05 #3

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

16 posts views Thread by TTroy | last post: by
32 posts views Thread by Joe | last post: by
9 posts views Thread by dhtml | last post: by
reply views Thread by leo001 | last post: by
reply views Thread by lumer26 | last post: by
1 post views Thread by lumer26 | last post: by

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.