[Javascript] Making a Inline validation using js DOM and CSS part II

[talofo talofo]

Shorter:
"The validarsubmit function returns as soon as a false occurs, only by
running the functions separately first will all errors be visible."
My question is exclatly there:

Why when we do return ((validar(bla, bla) && validar(bli, bli) &&
validar(pom,pom)); ONLY,
This returns only the first one?

I have the return function, and them I have a big parentesis, to cover all
possibile attributes, why only the first one is checked ?

Regards once again,
Márcio



2009/3/16 MEM <talofo at gmail.com>

> Thanks a lot for your time Troy.
> The function as you have think works very well onblur. Perfectly. :)
>
> Sure that, in the future, I want to allow the function to validate the
> e-mail field, the field.length (maybe instead of having =""), and doing all
> this in a Reusable Way. Also allow the validation of checkboxes, dropdown,
> etc... only by calling the function onblur and onsumbit.
> I will think about that and I will post my progresses.
>
>
>
> But, a problem that this function have is that, without doing any typing on
> the textboxes, and then, hiting the submit button, it does not show all
> error messages. It shows only the first one.
>
> So the workaround I've found (on a forum) was to call the function twice.
>
>
> So I have this one:
>
> <script type="text/javascript" language="JavaScript">
>
>
>                        function validar(campoId, erroId) {
>                                var campo =
> document.getElementById(campoId);
>                                var valor =  campo.value;
>
>                                if (valor == "") {
>
> document.getElementById(erroId).style.display = "inline";
>                                campo.focus();
>
>                                        return false;
>
>                                } else {
>
>
> document.getElementById(erroId).style.display = "none";
>
>                                        return true;
>                                }
>                        }
>
>
> And then I have this:
>
>                        function validarSubmit() { //não sei porquê mas, se
> correr a função duas vezes, funciona! :s MAS PORQUÊ?!!
>                                validar("nome", "erro_nome");
>                                validar("idade", "erro_idade");
>                                validar("email", "erro_email");
>
>                                return (validar("nome", "erro_nome")  &&
> validar("idade", "erro_idade") && validar("email", "erro_email"));
>                        }
>
>
> But I don't understand why this shows all messages when I use this. :s Why
> do I need to call the function validar and then, make the return again on
> the same function with the same attributes, to allow all validation error
> messages to appear, when we hit the submit button without filling in any
> text-field.
>
>
>
>
> I will look closely to your last e-mail tomorrow.
>
> Thanks a lot, really. :)
>
>
> Regards,
> Márcio
>
>
>
>
>
> -----Original Message-----
> From: javascript-bounces at lists.evolt.org
> [mailto:javascript-bounces at lists.evolt.org] On Behalf Of Troy III Ajnej
> Sent: domingo, 15 de Março de 2009 15:38
> To: javascript at lists.evolt.org
>  Subject: Re: [Javascript] Making a Inline validation using js DOM and CSS
> part II
>
>
> Hi Márcio.
>
> I've just tested it and it works as intended.
>
> I've removed your intermediate function function call, since it doesn't
>
> work that way.
>
>
>
> It is better to supply your function arguments with the needed IDs
>
> of your elements directly from the event function call where you can
>
> see them.
>
> ...
>
>  <label>Idade:
>  <input type="text" name="idade" id="idade" onblur="validar('idade',
> 'erro_idade');" />
>  <div class="erro" id="erro_idade">Campo Obrigatorio: Introduza a
> idade.</div><br />
>  </label>
>
> ...
>
>
>
> So you can move your compacted script away from the page,
>
>
>
> <!--
>  function validar(fieldId, errorId) {
>   fieldId = document.getElementById(fieldId);
>   errorId = document.getElementById(errorId);
>  if (fieldId.value == "") {
>   errorId.style.display = "inline" }
>  else { errorId.style.display = "none"   }
>  }
> -->
>
> and still preserve a higher level of its readability.
>
>
>
> But you'll be needing more code and another (better if) separated
>
> function for it to become an inteligent form validation function.
>
>
>
> Regards
> ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
>                                      Troy III
>                         progressive art enterprise
> ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
>
> > From: talofo at gmail.com
> > To: javascript at lists.evolt.org
> > Date: Fri, 13 Mar 2009 23:27:34 +0000
> > Subject: Re: [Javascript] Making a Inline validation using js DOM and CSS
> part II
> >
> > Thanks. I was really stuck on this. I will test this tomorrow and post
> back
> > the progress and the doubts.
> >
> > Thanks a lot,
> > Regards,
> > Márcio
> >
>
>
> _________________________________________________________________
> Windows Live™ Groups: Create an online spot for your favorite groups to
> meet.
> http://windowslive.com/online/groups?ocid=TXT_TAGLM_WL_groups_032009
> _______________________________________________
> Javascript mailing list
> Javascript at lists.evolt.org
> http://lists.evolt.org/mailman/listinfo/javascript
>
>