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 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Mar 2014
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Javascript with forms

    So I have this problem.. I am trying to take a user input from a form on "page1" and when submitted it goes to "page2" and shows what the user input in the form. so far I have:

    In the body of page 1:

    <form id="myform" action="page2.html">
    <input type="text" name="myanswer">
    <input type="submit">
    </form>

    And in page 2:

    <script type="text/javascript">
    var x = document.myform.myanswer.value;
    document.write(x);
    </script>

    I am running these files locally not on a server.

  • #2
    Senior Coder
    Join Date
    Jun 2008
    Location
    New Jersey
    Posts
    2,537
    Thanks
    45
    Thanked 259 Times in 256 Posts
    Welcome. Bare in mind that the forums have code tags that let you organize and show us your code better.

    That being said, you're submitting the forums without any server side technology? Because that's the correct way to do this. Two HTML pages are completely separated; they don't pass any information between each other, as they're both on the clients end. Likewise, most Javascript is completely separated from other pages Javascript. When you do document.myform, its looking for something called myform on the current page. It doesn't even know the previous page existed. You can pass information by using URL parameters, or cookies, but I don't know of any method by which HTML alone could do that. You could work with cookies with Javascript, but for that, on the form submission, JS has to trigger to save the data. If you're moving between pages though, JS is a really weird choice for data transfer.

    If you do want to avoid backend tech (I don't know what you're trying to do on a larger scale), why not have one page, and have JS reveal/hide elements?

  • #3
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,445
    Thanks
    23
    Thanked 630 Times in 629 Posts
    Welcome to the forms.
    Your form need the attribute 'method'.See this HTML form tag

    Page 2 has to be PHP. Here is how to handle forms PHP Form Handling Hope this helps. If you still are having problems post code and we will be happy to answer questions.

    Consider using wampserver
    Evolution - The non-random survival of random variants.

    "If you leave hydrogen alone, for long enough, it begins to think about itself."

  • #4
    New to the CF scene
    Join Date
    Mar 2014
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    yeah sorry for any missing information, its for a university project so we don't use servers. we have to develop an intro page where the user is asked to input their name and then that variable is displayed on the following pages. We've been asked to use javascript for this

  • #5
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,146
    Thanks
    203
    Thanked 2,547 Times in 2,525 Posts
    Google will give you a lot of information about passing data between pages, e.g.

    WWW FAQs: How do I pass data between JavaScript pages?
    Sending objects from one page to another

    In this context I suggest you pass the data using a query string.

    Code:
    <html>
    <!-- Page 1 - to pass variable to next page only:
      -->
    <body>
    <form action="page2.html">
    Please enter your name: <input name="user"/>
    <br/>
    Then <input type="submit" value="Click here" />
    </form>
    </body>
    </html>
    
    <!-- ======================================================= -->
    
    <html>
    <!-- Page 2 -->
    <head>
    <script type="text/javascript">
    
    var pairs = location.search.substring(1).split( "&" );
    var name = "anonymous";
    for ( var p = 0; p < pairs.length; ++p ){
    var pair = pairs[p].split("=");
    if ( pair[0] == "user" ) {
    username = unescape( pair[1].replace(/\+/g," ") );
    }
    }
    
    </script>
    
    <h1>BIG WELCOME</h1>
    <br/>
    <h2>To our friend, 
    <script type="text/javascript">document.write(username);</script>
    </h2>
    <br/>
    Hope you enjoy this site!
    </body>
    </html>
    Last edited by Philip M; 03-04-2014 at 08:46 PM.

    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.


  •  

    Posting Permissions

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