# Validating in DoneJS

**URL:** https://forums.bitovi.com/t/validating-in-donejs/422
**Category:** Uncategorized
**Created:** [October 1, 2016, 4:41pm UTC](https://forums.bitovi.com/t/validating-in-donejs/422 "2016-10-01T16:41:43Z")
**Posts on this page:** 6
**Page:** 1

<div class="post-metadata">

### Author: ![tqwhite](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.bitovi.com/tqwhite/32/147_2.png) [@tqwhite](https://forums.bitovi.com/u/tqwhite)
#### Post date: [October 1, 2016, 4:41pm UTC](https://forums.bitovi.com/t/validating-in-donejs/422/1 "2016-10-01T16:41:43Z")

</div>

Can someone please point me to a clue about how to execute form validation in the DoneJS mode?

Thanks.

---

<div class="post-metadata">

### Author: ![pYr0x](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.bitovi.com/pyr0x/32/95_2.png) [@pYr0x](https://forums.bitovi.com/u/pYr0x)
#### Post date: [October 2, 2016, 4:35pm UTC](https://forums.bitovi.com/t/validating-in-donejs/422/2 "2016-10-02T16:35:11Z")

</div>

Do you had a look into [https://github.com/canjs/can-validate](https://github.com/canjs/can-validate) ?

---

<div class="post-metadata">

### Author: ![tqwhite](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.bitovi.com/tqwhite/32/147_2.png) [@tqwhite](https://forums.bitovi.com/u/tqwhite)
#### Post date: [October 4, 2016, 2:52pm UTC](https://forums.bitovi.com/t/validating-in-donejs/422/3 "2016-10-04T14:52:36Z")

</div>

Thanks for the suggestion. I ended up writing my own.

---

<div class="post-metadata">

### Author: ![roemhildtg](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.bitovi.com/roemhildtg/32/103_2.png) [@roemhildtg](https://forums.bitovi.com/u/roemhildtg)
#### Post date: [November 6, 2016, 10:56pm UTC](https://forums.bitovi.com/t/validating-in-donejs/422/4 "2016-11-06T22:56:58Z")

</div>

Tqwhite, are you able to share your implementation? I’m looking into doing validation also.

---

<div class="post-metadata">

### Author: ![tqwhite](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.bitovi.com/tqwhite/32/147_2.png) [@tqwhite](https://forums.bitovi.com/u/tqwhite)
#### Post date: [November 11, 2016, 4:37pm UTC](https://forums.bitovi.com/t/validating-in-donejs/422/5 "2016-11-11T16:37:46Z")

</div>

Sorry it’s been so long.

I didn’t do anything terribly complicated. I added a routine to each model called validate().

 ![](https://canada1.discourse-cdn.com/flex035/uploads/donejs/original/1X/f47d2571c35debd4bb0d0d0996092f148c986256.png)

My client wants this saved constantly (and the likely user load allows this possibility) so the processing for save is done ‘onChange’ and validates each field as it is entered.

![](https://canada1.discourse-cdn.com/flex035/uploads/donejs/original/1X/ba5aff77829549c0c6a89b8b954a56d7514846c9.png)

So, you’ll see that I call validate() twice. First time with the name of the field. If no error, then I check the entire data object. If an error is returned, I tell the view model to update itself.

![](https://canada1.discourse-cdn.com/flex035/uploads/donejs/original/1X/5d833e9e46b27aac62bff703921b6d3becbe061e.png)

(The setTimeout() allows the DOM to update itself before I write to it again.)

Note also that I format the items in the error list so that they are the same as those that come from the server (eg, ‘user name already taken’). Server errors I detect in the promised return from the model’s AJAX call and update the view model again by updating the errorlList, ie,

```
this.attr('errorList', {user:[errorObj], domObj:domObj});

```

Not that I think there is anything special about it, I include the code below.

```
    validate: function(fieldName) {
        let name;
        const errorList = [];

        const checkValidation = (fieldName) => {
            switch (fieldName) {
                case 'first':
                case 'last':
                case 'username':
                    if (!this.attr(fieldName) || !this.attr(fieldName).length) {
                        errorList.push({
                            fieldName: fieldName,
                            errorText: fieldName + " cannot be empty"
                        });
                    }
                    break;
                case 'emailAddress':
                    if (!this.attr(fieldName) || !this.attr(fieldName).length) {

                        errorList.push({
                            fieldName: fieldName,
                            errorText: fieldName + " cannot be empty"
                        });
                    }
                    if (!this.attr(fieldName) || !this.attr(fieldName).match(/@/)) {

                        errorList.push({
                            fieldName: fieldName,
                            errorText: fieldName + " must be a valid email address"
                        });
                    }            
                    break;
            }
        }

        if (fieldName) {
            checkValidation(fieldName);
        } else {
            ['first', 'last', 'username'].map(checkValidation);
        }
        return errorList;

    }

    //==============================

const changeHandler=function(domObj, event) {
            
            this.viewModel.clearEntryError();

            const fieldName=domObj.attr('fieldName');
            const saveObj=this.viewModel.attr('workingUser');
        
            let errorList=saveObj.validate(fieldName);
            if (errorList.length){
                this.viewModel.showEntryError(domObj, errorList);
                return;
            }
                
            errorList=saveObj.validate();
            if (errorList.length){
                this.viewModel.showIncompleteStatus(domObj, errorList);
                return;
            }

        
            this.viewModel.saveObject(domObj);
        
        };

export default Component.extend({
  tag: 'user-admin-users-editor',
  viewModel: ViewModel,
    events: {
        'input change': changeHandler,
        'textarea change': changeHandler

    },
  template
});
```

---

<div class="post-metadata">

### Author: ![roemhildtg](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.bitovi.com/roemhildtg/32/103_2.png) [@roemhildtg](https://forums.bitovi.com/u/roemhildtg)
#### Post date: [November 16, 2016, 2:20pm UTC](https://forums.bitovi.com/t/validating-in-donejs/422/6 "2016-11-16T14:20:15Z")

</div>

Thanks for sharing, I like the approach. I was thinking about trying to implement a validations framework with canjs-validate, but your approach is nice because it is simple.
