Dynamically adding a form element and field to a page

Discussion in 'Javascript' started by Mike Dee, Mar 2, 2006.

  1. Mike Dee

    Mike Dee Guest

    Is it possible to dynamically create a new form object (form1), then create
    a new form field object and add it form1, and then add form1 to the current
    document? I need to do all this in script rather than using the html <form>
    and related tags. Can this be done to support both IE, Firefox?

    Any code snippets or samples showing how to do this would be fantastic.
    Thanks!

    --- Mike
    Mike Dee, Mar 2, 2006
    #1
    1. Advertising

  2. Mike Dee

    Randy Webb Guest

    Mike Dee said the following on 3/2/2006 12:47 AM:
    > Is it possible to dynamically create a new form object (form1),


    Yes.

    > then create a new form field object and add it form1,


    Yes.

    > and then add form1 to the current document?


    Yes.

    > I need to do all this in script rather than using the html <form>
    > and related tags. Can this be done to support both IE, Firefox?


    Yes.

    > Any code snippets or samples showing how to do this would be fantastic.


    createElement()
    appendChild()
    so on.
    Search the archives.

    --
    Randy
    comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
    Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
    Randy Webb, Mar 2, 2006
    #2
    1. Advertising

  3. Mike Dee

    Mike Dee Guest

    Thanks for the tips Randy. I was able to write some JS that does this.
    However there is one remaining challenge I was hoping you had some thoughts
    on.

    I now am dynamically creating the form and a form field just fine. However
    if I go to another page and then press the back button, the form is
    destroyed and form field values are lost. This behavior is different though
    than if I hard code a form instead of creating it dynamically.

    For instance when I create a form using HTML instead of programmatically via
    the DOM and set a form field value in script, if I leave the page and then
    return, the browser preserves that form field and its value as it was last
    left. This is the same exact behavior I need when I programmatically build
    the form, instead of it being destroyed. Is this possible? It would seem
    so - why does the browser care how the form was created (either html or
    dom) - I wouldn't think that would make a difference but apparently it does.
    Thanks!

    --- Mike


    "Randy Webb" <> wrote in message
    news:p...
    > Mike Dee said the following on 3/2/2006 12:47 AM:
    >> Is it possible to dynamically create a new form object (form1),

    >
    > Yes.
    >
    >> then create a new form field object and add it form1,

    >
    > Yes.
    >
    >> and then add form1 to the current document?

    >
    > Yes.
    >
    >> I need to do all this in script rather than using the html <form> and
    >> related tags. Can this be done to support both IE, Firefox?

    >
    > Yes.
    >
    >> Any code snippets or samples showing how to do this would be fantastic.

    >
    > createElement()
    > appendChild()
    > so on.
    > Search the archives.
    >
    > --
    > Randy
    > comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
    > Javascript Best Practices -
    > http://www.JavascriptToolbox.com/bestpractices/
    Mike Dee, Mar 2, 2006
    #3
  4. Mike Dee

    Randy Webb Guest

    Mike Dee said the following on 3/2/2006 9:56 AM:
    > Thanks for the tips Randy. I was able to write some JS that does this.


    Tip #1: Don't top-post here, it is frowned upon like the plague :)

    > However there is one remaining challenge I was hoping you had some thoughts
    > on.
    >
    > I now am dynamically creating the form and a form field just fine. However
    > if I go to another page and then press the back button, the form is
    > destroyed and form field values are lost. This behavior is different though
    > than if I hard code a form instead of creating it dynamically.


    Yes. When you hard code it, it is there for the browser and there is
    nothing left to chance as long as the HTML is valid code to start with.
    When you introduce JS dependency you also introduce unreliability that
    you are seeing.

    > For instance when I create a form using HTML instead of programmatically via
    > the DOM and set a form field value in script, if I leave the page and then
    > return, the browser preserves that form field and its value as it was last
    > left. This is the same exact behavior I need when I programmatically build
    > the form, instead of it being destroyed. Is this possible?


    That depends, directly, on how you are creating the form. If the form
    requires user interaction to be created, then no, you aren't going to
    *easily* be able to do what you want. You could try setting a cookie but
    you would run out of space in a hurry if your form is very large though.

    --
    Randy
    comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
    Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
    Randy Webb, Mar 2, 2006
    #4
  5. Mike Dee

    Mike Dee Guest

    "Randy Webb" <> wrote in message
    news:...
    >> For instance when I create a form using HTML instead of programmatically
    >> via the DOM and set a form field value in script, if I leave the page and
    >> then return, the browser preserves that form field and its value as it
    >> was last left. This is the same exact behavior I need when I
    >> programmatically build the form, instead of it being destroyed. Is this
    >> possible?

    >
    > That depends, directly, on how you are creating the form. If the form
    > requires user interaction to be created, then no, you aren't going to
    > *easily* be able to do what you want. You could try setting a cookie but
    > you would run out of space in a hurry if your form is very large though.


    Thanks for the tips. The form I am creating dynamically is being done in
    the document's main OnLoad event, so it does not require user interaction to
    be created. However, it still does not persist if you move off the page and
    come back with the back button. It will recreate it just fine, but then I
    lose the values that I had purposely stored in the form field. Any way to
    work around this and make the form persist? Cookies are not an option.

    As an alternative to storing this value in a form field - is there any other
    nook or cranny within the browser I could tuck a value into that would
    persist if a user moved away and then came back with the Back button? Maybe
    adding something to a style / stylesheet or sometihng? I would not want to
    value to persist if the page is recalled via a link later - just need it to
    persist and be present in the even tthe back button is used. I know this
    sounds like a cookie could help but as mentioned cookies cannot be used at
    all in this solution.

    Thanks!

    --- Mike
    Mike Dee, Mar 3, 2006
    #5
  6. Mike Dee

    Randy Webb Guest

    Mike Dee said the following on 3/3/2006 1:10 PM:
    > "Randy Webb" <> wrote in message
    > news:...
    >>> For instance when I create a form using HTML instead of programmatically
    >>> via the DOM and set a form field value in script, if I leave the page and
    >>> then return, the browser preserves that form field and its value as it
    >>> was last left. This is the same exact behavior I need when I
    >>> programmatically build the form, instead of it being destroyed. Is this
    >>> possible?

    >> That depends, directly, on how you are creating the form. If the form
    >> requires user interaction to be created, then no, you aren't going to
    >> *easily* be able to do what you want. You could try setting a cookie but
    >> you would run out of space in a hurry if your form is very large though.

    >
    > Thanks for the tips. The form I am creating dynamically is being done in
    > the document's main OnLoad event, so it does not require user interaction to
    > be created. However, it still does not persist if you move off the page and
    > come back with the back button. It will recreate it just fine, but then I
    > lose the values that I had purposely stored in the form field. Any way to
    > work around this and make the form persist? Cookies are not an option.


    If you want the form there every time the page is loaded, why not hard
    code the form?
    What a browser does when you hit the Back button is up to the browser.

    > As an alternative to storing this value in a form field - is there any other
    > nook or cranny within the browser I could tuck a value into that would
    > persist if a user moved away and then came back with the Back button?


    Not really, unless you stored it on the server.


    > Maybe adding something to a style / stylesheet or sometihng? I would not want to
    > value to persist if the page is recalled via a link later - just need it to
    > persist and be present in the even tthe back button is used. I know this
    > sounds like a cookie could help but as mentioned cookies cannot be used at
    > all in this solution.


    If the user leaves to another part of your site? Frames maybe and keep
    the data in the parent frame. It would still break if I went from your
    site to microsoft.com to google.com and then Back button'ed my way back.

    --
    Randy
    comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
    Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
    Randy Webb, Mar 4, 2006
    #6
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Rod  Snyder

    moving from form element to form element

    Rod Snyder, May 29, 2004, in forum: ASP .Net
    Replies:
    1
    Views:
    395
    Vidar Petursson
    May 29, 2004
  2. NotGiven
    Replies:
    3
    Views:
    324
    Michael D. Kersey
    May 13, 2004
  3. GavMc
    Replies:
    4
    Views:
    305
    Evertjan.
    Sep 22, 2005
  4. NotGiven
    Replies:
    3
    Views:
    284
    Michael D. Kersey
    May 13, 2004
  5. Sound
    Replies:
    2
    Views:
    418
    Randy Webb
    Sep 28, 2006
Loading...

Share This Page