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 7 of 7
  1. #1
    New Coder
    Join Date
    Feb 2013
    Posts
    45
    Thanks
    8
    Thanked 0 Times in 0 Posts

    Creating string from list of form answers.

    Hi folks


    What i need to do is build a variable string in the order (name,mark1,mark2,mark3,mark4) from the following form. Anything ive tried doesnt seem to work properly.


    Code:
    <form name = "statistics" action = "" class="contact"id="statistics">
    <fieldset>
    <legend>Class Statistics</legend>
    <fieldset id = "student">
    <legend>New Student</legend>
    <div>
    <label for="name">Name</label>
    <input type="text" name="name" id="name" size="20"   pattern = "[A-Z][a-z]+( [A-Z][a-z]+)?" title="Please enter a name (Surname optional) with First Letter capitalised" onblur="isFilled(this)">
    </div>
    <div>
    <label for="mark1">Mark One</label>
     <input type="text" name="mark1" id="mark1" size="3" maxlength ="3" value="0" onblur="isFilledNum(this)">
    </div>
    <div>
    <label for="mark2">Mark Two</label>
     <input type="text"  name="mark2" id="mark2" size="3" maxlength ="3" value="0" onblur="isFilledNum(this)" >
    </div>
    <div>
    <label for="mark3">Mark Three</label>
    <input type="text"  name="mark3" id="mark3" size="3" maxlength ="3" value="0" onblur="isFilledNum(this)">
    </div>
    <div>
    <label for="mark4">Exam Mark</label>
    <input type="text"  name="mark4" id="mark4" size="3" maxlength ="3" value="0" onblur="isFilledNum(this)">
    </div>
    <div>
    <input type = "button" id = "btn" value= "Add Student Data" onclick="getData()">
    </div>
    </fieldset>
    
    <div id = "texttarea">
    <textarea name = "resultdata" rows = "10" cols = "30"></textarea>
    </div>
    <div>
    <input type = "button" id = "btn" value= "Get Individual Result" onclick="getResult()">
    </div>
    </fieldset>
    </form>
    Thanks in advance.

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,151
    Thanks
    80
    Thanked 4,557 Times in 4,521 Posts
    Code:
    <input type = "button" id = "btn" value= "Add Student Data" onclick="getData(this.form)">
    ...
    <script type="text/javascript">
    function getData( form )
    {
        var temp = [ form.name.value, form.mark1.value, form.mark2.value,
                     form.mark3.value, form.mark4.value ];
        var stringData = temp.join( "\n" );
        // ... but what you will do with it now you don't say ...
        // as a PURE GUESS:
        form.resultdata.value = stringData;
    }
    </script>
    You may temp.join( ) on whatever kind of separator(s) you want.

    You could even produce CSV data thus:
    Code:
        var stringData = '"' + temp.join( '","' ) + '"';
    Hard to guess what you really want from such vague specifications.
    Last edited by Old Pedant; 02-11-2013 at 09:52 PM.
    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:

    trancecommunity (02-13-2013)

  • #3
    New Coder
    Join Date
    Feb 2013
    Posts
    45
    Thanks
    8
    Thanked 0 Times in 0 Posts
    Thanks for the reply. Ill try it now.

    Just to describe more. Its basically a form that when filled in;

    It joins all the answers into a String (Name, mark1, mark2, mark3)
    Then adds that string onto the end of an array of Strings in the same format

    array[0] (Name, mark1, mark2, mark3)
    array[1] (Name, mark1, mark2, mark3)
    array[2] (Name, mark1, mark2, mark3)
    array[3] (Name, mark1, mark2, mark3)

    etc..

    Then reloads page and shows full array list of students and marks.

  • #4
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,151
    Thanks
    80
    Thanked 4,557 Times in 4,521 Posts
    Ummm...if you RELOAD the page, then how will you remember all the answers?

    Unless you use server-side code, of course.

    If you try to do it all in the browser, you may run out of space if you store the answer in cookies and almost certainly will if you try to pass via the <form> submit and method="get". Could probably use local storage, if the browser you are using supports it.

    I'm not quite sure why you need to reload the page.
    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:

    trancecommunity (02-13-2013)

  • #5
    New Coder
    Join Date
    Feb 2013
    Posts
    45
    Thanks
    8
    Thanked 0 Times in 0 Posts
    I assume im just wrong with the reload anyway.

    It seems to send them through and join them up apart from one thing. The name.

    name is also highlighted blue which im not sure what that means.

    Is it a keyword like var that cant be used in this case maybe?

    var temp = [ this.name.value, this.mark1.value, this.mark2.value, this.mark3.value, this.mark4.value ];
    var stringData = temp.join( "\n" );
    alert(temp);


    If i alert it just shows ,0,0,0,0 instead of john brown,0,0,0,0.

  • #6
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,243
    Thanks
    203
    Thanked 2,555 Times in 2,533 Posts
    name="name"

    You should avoid giving names or id's to your variables/functions/arguments/forms words which are HTML/JavaScript methods/properties/attributes such as 'name' or 'id' or 'value' or 'test' or 'text' or 'checked' or 'click' or 'href' or 'closed' or 'go' or 'submit' or 'replace' or 'button' or 'radio' or 'parseInt'.
    And of course you may not give a variable a name which is a Javascript keyword or event such as alert, case, char, confirm, false, int, null, onload, return, this, void, window, and so on.

    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:

    trancecommunity (02-13-2013)

  • #7
    New Coder
    Join Date
    Feb 2013
    Posts
    45
    Thanks
    8
    Thanked 0 Times in 0 Posts
    Thanks for confirming that. This was an exercise given to me as ive began a course in Javascript. Im surprised they put that in.

    Following code seems to do the trick incase anyone else is following.

    Code:
    <div>
    <label for="name">Name</label>
    <input type="text" name="nameOne" id="nameOne" size="20"   pattern = "[A-Z][a-z]+( [A-Z][a-z]+)?" title="Please enter a name (Surname optional) with First Letter capitalised" onblur="isFilled(this)">
    </div>
    Code:
    var temp = [this.nameOne.value, this.mark1.value, this.mark2.value, this.mark3.value, this.mark4.value ];
    var stringData = temp.join( "\n" );
    alert(temp);
    Thanks for the help. This forum will come in real handy for learning code.


  •  

    Posting Permissions

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