Your jnAccount: | Display/Process User-Inputted Info | |
| Written For: |  - Other |
| Written By: | Patrick |
| Level of Experience: |  - Difficult |
| [Return to the Tutorial Index] | |
Display/Process User-Inputted Info
In this guide you will be meet variables and the echo() function. They will be explained as you meet them.
For this to make sense, you need to know basic HTML, and how to make a form.
Unlike most other tutorials, I will start each section by showing you the finished code. Then, I will explain how the code works. This is to avoid confusion.
The finished code will be highlighted in different colours. Explanations of what each section of the code does can be found in the same colour font, underneath.
Displaying Info
Part 1 - Ask user for username and then display it!
Let's look into each part of the code separately, to understand what's going on. Don't worry if it all looks like gibberish at the moment!
|
||
| <? $username = $_POST['username']; if($username != ''){ echo("<h1 align='center'>Site Title</h1> <p>Welcome to our site, $username! </p> <p>(REST OF YOUR CONTENT)...</p>"); }else{ echo("<h1 align='center'>Site Title</h1> <p>Welcome to our site! </p> <p>Please provide us with the following information! </p> <form method='post' action='$PHP_SELF ' name='form'>Neopets Username: <input type='text' name='username'><input type='submit' value='Continue...'></form>"); }; ?> |
'$username' is a variable. This means that it holds information. Try to think of it as an imaginary box labelled '$username'. In this box is put information which is received from a form component named 'username'.
Next, we ask a question. Is the '$username' box empty (ie. no info was sent to the page from a form)? If $username does not equal nothing (ie. some info was sent via a form, or it does equal something), we continue to the next line. Otherwise, we skip that code and go on to the '}else{' part.
The echo command displays info. In this example it will display "<h1 align='center'>Site Title</h1><p>Welcome to our site, $username!</p> <p>(REST OF YOUR CONTENT)...</p>" as HTML, which should look something like this in a web browser:
|
||
Site TitleWelcome to our site, (YOUR USERNAME HERE)! (REST OF YOUR CONTENT)... |
This echo will display "<h1 align='center'>Site Title</h1><p>Welcome to our site! </p><p>Please provide us with the following information!>/p><form method='post' action='$PHP_SELF' name='form'>Neopets Username: <input type='text' name='username'><input type='submit' value='Continue...'></form>" as HTML, which should look something like this in a web browser:
|
||
Site TitleWelcome to our site! Please provide us with the following information! Neopets Username: |
Notice the variable $PHP_SELF? We've not created this 'box', it's built into PHP itself. When used, it'll turn into whatever the current file name is, making the form submit to itself.
How it works: The first time you load the page you've not submitted your username to the page, so it displays the form. You submit this form to the page, and your username is put in the username box. As the username box is no longer empty your username is displayed in the first echo command!
Part 2 - Give user option not to disclose!
Now, let's look into each part of the code separately, to understand what's going on.
|
||
| <? $username = $_POST['username']; $nottelling = $_POST['nottelling']; $form = $_POST['form']; if(($username != '') && ($nottelling != 'yes')){ echo("<h1 align='center'>Site Title</h1><p>Welcome to our site, $username!</p><p>(REST OF YOUR CONTENT)...</p>"); }elseif($form == 'submitted'){ echo("<h1 align='center'>Site Title</h1><p>Welcome to our site!</p><p>(REST OF YOUR CONTENT)...</p>"); }else{ echo("<h1 align='center'>Site Title</h1><p>Welcome to our site!</p><p>Please provide us with the following information!</p><form method='post' action='$PHP_SELF' name='form'>Neopets Username: <input type='text' name='username'> Check if you would prefer not to disclose: <input type='checkbox' name='nottelling' value='yes'><input type='hidden' name='form' value='submitted'> <input type='submit' value='Continue...'></form>"); }; ?> |
Variables are created, and in them is stored info submitted via a form.
Now, another question. If the $username box is not empty and $nottelling doesn't equal 'yes', continue down to '}elseif...' section, then end the script. Otherwise, go down to the '}elseif...' section, and continue form there.
The echo command displays info. In this example it will display "<h1 align='center'>Site Title</h1><p>Welcome to our site, $username!</p><p>(REST OF YOUR CONTENT)...</p>" as HTML, which should look something like this in a web browser:
|
||
Site TitleWelcome to our site, (YOUR USERNAME HERE)! (REST OF YOUR CONTENT)... |
If the $form box equals 'submitted', the following would be displayed in a web browser, and the script would end:
|
||
Site TitleWelcome to our site! (REST OF YOUR CONTENT)... |
If neither the first or second questions are answered as we want them to be, the following would be displayed in a web browser:
|
||
Site TitleWelcome to our site! Please provide us with the following information! Neopets Username:Check if you would prefer not to disclose: |
How it works: The first time you load the page it displays the form. You submit this form to the page, and your username is put in the username box. If you check the prefer not to disclose box (called 'nottelling') the $nottelling variable gains the value 'yes'. If the $nottelling variable is 'yes' (ie. you check the box) then you are shown a page without your username on. If it's not checked and your username doesn't equal nothing (ie. you've submitted the form) you're shown a page with your username on.
The form includes a hidden value called 'form' which equals 'submitted'. We use this to see if the form has been submitted or not. When the form is submitted, $form equals 'submitted', so you're not shown the form page again. Otherwise, you're shown a page with a form on for submitting your info.
Processing Info
Part 1 - Ask user for age and then display it!
|
||
| <? $form = $_POST['form']; $age = $_POST['age']; if($form == 'submitted'){ echo("<h1 align='center'>Site Title</h1><p>Welcome to our site!</p><p>You are $age year(s) old!</p><p>(REST OF YOUR CONTENT)...</p>"); }else{ echo("<h1 align='center'>Site Title</h1><p>Welcome to our site!</p><p>Please provide us with the following information!</p><form method='post' action='$PHP_SELF' name='form'>Age: <input type='text' maxlength='2' name='age' size='2'><input type='hidden' name='form' value='submitted'> <input type='submit' value='Continue...'></form>"); }; ?> |
Creates the variables used in this code and assigns their values.
If the $form box equals 'submitted', the following would be displayed, and the script would end:
|
||
Site TitleWelcome to our site! You are (YOUR AGE HERE) year(s) old! (REST OF YOUR CONTENT)... |
This would display the following in a web browser:
|
||
Site TitleWelcome to our site! Please provide us with the following information! Age: |
How it works: The first time you load the page, the $form box does not equal 'submitted', so the form is displayed. When the form is submitted, the $form box is assigned the value 'submitted', and the first echo statement is worked, which displays a page displaying the users age.
Part 2 - Display different things dependant on submission!
|
||
| <? $age = $_POST['age']; $nottelling = $_POST['nottelling']; $form = $_POST['form']; if($form == 'submitted'){ if($nottelling != 'yes'){ if($age <= '10'){ echo("<h1 align='center'>Site Title</h1><p>Welcome to our kids site, for 0-10 year-olds!</p><p>(REST OF YOUR CONTENT)...</p>"); //ECHO1 }elseif($age <= '16'){ echo("<h1 align='center'>Site Title</h1><p>Welcome to our teens site, for 11-16 year-olds!</p><p>(REST OF YOUR CONTENT)...</p>"); //ECHO2 }elseif($age >= '17'){ echo("<h1 align='center'>Site Title</h1><p>Welcome to our adults site, for 17+ year-olds!</p><p>(REST OF YOUR CONTENT)...</p>"); //ECHO3 }else{ echo("<h1 align='center'>Site Title</h1><p>Welcome to our site!</p><p>(REST OF YOUR CONTENT)...</p>"); //ECHO4 } }else{ echo("<h1 align='center'>Site Title</h1><p>Welcome to our site!</p><p>(REST OF YOUR CONTENT)...</p>"); //ECHO5 } }else{ echo("<h1 align='center'>Site Title</h1><p>Welcome to our site!</p><p>Please provide us with the following information!</p><form method='post' action='$PHP_SELF' name='form'>Age: <input type='text' maxlength='2' name='age' size='2'> Check if you would prefer not to disclose: <input type='checkbox' name='nottelling' value='yes'><input type='hidden' name='form' value='submitted'> <input type='submit' value='Continue...'></form>"); //ECHO6 }; ?> |
Creates the variables used in this code and assigns their values.
If $form box equals 'submitted' continue through the code. Otherwise, jump straight to the sixth echo in the code (ECHO6) which would display the following:
|
||
Site TitleWelcome to our site! Please provide us with the following information! Age:Check if you would prefer not to disclose: |
If $nottelling box does not equal 'yes' continue through the code. Otherwise, jump straight to the fifth echo in the code (ECHO5) which would display the following:
|
||
Site TitleWelcome to our site! (REST OF YOUR CONTENT)... |
If $age is less than or equal to 10, ECHO1 is displayed. If $age is between 11-16, ECHO2 is displayed. If $age is 17 or over, ECHO3 is displayed. If $age is anything else (ie. text) ECHO4 is displayed.
ECHO1:
|
||
Site TitleWelcome to our kids site, for 0-10 year-olds! (REST OF YOUR CONTENT)... |
ECHO2:
|
||
Site TitleWelcome to our teens site, for 11-16 year-olds! (REST OF YOUR CONTENT)... |
ECHO3:
|
||
Site TitleWelcome to our adults site, for 17+ year-olds! (REST OF YOUR CONTENT)... |
ECHO4:
|
||
Site TitleWelcome to our site! (REST OF YOUR CONTENT)... |
How it works: The first time you load the page, you are asked for your age. Dependant on what group your age lies in (0-10, 11-16, 17+) a different page is displayed. If you check the prefer not to disclose box, you are shown a page without any age indication on it.
Helpful Hints (For more experienced users)
PHP can vary, depending on how it's written. Some of the things mentioned in this tutorial could be written in different ways.
| I write... | This could also be written as... | Info |
| if($age
>= 17){ echo("<h1 align='center'>Site Title</h1><p>Welcome to our adults site, for 17+ year-olds!</p><p>(REST OF YOUR CONTENT)...</p>"); }else{ |
if ($age
>= 17) { echo("<h1 align='center'>Site Title</h1><p>Welcome to our adults site, for 17+ year-olds!</p><p>(REST OF YOUR CONTENT)...</p>"); } else { |
After an if(), the square brackets contain the code to execute. The square brackets can be on the same line, indented, or on different lines. It doesn't matter. |
| echo("You are $age year(s) old!"); | echo "You
are $age year(s) old!"; echo "You are".$age." year(s) old!"; |
I write echo() with brackets as I think it's neatest to the eye. However, they are not necessary. |
| if(($username != '') && ($nottelling != 'yes')) | if(($username != '') and ($nottelling != 'yes')) | '&&' is the same as 'and'. It doesn't matter what you use. |
| echo("stuff"); | echo('stuff'); | It does not matter if you use double or single speech marks. However, single speech marks can't handle variables! |
| echo("$stuff"); |
COULD NOT BE WRITTEN AS: echo('$stuff'); |
What I'm trying to show is that there are many different ways to write the same things. Do not be surprised if you see a completely different code doing the same thing!
Conclusion
This is the very basics of processing and displaying user-inputted info. It's been lengthened out so I can show you exactly what's going on without too much trouble, but works fine.
If you would like to test any of our codes out for yourself, or want to use them on your own website after editing them, you just need to make sure you save the file with a '.php' extension (NOT '.html') and upload it to a PHP-enabled server.
