具有int和selectbox的Js验证

Question

I'm asking how to validate correctly my form.

I have a selectBox (named persorecepteur). If the selected item worth 0, the JS will check the 4 fields (all are integers and I have check the number of digits) (their names are establishment, bank, account, key).

At the end of the form, I have 2 fields that MUST be validated too (a double and a text)

So this is what I made :

<script type="text/javascript">
function valider(){
    var ck_name = /^[A-Za-z0-9 ]{3,20}$/;
        var ck_double = /^\d{3}\.\d{2}$/;


        var value = "0";
        if (myForm.persorecepteur.options[myForm.persorecepteur.selectedIndex].value == value ){

            // mist be 14701
            value = "14701";
            if (document.myForm.stablishment.value != value ) {
                document.myForm.establishment.style.backgroundColor="red";
        alert("Must be 14701");
                return false;
            }
            value = "00000";
            if (document.myForm.bank.value != value ) {
                document.myForm.bank.style.backgroundColor="red";
        alert("Must be 00000");
                return false;
            }

            if (document.myForm.account.value.length() != 11 ) {
                document.myForm.account.style.backgroundColor="red";
        alert("You must enter 11 digits");
                return false;
            }

            if (document.myForm.key.value.length() != 2 ) {
                document.myForm.key.style.backgroundColor="red";
        alert("You must enter 2 digits");
                return false;
            }

        }


        if (!ck_double.test(document.myForm.amount.value)) {
        document.myForm.amount.style.backgroundColor="red";
                alert("You must enter the sum like that : abc.de ");
                return false;
            }
    if (!ck_name.test(document.myForm.description.value)) {
        document.myForm.description.style.backgroundColor="red";
        return false;
            }

        return true;
}
</script>

But first I don't have to make "value" isn't it? Can I check the lenght like I made with .value.length() ?

Thanks to help me, I'm a beginner in JS ...

EDIT

<form name="myForm" action="performtransfert" method="POST" onsubmit="return valider();">

        <table width="100%" border="1" cellspacing="0" cellpadding="0">
    <tr>
            <td>Selectionnez un compte en banque a debiter : </td>
            <td>
                <SELECT name="debiteur" size="1">

                    <option value="4">compte facturier (Current acount) - 100.0</option>

                    <option value="7">livret vert (Spare acount) - 1379.98</option>

                </SELECT>
            </td>
        </table>
        <br /><br />

        <table width="100%" border="1" cellspacing="0" cellpadding="0">
    <tr>
            <td><SELECT name="persorecepteur" size="1">
                    <option value="0">Selectionnez l'un de vos comptes si c'est le destinataire

                    <OPTION value="4">compte facturier (Current acount) - 100.0</OPTION>

                    <OPTION value="7">livret vert (Spare acount) - 1379.98</OPTION>

                </SELECT>
                <br /><br />
                Sinon, veuillez remplir le BBAN : <INPUT type=text name="establishment" size="5"> <INPUT type=text name="bank" size="5"> <INPUT type=text name="account" size="13"><INPUT type=text name="key" size="1"> 
            </td>
        </tr>
        </table>



        <br /><br />

        <table width="100%" border="1" cellspacing="0" cellpadding="0">
            <tr>
                <td>Somme à verser : </td>
                <td><INPUT type=text name="amount" size="6"></td>
                <td>Desctiption : </td>
                <td><INPUT type=text name="description" size="45"></td>
            </tr>
        </table>

        <br /><br />
        <input type="submit" value="Valider le payement" />

    </form>

Answer 1

I suppose you are asking if you have to declare the variable value in your question But first I don't have to make "value" isn't it? ? No, you don't have to, you should be able to compare the actual value itself, like this - document.myForm.bank.value == "0"

And yes, you can check the length with document.myForm.account.value.length and not document.myForm.account.value.length()

I would recommend you start using (learning) jQuery validation. It makes things much much easier and neater...

The following simple jQuery validation will work for your form...

$(document).ready(function(){

    $("#myForm").validate({
        rules: {
            amount: {
                required: true,
                number: true
            },
            description: {
                required: true
            },
            establishment: {
                required: function(element) {
                    return $("#persorecepteur").val() == '0'
                },
                number: true
            },
            bank: {
                required: function(element) {
                    return $("#persorecepteur").val() == '0'
                },
                number: true
            },
            account: {
                required: function(element) {
                    return $("#persorecepteur").val() == '0'
                },
                number: true
            },
            key: {
                required: function(element) {
                    return $("#persorecepteur").val() == '0'
                },
                number: true
            }

        },
        messages: {
            amount: {
                required: "Needs entry",
                number: "only numbers allowed"
            },
            description: "Needs entry",
            establishment: {
                required: "Have to enter",
                number: "only numbers allowed"
            },
            bank: {
                required: "Have to enter",
                number: "only numbers allowed"
            },
            account: {
                required: "Have to enter",
                number: "only numbers allowed"
            },
            key: {
                required: "Have to enter",
                number: "only numbers allowed"
            },
        }
    });


    $('#myForm').submit(function() {
        if($("#persorecepteur").val() == '0') {
            if($("#establishment").val() !="" && $("#establishment").val() != "14701") {
                alert("Establishment must be 14701");
                return false;
            } else if($("#bank").val() != "" && $("#bank").val() != "00000") {
                alert("Must be 00000");
                return false;
            } else if($("#account").val() != "" && $("#account").val().length != 11) {
                alert("You must enter 11 digits");
                return false;
            } else if($("#key").val() != "" && $("#key").val().length != 2) {
                alert("You must enter 2 digits");
                return false;
            } 
        }
    });
 });

You will have to declare id's for your form fields for the above code to work.