asked on

Validating Coldfusion with Jquery by Global Variable Access

How to access a global variable within a javascript .each() function? Yes, I know this is bad practice but I still need to do it. I'm creating a form with dynamic form input fields. I'm iterating through those fields and if the value is zero or an empty space I want to form validation to let the user know they need to enter a number. But when I try to edit the global variable or modify a form field value I'm not able to do that. I'm using jquery to do this. Can anybody offer a way validate this form without a plugin? Attached is my code. I'm using cold fusion and jquery as the base language.
EE_simpleJqueryValidation.txt

ASKER CERTIFIED SOLUTION

_agx_

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Julian Hansen

Why are you doing an event.preventDefault(); on document load - makes no sense - event is not defined and nothing to prevent at this stage?

Then, why are you prefixing isFormValid with window - just use the variable name.

Second are you using the required attribute on the input fields?

If you require additional validation I would put a class on the fields that need to be validated - that way you can easily find the ones you need to validate

var validate = $('.validate');

Open in new window

You could then filter this array and run your validation.

NB: You can achieve the same thing using the 'required' attribute on the form fields that have to have a value - this is a preferable solution.

Here is how to do it if you want to do it yourself
HTML

<form>
  <input type="text" name="firstname" class="validate">
  <input type="text" name="lastname">
  <input type="text" name="email" class="validate">
  <input type="submit">
</form>

Open in new window

jQuery

$(function() {
  $('form').submit(function(e) {
    var validate = $('.validate');
    var errors = validate.filter(function(i,a) {
      if (!a.value) return a;

      return false;
    });

    if (errors.length) {
      e.preventDefault();
      alert("Errors");
    }
  });
});

Open in new window

_agx_

Yeah, I'd go with Julian's answer. It's better than mine.

Garbonzo_Horowitz

ASKER

Thank you both for your response. I really appreciate it. I was able to resolve it with _agx_ example. Bringing the isFormValid var into the for-each block worked just fine.

@Julian Hansen -

Why are you doing an event.preventDefault(); on document load - makes no sense - event is not defined and nothing to prevent at this stage? A: I was just using it while testing to prevent the form from submitting. I didn't even need it because it was replaced by "return false".

Then, why are you prefixing isFormValid with window - just use the variable name. A: Again just testing if that made any difference in declaring a global variable. I couldn't access any variable when in the for-each loop.

Second are you using the required attribute on the input fields? A: No I was not.

If you require additional validation I would put a class on the fields that need to be validated - that way you can easily find the ones you need to validate. A: This is a good suggestion and I will look into more complex validation methods.

Julian Hansen

I was just using it while testing to prevent the form from submitting. I didn't even need it because it was replaced by "return false".

That wasn't the question. You have

<script>
    $( document ).ready(function() {
		event.preventDefault(); // <==== This makes no sense

Open in new window

Again just testing if that made any difference in declaring a global variable. I couldn't access any variable when in the for-each loop

Again makes no sense - that variable is accessible within the loop.

Second are you using the required attribute on the input fields? A: No I was not.

It was more of a recommendation than a question - you don't need JavaScript to test required fields - that is precisely what the required attribute is for.

This is a good suggestion and I will look into more complex validation methods.

That is not a more complex validation method - it was suggested because it is a far simpler method than the way you were doing it - take a look again at my example.