Verify Form Inputs Before Continuing?

[JeffWalden]

Hey guys, it's me again... I thought I was done; just real close.

I have a form that looks like this:

$i=0; 
while( $desertlist = mysql_fetch_array( $desertquery ) ) 
{ 
    $desertCheckboxes .='<tr><td><font face="verdana" size="2" color="#000000"><input type="checkbox" name="DesertName['.$i.']" value="' 
                    . $desertlist["DesertName"] 
                    . '">' 
                    . htmlspecialchars($desertlist["DesertName"]) 
                    . '</td>' 
                    . '<td><font face="verdana" size="2" color="#000000"><input type="text" size="3" name="DesertSlices['.$i.']"></td>' 
                    . '</tr>'; 
$i++; 
} 
echo ($desertCheckboxes); 

Basically, if the user would like to add that particular "desert" to their order, they would first have to check the checkbox and then type in a qty. My problem comes in with user error. If the user does not check the checkbox, but enters a quantity, it is not going to show up on the summary page... they physically need to check that box!

Am I guessing javascript would allow me to create some sort of messaging system that would alert the user if they entered a quantity and did not check the box? Even better, is there a way to get around the checkboxes and just use qty textboxes?

The output looks like this:

if(isset($_POST['DesertName'])){
 
echo '<tr><td bgcolor="#CCCCCC"><font size="3"><b>Desert Name</b></td><td bgcolor="#CCCCCC"><font size="3"><b>Slices</b></td></tr>';
$DesertName = $_POST['DesertName']; 
$desertslices = $_POST['DesertSlices'];
foreach ($DesertName as $i=>$Desert) 
{ 
    echo '<tr>'; 
    echo '<td><font size=3> ' . $Desert . '</td>'; 
    echo '<td><font size=3> ' . $desertslices[$i]      . '</td>'; 
    echo '</tr>';    
}
} 

So basically, the check box selects the desert name, and the textbox enters a quantity. Nothing happens unless the box is checked. Could I activate the "DesertName" with just entering a value in the textbox?

Thanks guys!

[Zoef]

Yes, javascript should do the trick, but why bother? Couldn't you just get rid of the checkbox and just leave the textbox with value="0" ?

IMHO this would be less confusing, less error prone, and less clicking (=easier) for the visitor.

Just my 2cents.

Rik

[JeffWalden]

Take a look at www.soupladle.com/order.php

It will display all the stuff available for that day, and the user selects what they want to order. If I do away with the checkbox, the name of every product will ALWAYS show up on the summary page, just won't have a qty. See what I mean? The summary page needs to only show exactly what the consumer wants to order... not every name of every product.

Make sense?

I will do a forum search for the javascript thing. I am just getting started in PHP and know nothing about javascript.

[Zoef]

I'm no javascript expert either but you should search for 'javascript form validation'. I rember reading a pretty descent tutorial over at www.webmonkey.com once.

About the summary page... You obviously ignore any products with '0' qty. Shouldn't be to hard to script that... (me thinks )

Rik

[LiamW]

Just a tip here.
You should always validate form entry on the server side of things instead of with javascript seeing as people can easily disable javascript in their browser and get around it.

[Zoef]

Just a tip here.
You should always validate form entry on the server side of things instead of with javascript seeing as people can easily disable javascript in their browser and get around it.

Agreed... partially .

One should not count on Javascript validation since 10-12% of users have it disabled. It is something one can do in addition to server side validation. The advantage being that 88-90% of your users don't have to wait for the page to reload to find out they've made an error.

Rik

[Dr Livingston]

Ummm..... Javascript would help, though you'd still have the problem if they've disabled Javascript....

One option - the easiest - would simply not bother to echo out a product if quantity held zero - by default thus visitor would then simply skip over it as he/she isn't interested.

Next option is to actuall check for the checkbox being ticked or not, correct ?

From what I remember off hand, you need to check to see if the variable holds 'on' - ie ticked, which btw goes the same for radio buttons as well.

<input type='checkbox' name='TickBoxOne' ...>
.
.
.
# later
.
$TickBoxOne = $_POST['TickBoxOne'];
 
 
if(isset($TickBoxOne) && strtolower($TickBoxOne) == (string) 'on') {
# check box has been ticked
} else {
# check box has not been ticked 
}
.
. 

See what this part throws back, though it is untested - I do know that the return value ('on') is correct though for a checkbox being ticked.

[JeffWalden]

But that would still not work because it has no relationship to the textbox. I need it so that when a value (other than 0) is intserted into the textbox, that the checkbox MUST also be ticked.

What you have (I think) will only check to make sure the checkbox has been ticked IF a value for that checkbox is passed. I need a validation for that checkbox when the associated textbox has a value. This is to ensure a value is indeed passed for the checkbox, not to use the value of the checkbox itself.

I think I intepreted that right, if I didn't, please correct me.

[Mike]

Disable the textbox until the checkbox is ticked. Thus, if they have js disbaled, the forum will simply be useless.

[siteguru]

As has already been said, simply do away with the checkbox and preload each QTY field with 0 when the orderform loads. e.g. ...

<input type="text" size="3" name="BreadQty[0]" value="0"> 

... When the form is submitted you simply get each form value for quantities, and omit any which equal 0 or are not numeric.

[Dr Livingston]

Okay, I see now. So what you'd need to do is use Javascript since you want to dynamically change the page on a user event; can't be done from the server w/out a page refresh

So, have an 'onchange' event on the textbox it's self, and validate only numerics above 0.

If this is the case - true - then also within the same event, switch on the checkbox by reference to it's name.

.
.
# untested
if(document.forms.myForm.ProductAmnt.value > 0) {
document.forms.myForm.ProductChckBox.checked == true;
}
.
. 

If you know little Javascript, then a tutorial on using FORMs may be in order;

Try www.wdvl.com and/or www.irt.org or www.webreference.com/js or how's about this site for forum help ?

www.siteexperts.com - this is a good forum site for Javascript, a place I used to hang out at before I moved to PHP/sitepoint

[redux]

Disable the textbox until the checkbox is ticked. Thus, if they have js disbaled, the forum will simply be useless.

way to go in terms of accessibilkity...

[JeffWalden]

Okay Dr Livingston...

I think I am missing something obvious, like the rest of the javascript...

<input type="text" size="3" name="DesertSlices['.$i.']" onChange="if(document.forms.myForm.DesertSlices.value > 0) {
document.forms.myForm.DesertName.checked == true;
}"> 

Does this part look right? So I am assuming I would add the <script> tags before the form?

<script language="javascript" type="text/javascript">
<input type="text" size="3" name="DesertSlices['.$i.']" onChange="if(document.forms.myForm.DesertSlices.value > 0) {
document.forms.myForm.DesertName.checked == true;
}">
</script> 

This is probably the wrong approach, but I'm trying. Any help?

[JeffWalden]

Another idea...

I am trying to pass the ...what was the checkbox... value as a hidden value. This way the customer doesn't even have to bother with ticking boxes and such. Still, I need to be able to switch it off if there is no value > 0 entered in the textbox. Is this possible?

I tried using isset on the summary page, the printout page that totals everything they just entered.

if(isset($_POST['DesertQty'])){
 
echo '<tr><td bgcolor="#CCCCCC"><font size="3"><b>Desert Name</b></td><td bgcolor="#CCCCCC"><font size="3"><b>Slices</b></td></tr>';
$DesertName = $_POST['DesertName']; 
$desertslices = $_POST['DesertSlices'];
foreach ($DesertName as $i=>$Desert) 
{ 
    echo '<tr>'; 
    echo '<td><font size=3> ' . $Desert . '</td>'; 
    echo '<td><font size=3> ' . $desertslices[$i]      . '</td>'; 
    echo '</tr>';    
}
} 

But it is still being desplayed. Do I need an if statement? If so where?

[Dr Livingston]

Ummm....

.
# your FORM ....
.
.
<input type='checkbox' name='NameOfBox' onChange='CheckProdAmnt();'>
.
.
# remaining parts of FORM ...
. 

You do not need to have <script>..</script> tags in there since your calling a Javascript function which would be within the document HEAD...

For example your TEXT element for the above CHECKBOX has a name of ProdAmnt, try the following, again untested though...

Going by sheer memory after a few beers (of course ):

function CheckProdAmnt() {
var oForm = document.forms.myForm;
if(oForm.ProdAmnt.value == 0) {
# no amount given for this product
# so need to uncheck your checkbox
# here goes...
#
oForm.NameOfBox.checked == false;
} # close off ProdAmnt being zero
.
} 

Okay, first I think you need to have your CHECKBOX names as an array ? ie

... name='NameOfBox[]' ... 

So from the point of view of PHP, it'll return an array of elements. Although I've yet to use CHECKBOXes this way.

On the otherhand, you could use the DOM to get the length (ie the number) of CHECKBOXes you have in your FORM (which are dynamically created using PHP I assume ? - not a problem from the DOMs point of use though) and then within a loop, look at each TEXT element (ie name of ProdAmnt) and check/uncheck each CHECKBOX this way.

See how it works so far, and I'll look into the DOM method tomorrow, okay ?

[JeffWalden]

I appreciate your help, but it doesn't seem to be working...

In the HEAD of the document

<script language="javascript" type="text/javascript">
function CheckProdAmnt() {
var oForm = document.forms.myForm;
if(oForm.BreadQty['.$i.'].value == 0) {
oForm.BreadName['.$i.'].checked == true;
} # close off ProdAmnt being zero
.
}
</script> 

Any part of my form

$i=0; 
while( $breadlist = mysql_fetch_array( $breadquery ) ) 
{ 
    $breadCheckboxes .='<tr><td><font face="verdana" size="2" color="#000000"><input type="checkbox" onChange="CheckProdAmnt();" name="BreadName['.$i.']" value="' 
                    . $breadlist["BreadName"] 
                    . '">' 
                    . htmlspecialchars($breadlist["BreadName"]) 
                    . '</td>' 
                    . '<td><font face="verdana" size="2" color="#000000"><input type="text" size="3" name="BreadQty['.$i.']"></td>' 
                    . '</tr>'; 
$i++; 
} 
echo ($breadCheckboxes); 

I named the form myForm. This doesn't seem to have any effect on the situation. I made sure JavaScript is turned on, so it should be working. Maybe I should just start over...

I need to pull the names of products from various tables, display these products for selection and qty input, and then spit out a page that shows only what was selected in a printable format.

Is there a better way to do this?