CODEWITHSUNDEEP
phpjavascript
sikas
sikas

Reputation: 5523

JavaScript and PHP parameters

I have a form that I validate it using the JavaScript.

Now when I submit the form I can't use the check boxes in that form.

This is a part of my JS that counts and validates the check boxes.

<script type="text/javascript">
function validateForm()
{
    //My Declarations
    var cases = addClients.caseType.length;
    var total = 0;
    var fnReturn = true;
    //My Script goes here
    for (var idx = 0; idx < cases; idx++)
    {
        if (addClients.caseType[idx].checked == true)
        total += 1;
    }
    if (total == 0)
    {
        document.getElementById('caseErr').style.visibility =" visible";
        fnReturn = false;
    }
    else
       document.getElementById('caseErr').style.visibility = "hidden";

    return (fnReturn == true)?true:false;
}
</script>

The next page that the form submits the data to is as follows (the portion of the check boxes):

<?php
$cases = $_POST['caseType'];
for ($i=0;$i<count($cases);$i++)
    echo "<li>$cases[$i] \n";

Echoing the $cases prints only one letter of the selected check box.

I want to know what I am doing wrong here.

EDIT:

This is my form

<form id="addClients" method="post" action="confirmAdd.php" onsubmit="return validateForm();">
<table border="0">
    <tr align="center">
        <th align="center">Client Last Name:</th>
        <td colspan="3" align="center"><input type="text" name="clname" width="300%"></td>
        <td id="lnErr" style="visibility:hidden">Last Name Required!</td>
    </tr>
    <tr align="center">
        <th align="center">Client First Name:</th>
        <td colspan="3" align="center"><input type="text" name="cfname" width="300%"></td>
        <td id="fnErr" style="visibility:hidden">First Name Required!</td>
     </tr>
    <tr align="center">
        <th align="center">Client Telephone:</th>
        <td colspan="3" align="center"><input type="text" name="ctel" width="300%"></td>
        <td id="telErr" style="visibility:hidden">Telephone Required (without hyphins '-')!</td>
    </tr>
    <tr align="center">
        <th>Cases:</th>
        <td align="center">Rape<input type="checkbox" name="caseType[]" value="rape"></td>
        <td align="center">Drug Accusition<input type="checkbox" name="caseType[]" value="Drug Accusition"></td>
        <td align="center">Assult<input type="checkbox" name="caseType[]" value="Assult"></td>
        <td id="caseErr" style="visibility:hidden">At least one required!</td>
    </tr>
</table>
<input type="submit" value="Add Client">
</form>

SOLUTION:

I have managed to find a solution to the problem by googling ...

first the name of each check box have []

Rape<input type="checkbox" name="caseType[]" value="rape">
Drug Accusition<input type="checkbox" name="caseType[]" value="Drug Accusition">
Assult<input type="checkbox" name="caseType[]" value="Assult">

then, in the javascript I added this part:

var t=0;
var c=addClients['caseType[]'];
for(var i=0;i<c.length;i++)
    c[i].checked?t++:null;

where addClients is the name of my form.

then I tried the PHP that I have attached, and it listed the values as it should.

Upvotes: 3

Views: 152

Answers (3)

Sean Thayne
Sean Thayne

Reputation: 883

In your input's name you need to add a [] to the end of the name.

<input type='checkbox' name='caseType[]' />



<script type="text/javascript">
    function getCheckBoxes( formID, name ) {

        var form = document.getElementById(formID);
        var checkboxes = form.getElementsByTagName('input');
        var returnArray = new Array();

        for (var i=0; i<checkboxes.length; i++) {
            if(checkboxes[i].name == name) {
                returnArray.push(checkboxes[i]);
            }
        }

        return checkBoxes;
    }

    function validateForm()
    {


        //My Declarations
        var cases = getCheckBoxes('addClients', 'caseType[]');;
        var total = 0;
        var fnReturn = true;
        //My Script goes here
        for (var idx = 0; idx < cases.length; idx++)
        {
            if (cases[idx].checked == true)
            total += 1;
        }
        if (total == 0)
        {
            document.getElementById('caseErr').style.visibility =" visible";
            fnReturn = false;
        }
        else
           document.getElementById('caseErr').style.visibility = "hidden";

        return false;
    }
</script>

Upvotes: 3

FatherStorm
FatherStorm

Reputation: 7183

so:

$cases = $_POST['caseType'];
//normalize to an array
if(!is_array($cases))$cases=array($cases);
//iterate over the cases.
foreach($cases as $key=>$case){
echo"<li>$case</li>\r\n";
}

Upvotes: 0

Quentin
Quentin

Reputation: 943979

The first thing that is wrong is that addClients is undefined. Perhaps you mean document.forms.id_of_form.addClients?

The second thing that is wrong is that PHP's default form handling library, contrary to almost every other form data parsing library out there attaches special meaning to names ending in the characters []. Since you appear to be looping over a set of elements, odds are that the name of the checkboxes is addClients[] and not addClients, so you would need: document.forms.id_of_form['addClients[]'] (using square bracket notation as [] has special meaning in JavaScript too).

Upvotes: 2

Related Questions