form validation for tabluar data from a db load.

[casa3311]

I'm trying to figure out the best way to validate this form. This is a simple email sending script in PHP. Please don't suggest a canned script or something. I have to write this from scratch.

I read contact information from a database which I display out to the browser. Some of the info is changable and some is not. I will have numerous rows and 4 columns in the table part. The first field in each row is a checkbox and the user needs to be able to click check all or clear all button to check or clear this check box. Here is the column info:

checkbox
company (static)
name (changeable)
email address (changable)

For each row, if the checkbox is selected, then the name and email fields cannot be empty.

Then, I have these text fields:
from name
from email
cc name
cc email
subject
message (textarea)

All of these text fields are required.

Would it be better to give each column field a different name, like:
<input type="checkbox" name="cb_1" value="1" id="cb_1" />
<input type="hidden" id="Company_1" name="Company_1" value="company1" />
<input type="text" class="textBox" id="Name_1" name="Name_1" value="Jon Smith" size="35" />
<input type="text" class="textBox" id="Email_1" name="Email_1" value="john@anywhere.com" size="50" />

or would this be better?
<input type="checkbox" name="cb" value="1" id="cb" />
<input type="hidden" id="CompanyName" name="CompanyName" value="company1" />
<input type="text" class="textBox" id="Name" name="Name" value="Jon Smith" size="35" />
<input type="text" class="textBox" id="Email" name="Email" value="john@anywhere.com" size="50" maxlength="255" />

My problem is that I'm having trouble getting the checkbox working along with the other validations. I'm a great PHP programmer, but terrible at JavaScript. Any help would be greatly appreciated.

 

[cLFlaVA]

first of all, IDs need to be unique.

Secondly, why not grab all table rows in a collection, then loop through the collection. for each row, find the checkbox. if it's checked, validate the other elements in the row.



*cLFlaVA
----------------------------
[tt]"quote goes here"[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]

 

[casa3311]

I just need to find an example of how to loop through the collection.

So far, I have this function:

function checkedAll (id, checked) {
  var el = document.getElementById(id);
  for (var i = 0; i < el.elements.length; i++) {
    el.elements[i].checked = checked;
  }
}

that is referenced with these 2 buttons:

<input type="button" name="checkAll" value="Check All" id="submitbutton" onClick="javascript:checkedAll('emailForm', true)" />
<input type="button" name="checkAll" value="Clear All" id="submitbutton" onClick="javascript:checkedAll('emailForm', false)" />

I've been working on this for a week. I have the Check All/Clear All working, but the validation of the rest is where I'm having trouble.

My form tag looks like this:

<form class="frm" name="emailForm" id="emailForm" action="check.php" method="post" onsubmit="javascript:return ValidateForm(this.form)">

and my submit button looks like this:

<input type="submit" name="sendemail" id="submit" value="Send eMail" />

I'm guessing that the onsubmit function, ValidateForm, needs be very similar to the checkAll function.

I think I know just enough JavaScript to mess things up big time, but not enough to fix it.

Thanks,
Alisa

 

[dkdude]

Alisa,

Knowing PHP as you do, here's an advice. As I read your post, you've got a number of record sets like the one (four-field) you posted, right?

If that's the case, then you can pass them on to PHP as arrays. The trick is to name them like this:

<input type="checkbox" name="[COLOR=red]cb[][/color]" [COLOR=blue]checked="checked"[/color] id="cb"  />
  company name :<input type="hidden" name="[COLOR=red]CompanyName[][/color]" value="company1" />
  <br />
  name : <input type="text" class="textBox" name="[COLOR=red]Name[][/color]" value="Jon Smith" size="35" />
  <br />
  email : <input type="text" class="textBox" name="[COLOR=red]Email[][/color]" value="john@anywhere.com" size="50" maxlength="255" />
  <hr />

Then you can read them directly in PHP as array -but, that's beside the topic here ;-)

Have a look at this snippet, which loops through your form. It should point you in the right direction:

function ValidateForm() {
  var form = document.getElementById('emailForm');
  for(i=0;i<form.cb.length;i++) 
    if(form.cb[i].checked) {
      if(form.Name[i].value.length==0)
        alert('Name number '+(i+1)+' missing');
      if(form.Email[i].value.length==0)
        alert('Email number '+(i+1)+' missing');
    }
}

It depends upon the checked="checked", that you can find in blue print in the form fieldset I posted.

-do you see where I'm going now? If not, just get back and I'll elaborate.


Jakb