Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>a. Well, you got rid of the globals pretty well. But as your code looks right now, you can wrap the entire thing in <code>(function(){ ... all your current code in here ... }())</code> and leave <em>nothing</em> behind in global scope.</p> <p>b. For "use strict" see <a href="https://stackoverflow.com/questions/1335851/what-does-use-strict-do-in-javascript-and-what-is-the-reasoning-behind-it">this question</a></p> <p>c. <code>typeof questions['c'] === "undefined"</code>...</p> <p>d. Currently, your js is too tied to the markup (html) and vice-versa. If you add or remove something in the form, you'll have to edit your js. If you want to use the validation for another form, you'll have to start the whole thing over again.</p> <p>Validators are prime candidates for "unobtrusive javascript"/progressive enhancement (here's some material: <a href="http://www.alistapart.com/articles/behavioralseparation" rel="nofollow noreferrer">A List Apart</a> &amp; <a href="http://en.wikipedia.org/wiki/Unobtrusive_JavaScript" rel="nofollow noreferrer">Wikipedia</a>). Basically, your markup (the html), your styling (the css), and your "behaviors" (the javascript) should all be separate, so they can be changed independently. Here's something you can try:</p> <ol> <li>Add a class name to your form(s) (e.g. "validate")</li> <li>Set up your js to look for <code>form.validate</code> when the page has loaded </li> <li>For each form it finds, add a <code>submit</code> event handler</li> <li>When the handler fires, you search the given form for inputs with various other class names you specify (e.g. "required" or "phone-number" or whatever). The class names tell your code, what kinds of validations should be done. For instance, <code>&lt;input type="text" class="required zip-code"&gt;</code> would mean that a) it's a zip-code, and b) it's a required field.</li> <li>If there are any validation errors, cancel the submit and alert the user somehow. Otherwise, let the submit proceed.</li> </ol> <p>That's obviously a very rough outline, but I'm not gonna write your code for you :)<br> The point is, that if you ever need more forms or different forms or something like that you have a generic validation script, and all you need to do is "mark" the inputs with the appropriate class names.</p> <p>All that being said: There are <em>tons</em> of jQuery plugins out there that do form validation. It's definitely still a good exercise to write one yourself, but it's also a good idea to look at what's already there, and how it works. Don't look at the code right away, but read up on how those validators are used (e.g. do they use class names or something else?) and try to figure out how they work.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload