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 8 of 8
  1. #1
    New Coder
    Join Date
    Dec 2009
    Posts
    35
    Thanks
    4
    Thanked 2 Times in 2 Posts

    Beginner question using form and Javascript

    What I'm trying to test out and learn is the process of a form using the get methode to print out the entered number to another test.htm page
    1st code is the form
    Code:
    <html> 
    <head> 
    <script type="text/javascript"> 
    </script>
    </head>
    <body>
    <form action="test.htm" method="get">
    <font size="1" face="tunga">Enter a number</font>
    <input type="text" name="number" size="2">
    <input type="submit" value="Submit">
    </form>
    </body> 
    </html>
    the 2nd code is the test.htm page I was hoping the value of var = number would document.write to this page. I was hoping I could do this without using ASP of php. I can see in the URL after the second page loads that the var number dos = the numbered entered but I can not get it to display.
    Code:
    <html>
    <head>
    </head>
    <body>
    <script type="text/javascript">
    document.write("The number you entered is " + number);
    </script>
    </body>
    </html>
    as you can see im a beginner and im trying to learn this. I hope its not a stupid question

    Thanks
    John

  • #2
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,461
    Thanks
    11
    Thanked 600 Times in 580 Posts
    Code:
    <html>
    <head>
    </head>
    <body>
    <script type="text/javascript">
    // turn URL'QS into an object using a parser. takes full urls...
    function parseQS(str){
      var ob={}, float="", key="", dc=decodeURIComponent;
    
    for( var i=0, mx=str.length; i<mx;i++){
      var it=str[i];
        if(it==="="){ key=float; float=""; continue;}
        if(!it.search(/^[?&]/)){ 
            if(it==="&" && str.slice(i+1,i+5)==="amp;"){ i=(i+4);float+="&"; continue;}
            if(key){ob[key]=dc(float);} key=""; float="";  continue;
        }
        float+=it;
    }
    ob[key]=dc(float);
    return ob;
    }
    
    
    document.write("The number you entered is " + parseQS(location.href).number);
    </script>
    </body>
    </html>
    my site (updated 2014/10/20)
    BROWSER STATS [% share] (2014/9/03) IE7:0.1, IE8:4.3, IE11:9.2, IE9:2.7, IE10:2.6, FF:16.8, CH:47.5, SF:7.8, NON-MOUSE:37%

  • #3
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,316
    Thanks
    203
    Thanked 2,566 Times in 2,544 Posts
    rnd me - I have to say (not for the first time) that your response is wholly (some might say risibly) inappropriate to someone who writes "as you can see im a beginner and im trying to learn this. I hope its not a stupid question ".

    jsstrausss- No, there are no stupid questions. Only stupid answers. Have a look at:-

    http://www.huntingground.freeserve.c...ta/p_data1.htm

    http://www.javascriptkit.com/javatutors/send1.shtml

    Another way to carry information over pages is to use a cookie.

    Yet another way is to pass data via the window.name property. This works in Safari, Firefox, and Internet Explorer, but is not recommended as it is highly insecure - other sites can view the contents of the window.name property.

    You should note that although the query string solution uses only JavaScript, you cannot test this using two HTML pages on your own hard drive (only on a web server) in Internet Explorer. You should test in Firefox, which allows URLs with a ? to work correctly for JavaScript pages on the local hard drive.
    Last edited by Philip M; 12-23-2009 at 09:54 AM. Reason: Note re IE/Firefox

  • #4
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,461
    Thanks
    11
    Thanked 600 Times in 580 Posts
    Quote Originally Posted by Philip M View Post
    rnd me - I have to say (not for the first time) that your response is wholly (some might say risibly) inappropriate to someone who writes "as you can see im a beginner and im trying to learn this. I hope its not a stupid question ".
    i don't understand, i added one function to his code and it tested fine.
    it does exactly what was outlined by the OP in a cut-and-paste manner.

    an explanation would have been nice, but i simply didn't have time.
    i barely had time to test before i was interrupted; should that stop me from posting a solution?


    -------------------

    jsstrausss:

    here is more documented approach.
    i changed it to mimic PHP's $_GET function, so you can refer to existing docs for more info, but it's not too complicated.
    i threw all the javascript into one big cut-and-paste block for you.
    if you want to know the details of how the $_GET function below works, i'll be happy explain, but why is probably less important than how here.

    the main difference is how you use $_GET in both languages, syntax is identical:

    php:
    PHP Code:
    print( 'Hello ' $_GET["name"] . '!'); 
    js:
    Code:
    document.write( 'Hello ' + $_GET["name"] + '!');

    in your case, it would be:

    Code:
    <html>
    <head>
    </head>
    <body>
    <script type="text/javascript">
    
    $_GET=(function(){ // PHP GET function for javascript   (don't modify this block)
     var ob={},float="",key="",dc=decodeURIComponent,str=location.href;
     for(var i=0,mx=str.length;i<mx;i++){var it=str[i];if(it==="="){key=float;float="";continue;}
     if(!it.search(/^[?&]/)){if(it==="&"&&str.slice(i+1,i+5)==="amp;"){i=i+4;float+="&";continue;}
     if(key){ob[key]=dc(float);}key="";float="";continue;}float+=it;}ob[key]=dc(float);
    return ob;}()); // end $_GET function for javascript
    
    
    document.write("The number you entered is " + $_GET["number"]  );
    
    </script>
    </body>
    </html>
    does that make sense?
    my site (updated 2014/10/20)
    BROWSER STATS [% share] (2014/9/03) IE7:0.1, IE8:4.3, IE11:9.2, IE9:2.7, IE10:2.6, FF:16.8, CH:47.5, SF:7.8, NON-MOUSE:37%

  • #5
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,316
    Thanks
    203
    Thanked 2,566 Times in 2,544 Posts
    Quote Originally Posted by rnd me View Post
    i don't understand, i added one function to his code and it tested fine.
    it does exactly what was outlined by the OP in a cut-and-paste manner.

    an explanation would have been nice, but i simply didn't have time.
    i barely had time to test before i was interrupted; should that stop me from posting a solution?

    does that make sense?

    It makes sense to me. I would be very surprised if it made sense to John, except as a black-box cut-and paste which might as well have been written in Klingon. John - tell us your reaction.

  • #6
    New Coder
    Join Date
    Dec 2009
    Posts
    35
    Thanks
    4
    Thanked 2 Times in 2 Posts
    I'll tell you what i do understand is Philip M 's response. its true although i appreciate any help but that solution was way out of my league. I had no idea and was actually going to response saying so what should i do with that. I was definatly looking for a beginner solution if there was one if not then you guys could say to me there is no basic solution for that question. Again though I do thank you both for taking the time to help me. 'm hoping I will start to understand javascript as you guys do someday
    thanks
    John

  • #7
    New Coder
    Join Date
    Dec 2009
    Posts
    35
    Thanks
    4
    Thanked 2 Times in 2 Posts
    I do want to add that maybe RND understands this language so well that he really dos believe that was a simple solution. I have many friends in the computer field that try to show people what they think is a simple concept but forget that its really just smple to them and do not stop to think if its really simple for the beginner.

  • Users who have thanked Jstrausss for this post:

    Philip M (12-23-2009)

  • #8
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,461
    Thanks
    11
    Thanked 600 Times in 580 Posts
    Quote Originally Posted by Jstrausss View Post
    I do want to add that maybe RND understands this language so well that he really dos believe that was a simple solution.
    yes, i do feel more comfortable talking to machines; people can be relatively unpredictable. Machines let you know right away if they get confused and they don't mind hurting your feelings. I like brutally objective feedback like that. I guess i'm kinda glad to hear blowback: a couple short years ago i didn't know a function from a hole in ground, and now i'm one of "those guys" that used to drive me nuts! Sorry about the confusion.

    i modified my explanation-less approach to something standard.
    you don't really need to understand the klingon inside the GET function, it's a standard part of other languages, and most PHP developers don't know the C code that provides GET to PHP... In the same manner, i don't know exactly how jQuery turns $(".menu .item") into a list of my menu items, but i don't need to know/care; that's the beauty of it! To be fair, the klingon in my GET is quite terse and hard to explain. I'm not even sure I remember every detail, but that hasn't stopped my from using it in the past.

    all you really need to know is how to change the parameter name inside the quotes of $_GET["nameGoesHere"] to use the function to accomplish your task. To me, it's pretty basic, well using it is at least. I don't think there's a simpler or more reliable solution out there.

    did you get it working, or is there something that's still unclear?
    I may be dumb,. but i'm not stupid, and i'm always willing to try to help javascripters. Sorry again for jumping ahead.
    Last edited by rnd me; 12-23-2009 at 10:14 PM.
    my site (updated 2014/10/20)
    BROWSER STATS [% share] (2014/9/03) IE7:0.1, IE8:4.3, IE11:9.2, IE9:2.7, IE10:2.6, FF:16.8, CH:47.5, SF:7.8, NON-MOUSE:37%


  •  

    Posting Permissions

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