Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 13 of 13
  1. #1
    New Coder
    Join Date
    Dec 2011
    Posts
    19
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Reworking OLD script self.document.forms[f].elements[i].value

    I'm reworking a 15 year old script.
    Here is the original general purpose routine that extracted a portion of one form to another form.
    Code:
    function FillForm(f) {
    	for( i=FullName; i<=EndOfForm; i++) { 
    		self.document.forms[f].elements[i].value = FormData[i];
    	}; 
    };
    But NOW I'm supposed to use getElementById()
    Does that mean instead of the short routine I have to put one line for each Id tag and it is no longer general purpose and independent of the form being used?

    Is it OK to keep using the legacy script despite the Warning from the error console?

  • #2
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,918
    Thanks
    56
    Thanked 545 Times in 542 Posts
    Quote Originally Posted by Ann-Marie View Post
    Is it OK to keep using the legacy script despite the Warning from the error console?
    if it works, you can use it. a warning is just a warning, not an error - although it is helpful to know what you are being warned against.

    which error console tells you that, and what is the full message?

    on a general note, I see that you are learning javascript and I am too. I started out finding old scripts from the net and modifying them to my purposes, but (for the most part) I don't do that anymore - for one, there is a lot of poorly written, deprecated code out there and two, I found that I only really started to understand how javascript worked once I started to write my own functions. It takes longer, but I think step one is to write code that you understand (and that works, of course), with step two being writing "good" code and step 3 being writing code that other people will understand (in case you hand a project off to someone else and don't want to spend days explaining it to them).

    But if none of that matters and all you want is a script for you that works now, it's reasonable to say that some warnings can be ignored (and in fact some error consoles themselves have bugs and produce warnings that SHOULD be ignored)

    specifically, your loop seems a little weird in that FullName and EndOfForm both need a numeric value, but if it works, it works - we can assume that they get defined correctly elsewhere. There are many other ways to do what you are trying to do without using getElementById(), but like I say, the need to change your script is directly related to why you are writing it in the first place.

  • #3
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,189
    Thanks
    75
    Thanked 4,341 Times in 4,307 Posts
    My question: Why are you "supposed" to use getElementById???

    In general, I feel it is an error to give an id to a <form> field. (Though the <form> itself should be given an id, instead of a name.)

    Reason: Fields without names are *not* sent by the browser when a form is submitted. So if you *must* give a field a name, anyway, why duplicate the effort by also giving it an id? The sole exception is when you want to associate a <label> with a form field by way of the field's id. But even then, for 98% of all purposes you can avoid the id by simply coding (example):
    Code:
        <label><input type="radio" name="gender" value="female"/> Female </label>
    See? No ID needed.

    Now, *IF* indeed you are talking about the id of the <form> itself, then yes, it would be a good idea to rewrite the code. But it's a minor rewrite. And that old code is really clumsy, anyway:
    Code:
    function FillForm(formID) {
            var form = document.getElementById(formID);
    	for( var i=FullName; i<=EndOfForm; i++) { 
    		form.elements[i].value = FormData[i];
    	}; 
    }
    Note that without the var declaration for variable i the global variable of the name is used. Not a good idea, at all.

    And the .elements there is optional, by the by. You could write it as simply
    Code:
    function FillForm(formID) {
            var form = document.getElementById(formID);
    	for( var i=FullName; i<=EndOfForm; i++) { 
    		form[i].value = FormData[i];
    	}; 
    }
    FWIW, even 15 years ago that code should have been written more efficiently and more simply (and more correctly, in the case of variable i) as
    Code:
    function FillForm(f) {
            var form = document.forms[f]; // self is a waste of code; but a temp variable is good idea
    	for( var i=FullName; i<=EndOfForm; i++) { 
    		form.elements[i].value = FormData[i];
    	}; 
    } /*  the trailing semicolon here always was wrong, but harmless */
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    Ann-Marie (12-28-2011)

  • #4
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,189
    Thanks
    75
    Thanked 4,341 Times in 4,307 Posts
    Oh, and while using name= with a <form> tag is considered obsolescent, it's not absolutely forbidden except with DHTML in STRICT mode.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #5
    New Coder
    Join Date
    Dec 2011
    Posts
    19
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Thank you, that was very helpful. I'm having problems with a function using it that extracts the data fields from a form and compacts them into a variable.
    Code:
    function GetFormData(){
         FormData = ""; //Global
         var form = document.GetElementById("FormA");
         for(var i=0; i<formSize; i++){
              var content = form[i];
              if(content == undefined) content = "";
              FormData += content + "~";
         }
    }
    I think I am having problems when it runs on an empty form and the data fields are coming up undefined, hence the line to change them to null strings.

    If I run the above I get no errors but the result is:-
    [object HTMLInputElement]~[object HTMLInputElement]~[object HTMLInputElement]~[object HTMLInputElement]~[object HTMLInputElement]~[object HTMLInputElement]~[object HTMLIn etc.

    If I change the line var content = form[i]; to var content = form[i].value;
    The Mozilla Error Console gives me errors on that line of
    form[i] is undefined

    Any ideas?

  • #6
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,918
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    var form = document.GetElementById("FormA"); // Javascript is case-sensitive, so your script would not work at all!

    The value of an empty form field is not undefined but an empty string ""

    So var content = form[i].value;
    and delete if(content == undefined) content = "";
    Last edited by Philip M; 12-28-2011 at 07:55 AM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • Users who have thanked Philip M for this post:

    Ann-Marie (12-28-2011)

  • #7
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,189
    Thanks
    75
    Thanked 4,341 Times in 4,307 Posts
    Good eyes, Philip, as always.

    I also have to question the use of formSize in
    Code:
        for(var i=0; i<formSize; i++){
    where is that coming from??? Why wouldn't you use
    Code:
        for ( var i = 0; i < form.elements.length; ++i )
    ?? After all, if formSize is too large, then indeed you would get an error from form[i] even if you dig spell getElementById() correctly.

    But there are other problems with the *CONCEPT* of that code.

    If you have any checkboxes or radio buttons or <select multiple> fields in the <form> they will *NOT* be handled at all correctly by that code. And buttons and any submittal fields will be included without regard to whether they were clicked on or not, if that matters.

    It's pretty much useless except for <input type="text"> and <textarea> form fields. (It's also poorly designed in that if a form field is ever added or removed or moved there would be no way to realize that from the concatenated string, alone.) Just seems like a bad idea all around.
    Last edited by Old Pedant; 12-28-2011 at 08:41 AM.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #8
    New Coder
    Join Date
    Dec 2011
    Posts
    19
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Thanks Philip, that should fix it.

    Thanks Mr. Pendant for your comments I am very aware of that.

    Because the form is a mix of radio buttons and text boxes and because it has to map to cookie refresh, there is a literal map (mostly comments with a few literals) that declares what is where in the form and formSize is a literal declared in that map.

    Yes, it is a little clumsy but I'm (re)writing it for my own use so it doesn't need to be idiot proof.

  • #9
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,918
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    Quote Originally Posted by Ann-Marie View Post
    Yes, it is a little clumsy but I'm (re)writing it for my own use so it doesn't need to be idiot proof.
    "If you make it idiot proof, they'll build a better idiot"

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #10
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,189
    Thanks
    75
    Thanked 4,341 Times in 4,307 Posts
    Quote Originally Posted by Philip M View Post
    "If you make it idiot proof, they'll build a better idiot"
    And I'm proof of that.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #11
    New Coder
    Join Date
    Dec 2011
    Posts
    19
    Thanks
    2
    Thanked 0 Times in 0 Posts
    This idiot is still having problems.
    Code:
    function GetFormData(){
         FormData = ""; //Global
         var form = document.GetElementById("FormA");
         for(var i=0; i<formSize; i++){
              FormData += form[i] + "~"; 
         }
    }
    It gets the correct number of entries but they are all
    [object HTMLInputElement]~[object HTMLInputElement]~[object HTMLInputElement]~ - - - etc.
    How do I extract the value of the elements?

    Edit:
    If it helps, here is a typical form input line
    <TD>Address<BR><INPUT TYPE="text" SIZE="20" MAXLENGTH="60" NAME="Bill Address" ID="BillAddress" ONCHANGE="ShipAddress.value=BillAddress.value"></TD>
    Last edited by Ann-Marie; 12-29-2011 at 06:06 AM. Reason: Added more information

  • #12
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,918
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    FormData += form[i].value + "~"; (I gave you this in Post #6)

    And you still have not taken on board my corection of GetElementById. I am beginning to doubt your claims of being an experienced programmer.



    All advice is supplied packaged by intellectual weight, and not by volume. Contents may settle slightly in transit.
    Last edited by Philip M; 12-29-2011 at 07:38 AM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #13
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,189
    Thanks
    75
    Thanked 4,341 Times in 4,307 Posts
    You know, Philip, I don't think she is copy/pasting actual code here.

    If she was really still using "Get" instead of "get", then that statement should have thrown an error and she would never get to the point of seeing
    [object HTMLInputElement]~[object HTMLInputElement]~[object HTMLInputElement]

    Ann-Marie: Please copy/paste the EXACT AND ACTUAL code you are using.

    As for getting the value of each form element: As we said, you should be using
    Code:
        FormData += form[i].value + "~";
    If you are getting an error from that, then maybe time to find out WHICH value of [b]i[/] is causing it. Possibly you have added a new form field that doesn't have a [b].value[/b[ property??

    For starters, I'd do this:
    Code:
    function GetFormData(){
         FormData = ""; //Global
         var names = "";
         var form = document.getElementById("FormA");
         for(var i=0; i<formSize; i++)
        {
            if ( form[i] == null )
            {
                alert("No field for i=" + i);
                return;
            }
            var fld = form[i];
            names += "\n" + fld.name;
            if ( fld.value == null )
            {
                alert("No value for i=" + i);
            } else {
                FormData += fld.value + "~"; 
            }
         }
         alert( "List of names: " + names );
         alert( "List of values: " + FormData );
    }
    How many years has it been since you've done any programming? Surely you haven't forgotten the kinds of debugging code you had to add to programs in the 60s and 70s, before debuggers came into vogue.

    You can do the same 60s things in JavaScript, using alert()s in place of console logging.

    But you can also use any of the many many JavaScript debuggers that are out there. Why have you not started using a debugger by now?

    I think I'm with Philip and wondering about your experience claims.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •