What’re you eating? Part 8

It was suggested to me that a ‘quantity’ field be added to ease data entry. I’d already considered something like this being implemented as a sizetype radio button for certain cases where a weight/volume doesn’t matter - I have several recipes that just call for a number of chicken thigh fillets - but I liked this option better. What if I stock up on something? Do I have to enter it twice? I already have a plan to speed up data entry based on barcodes (although I’m yet to work out an implementation plan for it) but that would still be too clumsy for this situation - so I got to work making some small tweaks.

I started by adding a new row to my first form:

<tr>
    <td align="right" valign="middle">
        Quantity:
    </td>
    <td align="left" valign="middle">
        <input type="number" class= "textbox" name="quantity" value="1" min="1" max="999"/>
    </td>
</tr>

Essentially the same as the others but with a new input type number and I set a default value of 1 and I also set min and max values. Something to note: While I like that on a browser it comes up with a nifty spinner to go up and down numbers without typing, this doesn’t display on my mobile’s browser (where I’ll realistically be doing most of the data entry). I’m still deciding on the best implementation of this, but I think I’ll still leave the default value of 1 rather than blank because it’ll still save me time in the long-run until I change it. I’m already considering add JavaScript to the project to do the barcode searching I mentioned earlier, so maybe that will assist in this.

A small side note: another limitation I saw with this is that it assumes that all of the products have the same date - I reasoned this is acceptable because on the off-chance you buy multiple things and they have different dates, they probably won’t be too far apart for the data to still provide value.

I then had to update the data-entry PHP to handle different quantities which was pretty simple, changing the code where I defined/executed the SQL statement to:

$x = 0;
while ($x < $_POST['quantity']) {
    // Prepare the update statement
    ..........
    $stmt->execute();
    $x++;
}

Which serves to increment x until the correct number of entries has been achieved - so, as always, let’s test!

I give thanks to auto-fill

Success!

Fantastic - it works! Now I can enter multiples of products!

Now, I’m getting quite sick of navigating between pages via URL so I’m going to quickly bring in links between these pages so I can jump back and forwards.

<table rules="cols">
    <tr>
        <td><a href="index.html"><div>Pantry Updater</div></a></td>
        <td><a href="pantry_list.php"><div>Pantry List</div></a></td>
    </tr>
</table>

I had an idea about what I wanted to achieve here - a table across the top of the page where the whole cell is a link, rather than just the word itself. I had to do some digging through old university files to find a project where I’d previously done this but I found it. Now, dear reader, this works…..but I hate it. The rules=”cols” displays column separators and I’ve set the link <a> tags to consist of a <div> tag that spans the whole cell to make it all clickable. 20 y.o Pat that wrote this was pretty damn proud of himself but I am not. I am, however, leaving it in because it solves my current problem but I will replace it ASAP. A quick search showed me a JavaScript alternative of:

<td onclick="location.href='index.html'">Home</td>

Being the 3rd time in such a short period that the internet has screamed “JavaScript would be so much better for this!” - it might be time to stop moving forward with band-aid solutions and start implementing things properly before the problems become too big for me to handle.

I also want to start implementing CSS to have some semblance of design to my pages so I have a few avenues to work on. The only ‘design’ I have now came from when my girlfriend just said “you need a splash of colour” and stood there expectantly until I brought up a colour chart and asked her which she’d like - and now you all get to experience it with me:

Welcome to the world, aquamarine….