3

I am attempting to create a shared grocery list webapp as a way to learn HTML and PHP. I am attempting to follow these directions to create my item addition form.

I am trying to get my page to show the submitted data under the form as a proof of concept, but nothing will display. This is my code, saved in \XAMPP\htdocs\ :

<html>
<head>
    <title>Grocery List</title>
</head>
<body>

<?php
$category = $item = "";
?>

    <form id='additem' method='post'>
    <fieldset>
        <legend>Add Item</legend>
        <table>
        <tr>
            <td><label for='Category'>Category: </label></td>
            <td><input type='text' name='Category' list='categories' value='<?php echo $category;?>' /></td>
                <datalist id='categories'>
                    <option value='Protein'>
                    <option value='Produce'>
                    <option value='Baked Goods'>
                    <option value='Dry/Canned'>
                    <option value='Household'>
                </datalist>
        </tr><tr>
            <td><label for='item'>Name: </label></td>
            <td><input type='text' name='item' value='<?php echo $item;?>' /></td>
        </tr><tr>
            <td></td><td><input type='Submit' value='Submit' /></td>
        </tr>
        </table>
    </fieldset>
    </form>

    <?php
    echo "Your Input:";
    echo $category;
    echo $item;
    ?>

but when I open that page in my browser and input some information all I get is "Your Input:" followed by empty space where my info should be output.

Can anybody see where I am going wrong?

Kirk Beard
  • 9,569
  • 12
  • 43
  • 47
Geoff McLennan
  • 418
  • 1
  • 6
  • 15
  • 3
    `$category` should be `$_POST['category']`. When you *post* a form, the data is in the `$_POST` array. – gen_Eric Nov 30 '15 at 18:47

2 Answers2

3

It's because you aren't actually processing the $_POST variable that is submitted.

Change your code as follows:

<?php
    // Load the posted values into their respective variables
    $category = $_POST['Category'];
    $item = $_POST['item'];
    echo "Your Input:";
    echo $category;
    echo $item;
?>

EDIT
Since you've updated your question, I'm updating where you should make these changes.

Now you have your variables being declared at the top of the page (which is good). But you should now get them from the post variable there as well, and include some sort of check to see if it was posted or not (to avoid warnings / notices):

At the top of your file:

<?php
    $category = '';
    $item = '';
    // Check if the form is posted...
    if (isset($_POST['item'])) {
        // Load the posted values into the variables
        $category = $_POST['Category'];
        $item = $_POST['item'];
        // .. do the same for any other form values 
    }
?>

You may find code samples or suggestions to use extract($_POST), but I strongly recommend against using extract().

Community
  • 1
  • 1
random_user_name
  • 25,694
  • 7
  • 76
  • 115
  • That loos like it is probably my problem, I will test it when I am home from work. Thank you for your help, you made it very easy to understand and the meaning of each addition is clear. – Geoff McLennan Nov 30 '15 at 22:39
0

Your Option tags are not formatted correctly.

<option value='Protein'>Protein</option>
<option value='Produce'>Produce</option>
<option value='Baked Goods'>Baked Goods</option>
<option value='Dry/Canned'>Dry/Canned</option>
<option value='Household'>Household</option>

In this case, what's between the <option> and </option> tags will appear on screen and the value=stuff is what will be saved as the value for "Categories"

  • Without the text between the tags, the browswer isn't told to show anything on screen, which is the problem as I understand it. – Skullclutter Nov 30 '15 at 18:50
  • What about the `item` input? Wouldn't that show up if your solution was correct? – random_user_name Nov 30 '15 at 18:53
  • Cale_b is correct, the option value is enough that the form displays a drop down menu with each category in it. Since it is text input type and the drop down merely autofills the text box, the input should be a valid value to be used elsewhere in the page. – Geoff McLennan Nov 30 '15 at 22:44