Creating Form & Element Objects

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • skubik

    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.targ et = document.locati on; // For example.
    tmpFormObj.meth od = "POST";

    tmpElementObj = new Input();
    tmpElementObj.t ype = "text";
    tmpElementObj.v alue = "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.
  • Martin Honnen

    #2
    Re: Creating Form & Element Objects



    skubik wrote:
    [color=blue]
    > 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.targ et = document.locati on; // For example.
    > tmpFormObj.meth od = "POST";
    >
    > tmpElementObj = new Input();
    > tmpElementObj.t ype = "text";
    > tmpElementObj.v alue = "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?[/color]

    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.create Element
    that takes the tag name as a string argument so you can do
    var form, input;
    if (document.creat eElement && (form = document.create Element('form') )) {
    form.action = 'whatever.php';
    form.method = 'POST';

    input = document.create Element('input' );
    input.type = 'text';
    input.name = 'inputName';
    input.value = input.defaultVa lue = '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.appendChil d(input);
    document.body.a ppendChild(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

    Comment

    • Joakim Braun

      #3
      Re: Creating Form &amp; Element Objects

      "skubik" <vkube@yahoo.co m> skrev i meddelandet
      news:cCuyd.5647 23$nl.93802@pd7 tw3no...[color=blue]
      > 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.targ et = document.locati on; // For example.
      > tmpFormObj.meth od = "POST";
      >
      > tmpElementObj = new Input();
      > tmpElementObj.t ype = "text";
      > tmpElementObj.v alue = "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?[/color]

      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.create Element("form") ;
      theForm.action = "...";
      theForm.method = "...";

      var theElement = document.create Element("input" );
      theElement.type = "button";
      ....
      theForm.appendC hild(theElement );
      ....
      var nodeSomewhereIn Document = .....; // using, for instance,
      document.getEle mentById()
      nodeSomewhereIn Document.append Child(theForm);

      Joakim Braun


      Comment

      Working...