views:

38

answers:

1

I am making a "color-me-table", where I have a grid of cells, and the user chooses a cell, then can decide on what to change the color in that cell to. I have the table down, but I do no really understand sessions. I could have just asked a general question about sessions, but I thought this example might make more sense. Here is my table, without any real functionality:

<?php
    session_start() ;

    if(!isset($_SESSION['color_data'])){ 
    $_SESSION['color_data']=array( 
            array("#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999"), 
            array("#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999"), 
            array("#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999"), 
            array("#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999"), 
            array("#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999"), 
            array("#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999"), 
            array("#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999"), 
            array("#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999"), 
            array("#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999"), 
            array("#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999", "#999999") 
     ); 
    } 

    switch($_POST['col']) {
        case "0" :
        case "1" :
        case "2" :
        case "3" :
        case "4" :
        case "5" :
        case "6" :
        case "7" :
        case "8" :
        case "9" :
            $col = $_POST['col'] ;
    }

    switch($_POST['row']) {
        case "0" :
        case "1" :
        case "2" :
        case "3" :
        case "4" :
        case "5" :
        case "6" :
        case "7" :
        case "8" :
        case "9" :
            $row = $_POST['row'] ;
    }

    switch($_POST['r']) {
        case "00" :
        case "33" :
        case "66" :
        case "99" :
        case "CC" :
        case "FF" :
            $r = $_POST['r'] ;
    }

    switch($_POST['g']) {
        case "00" :
        case "33" :
        case "66" :
        case "99" :
        case "CC" :
        case "FF" :
            $g = $_POST['g'] ;
    }

    switch($_POST['b']) {
        case "00" :
        case "33" :
        case "66" :
        case "99" :
        case "CC" :
        case "FF" :
            $b = $_POST['b'] ;
    }

    $color_data= $_SESSION['color_data'] ;

    if ($r && $g && $b) {

        $color_data[$_POST["row"]][$_POST["col"]]= "#$r$g$b";
    }

    if (!is_null($r) && !is_null($g) && !is_null($b) && !is_null($row) && !is_null($column) ) {

        $color_value = "#$r$g$b" ;

        $color_data[] = array($row, $column, $color_value) ;
    }

    $_SESSION['color_data'] = $color_data ;

?><html>
    <head>
        <title>Color Me Table</title>
    </head>
    <body><?php echo $color_value ; ?>
        <form action="assignment4.php" method="POST">
            <table>
                <tr>
<td width="20"></td>

<td><input type="radio" name="col" value="0">0</td>
<td><input type="radio" name="col" value="1">1</td>
<td><input type="radio" name="col" value="2">2</td>
<td><input type="radio" name="col" value="3">3</td>
<td><input type="radio" name="col" value="4">4</td>
<td><input type="radio" name="col" value="5">5</td>
<td><input type="radio" name="col" value="6">6</td>
<td><input type="radio" name="col" value="7">7</td>
<td><input type="radio" name="col" value="8">8</td>
<td><input type="radio" name="col" value="9">9</td>
</tr>
<tr>
<td><input type="radio" name="row" value="0">0</td>
<td width="20" bgcolor="#999999">00</td>
<td width="20" bgcolor="#999999">01</td>
<td width="20" bgcolor="#999999">02</td>
<td width="20" bgcolor="#999999">03</td>
<td width="20" bgcolor="#999999">04</td>
<td width="20" bgcolor="#999999">05</td>

<td width="20" bgcolor="#999999">06</td>
<td width="20" bgcolor="#999999">07</td>
<td width="20" bgcolor="#999999">08</td>
<td width="20" bgcolor="#999999">09</td>
</tr>
<tr>
<td><input type="radio" name="row" value="1">1</td>
<td width="20" bgcolor="#999999">10</td>
<td width="20" bgcolor="#999999">11</td>
<td width="20" bgcolor="#999999">12</td>

<td width="20" bgcolor="#999999">13</td>
<td width="20" bgcolor="#999999">14</td>
<td width="20" bgcolor="#999999">15</td>
<td width="20" bgcolor="#999999">16</td>
<td width="20" bgcolor="#999999">17</td>
<td width="20" bgcolor="#999999">18</td>
<td width="20" bgcolor="#999999">19</td>
</tr>
<tr>
<td><input type="radio" name="row" value="2">2</td>

<td width="20" bgcolor="#999999">20</td>
<td width="20" bgcolor="#999999">21</td>
<td width="20" bgcolor="#999999">22</td>
<td width="20" bgcolor="#999999">23</td>
<td width="20" bgcolor="#999999">24</td>
<td width="20" bgcolor="#999999">25</td>
<td width="20" bgcolor="#999999">26</td>
<td width="20" bgcolor="#999999">27</td>
<td width="20" bgcolor="#999999">28</td>

<td width="20" bgcolor="#999999">29</td>
</tr>
<tr>
<td><input type="radio" name="row" value="3">3</td>
<td width="20" bgcolor="#999999">30</td>
<td width="20" bgcolor="#999999">31</td>
<td width="20" bgcolor="#999999">32</td>
<td width="20" bgcolor="#999999">33</td>
<td width="20" bgcolor="#999999">34</td>
<td width="20" bgcolor="#999999">35</td>

<td width="20" bgcolor="#999999">36</td>
<td width="20" bgcolor="#999999">37</td>
<td width="20" bgcolor="#999999">38</td>
<td width="20" bgcolor="#999999">39</td>
</tr>
<tr>
<td><input type="radio" name="row" value="4">4</td>
<td width="20" bgcolor="#999999">40</td>
<td width="20" bgcolor="#999999">41</td>
<td width="20" bgcolor="#999999">42</td>

<td width="20" bgcolor="#999999">43</td>
<td width="20" bgcolor="#999999">44</td>
<td width="20" bgcolor="#999999">45</td>
<td width="20" bgcolor="#999999">46</td>
<td width="20" bgcolor="#999999">47</td>
<td width="20" bgcolor="#999999">48</td>
<td width="20" bgcolor="#999999">49</td>
</tr>
<tr>
<td><input type="radio" name="row" value="5">5</td>

<td width="20" bgcolor="#999999">50</td>
<td width="20" bgcolor="#999999">51</td>
<td width="20" bgcolor="#999999">52</td>
<td width="20" bgcolor="#999999">53</td>
<td width="20" bgcolor="#999999">54</td>
<td width="20" bgcolor="#999999">55</td>
<td width="20" bgcolor="#999999">56</td>
<td width="20" bgcolor="#999999">57</td>
<td width="20" bgcolor="#999999">58</td>

<td width="20" bgcolor="#999999">59</td>
</tr>
<tr>
<td><input type="radio" name="row" value="6">6</td>
<td width="20" bgcolor="#999999">60</td>
<td width="20" bgcolor="#999999">61</td>
<td width="20" bgcolor="#999999">62</td>
<td width="20" bgcolor="#999999">63</td>
<td width="20" bgcolor="#999999">64</td>
<td width="20" bgcolor="#999999">65</td>

<td width="20" bgcolor="#999999">66</td>
<td width="20" bgcolor="#999999">67</td>
<td width="20" bgcolor="#999999">68</td>
<td width="20" bgcolor="#999999">69</td>
</tr>
<tr>
<td><input type="radio" name="row" value="7">7</td>
<td width="20" bgcolor="#999999">70</td>
<td width="20" bgcolor="#999999">71</td>
<td width="20" bgcolor="#999999">72</td>

<td width="20" bgcolor="#999999">73</td>
<td width="20" bgcolor="#999999">74</td>
<td width="20" bgcolor="#999999">75</td>
<td width="20" bgcolor="#999999">76</td>
<td width="20" bgcolor="#999999">77</td>
<td width="20" bgcolor="#999999">78</td>
<td width="20" bgcolor="#999999">79</td>
</tr>
<tr>
<td><input type="radio" name="row" value="8">8</td>

<td width="20" bgcolor="#999999">80</td>
<td width="20" bgcolor="#999999">81</td>
<td width="20" bgcolor="#999999">82</td>
<td width="20" bgcolor="#999999">83</td>
<td width="20" bgcolor="#999999">84</td>
<td width="20" bgcolor="#999999">85</td>
<td width="20" bgcolor="#999999">86</td>
<td width="20" bgcolor="#999999">87</td>
<td width="20" bgcolor="#999999">88</td>

<td width="20" bgcolor="#999999">89</td>
</tr>
<tr>
<td><input type="radio" name="row" value="9">9</td>
<td width="20" bgcolor="#999999">90</td>
<td width="20" bgcolor="#999999">91</td>
<td width="20" bgcolor="#999999">92</td>
<td width="20" bgcolor="#999999">93</td>
<td width="20" bgcolor="#999999">94</td>
<td width="20" bgcolor="#999999">95</td>

<td width="20" bgcolor="#999999">96</td>
<td width="20" bgcolor="#999999">97</td>
<td width="20" bgcolor="#999999">98</td>
<td width="20" bgcolor="#999999">99</td>
</tr>
            </table>
            <table border="1" >
                <tr>
                    <th>Red</th>

                    <th>Green</th>
                    <th>Blue</th>
                </tr>
                <tr>
                    <td>
                        <select name="r" >
                            <option value="FF" >100%</option>

                            <option value="CC" >80%</option>
                            <option value="99" >60%</option>
                            <option value="66" >40%</option>
                            <option value="33" >20%</option>
                            <option value="00" >0%</option>
                        </select>

                    </td>
                    <td>
                        <select name="g" >
                            <option value="FF" >100%</option>
                            <option value="CC" >80%</option>
                            <option value="99" >60%</option>
                            <option value="66" >40%</option>

                            <option value="33" >20%</option>
                            <option value="00" >0%</option>
                        </select>
                    </td>
                    <td>
                        <select name="b" >
                            <option value="FF" >100%</option>

                            <option value="CC" >80%</option>
                            <option value="99" >60%</option>
                            <option value="66" >40%</option>
                            <option value="33" >20%</option>
                            <option value="00" >0%</option>
                        </select>

                    </td>
                </tr>
            </table>
            <input type="submit" name="submit" value="Submit" />
        </form>
    </body>
</html>
A: 

EDIT

I misinterpreted the original intent of the question, but after reviewing it again, this is an acceptable use case for sessions since it is assumed that the data persistence is only temporary. If you check on the server for the actual session file (assuming file based session storage), the AoA data structure is stored in serialized form, so this would allow the user to navigate other areas of the website and still retain the original state of the color-me-table choices until the session times out.

ORIGINAL

There are some issues with variable names, namely $col, $column.

The $_POST array is checking for an HTML input form variable named "col". However, there are two sections in code referencing a variable named "$column". Since $column doesn't exist, the code inside the if statement block checking for is_nulls never gets executed. I renamed $column to $col and I received the HTML hex color code at the top of the page after the form submission.

jtp