Validating inputs

Questions
1

I’m creating an onboarding wizard and at each next button I need to validate the users input. For instance when they enter their email address.

I saw @nolimits4web had suggested this on another thread:

      app.input.validateInputs('#companyform');
      var valid = $('#email .input-invalid').length === 0

What I’m guessing is that app.input.validate() validates a specific input (in this case the entire form) and then var valid is looking to see if it passed the validation? Is that correct?

What goes after the === 0 as there’s no semi colon, it’s not a ternary so I’ve no clue what’s going on.

Also, how can you force a field to be invalid and provide your own message (i.e. “That email address is not available.”)?

2

this:

var valid = $('#email .input-invalid').length === 0

has the same result as this:

var valid = false
if ($('#email .input-invalid').length === 0) valid = true

so basically f7, after you trigger:

app.input.validateInputs('#companyform');

adds .input-invalid class to every invalid input.
so in the exaple you show, nolimit is looking for the class .input-invalid, if length != 0, then the input is invalid.

3

If anyone else has a special case for validation and wants to add their own error messages, here’s how to add and remove them:

To add:

// el = id or class selector
// msg = invalidation input message
// addInvalidMsg("#name", "Please enter your name");
function addInvalidMsg(el, msg)
{
  $(el).closest(".item-content").addClass("item-input-with-error-message item-input-invalid");
  $(el).addClass("input-invalid"); 
  $( "<div class='item-input-error-message'>" +msg +"</div>" ).insertAfter( el );
}

To remove:

// if the input has been validated, we can remove the message
function removeInvalidMsg(el)
{
  $(el).closest(".item-content").removeClass("item-input-with-error-message item-input-invalid");              
  $(el).removeClass("input-invalid");
  $(el +" +div").remove();
}
2 Likes
4

Все гораздо проще: [SOLVED] ListInput and custom validation logic