CODEWITHSUNDEEP
javascriptsecuritydojo
Richard Garside
Richard Garside

Reputation: 89160

Password checking in dojo

I want to check that two passwords are the same using Dojo.

Here is the HTML I have:

<form id="form" action="." dojoType="dijit.form.Form" />

<p>Password: <input type="password"
name="password1"
id="password1"
dojoType="dijit.form.ValidationTextBox"
required="true"
invalidMessage="Please type a password" /></p>

<p>Confirm: <input type="password"
name="password2"
id="password2"
dojoType="dijit.form.ValidationTextBox"
required="true"
invalidMessage="This password doesn't match your first password" /></p>

<div dojoType="dijit.form.Button" onClick="onSave">Save</div>

</form>

Here is the JavaScript I have so far:

var onSave = function() {
if(dijit.byId('form').validate()) { alert('Good form'); }
else { alert('Bad form'); }
}

Thanks for your help. I could do this in pure JavaScript, but I'm trying to find the Dojo way of doing it.

Upvotes: 3

Views: 11264

Answers (3)

voidstate
voidstate

Reputation: 7990

Even easier, use the pre-written Dojox widget, dojox.form.PasswordValidator.

http://docs.dojocampus.org/dojox/form/PasswordValidator

It does everything you want straight out of the box!

Upvotes: 2

Ed.
Ed.

Reputation: 6222

This will get you a lot closer

  • setting intermediateChanges=false keeps the validator running at every keystroke.
  • the validation dijit's constraint object is passed to its validator. Use this to pass in the other password entry
  • dijit.form.Form automatically calls isValid() on all its child dijits when it's submitted, and cancels submittion if they don't all validate. I though the invalid ones would get their error message, but they don't. That's left as an exercise for the reader ;-)

the validation function:


function confirmPassword(value, constraints)
{
    var isValid = false;
    if(constraints && constraints.other)  {
        var otherInput =  dijit.byId(constraints.other);
        if(otherInput) {
            var otherValue = otherInput.value;
            console.log("%s == %s ?", value, otherValue);
            isValid = (value == otherValue);
        }
    }
    return isValid;
}
function onsubmit()
{
    var p1 = dijit.byId('password1').value;
    var p2 = dijit.byId('password2').value;
    return p1 == p2;
}

and the input objects:


<p>Password: <input type="password"
    name="password1"
    id="password1"
    dojoType="dijit.form.ValidationTextBox"
    required="true"
    intermediateChanges=false
    invalidMessage="Please type a password" /></p>

<p>Confirm: <input type="password"
    name="password2"
    id="password2"
    dojoType="dijit.form.ValidationTextBox"
    required="true"
    constraints="{'other': 'password1'}"
    validator=confirmPassword
    intermediateChanges=false
    invalidMessage="This password doesn't match your first password" /></p>

Upvotes: 4

Richard Garside
Richard Garside

Reputation: 89160

I've solved it!

This page on the Dojo forum was helpful.

I changed the HTML for the confirm password to:

<p>Confirm: <input type="password"
name="password2"
id="password2"
dojoType="dijit.form.ValidationTextBox"
required="true"
validator="return theSame(this, dijit.byId('password1'));"
invalidMessage="This password doesn't match your first password" /></p>

The only difference is the added validator parameter.

And I created the following JavaScript function:

function(dojoTxt1, dojoTxt2) {
return dojoTxt1.getValue() == dojoTxt2.getValue();
}

I think you can also use the validator parameter to create regular expressions to test against, but the documentation isn't very clear.

Upvotes: 1

Related Questions