custom validation

[acarur01]

SC 8.3 2013-07-25
Firefox/IE

I've tried to create a mockup of what we have currently in our product. Our listgrids do not do any validation on the browser side since the business logic is on the serverside. So what happens is when the user exists the edit mode, an update request gets sent, then comes back with the validation error. I assume this is set on the field by doing a setRowErrors() call on the listgrid when the validation error response comes back. So I have mimicked this in the validate button click.

So here's my scenario:

1. Load the sample below. Click on "add". This will add a new row at the bottom. Let's call this row #15
2. Click on validate. This will show my custom validation.
3. Now click on add button again. Again, this will add a new row at the bottom. Validation icon for row #15 is still there
4. Now click into the second column of row #15 then click somewhere else. The validation icon for row #15 is now gone.

What am I doing wrong here?

Using countryDS from this example:

isomorphic/system/reference/SmartClient_Explorer.html#dataValidation

isc.ListGrid.create({
    ID: "countryList",
    width:550, height:224, alternateRecordStyles:true, cellHeight:22, height:400,
    dataSource: countryDS,neverValidate: true,
    fields:[
        {name:"countryCode", title:"Flag", width:40, type:"image", imageURLPrefix:"flags/16/", imageURLSuffix:".png", canEdit:false, validateOnChange:false},
        {name:"countryName2",validateOnChange:false},
        {name:"continent"},
        {name:"member_g8"},
        {name:"population", formatCellValue:"isc.Format.toUSString(value);",
            validators:[
                {type:"integerRange", min:1}
            ]
        },
        {name:"independence"}
    ],
    autoFetchData: true,
    canEdit: true,
    editEvent: "click"
})


isc.Button.create({
ID:"testButton", title:"validate",top: 250,left:700,
click:function(){

countryList.setRowErrors(15,    
            
            {
                countryName2:{
                    errorMessage:"Name must be specified"
                }
            })


}})
isc.Button.create({
ID:"addButton", title: "add ", top: 250, left:800,
click: function(){
countryList.startEditingNew();
}
})

[Isomorphic]

Calling setRowErrors() doesn't give us any context on when the validation error should be cleared, so it is cleared the next time validation runs.

For correct behavior, define validators (server-side only if that's all you can do).

[acarur01]

I don't want the browser to do anything with my validations. Is there any way to stop that? I've got neverValidate set to true. Serve validations are a must in our line of applications

[Isomorphic]

So they are permanent and can never be cleared no matter what the user does? :)

The browser side system has to have some situation in which the errors should be cleared. If you define a validator (client or server) and it returns errors, then we know we can run the same validator again to determine if the error can be cleared.

So defining validators is how you get a correct lifecycle for errors.

[acarur01]

I obviously want the errors cleared at some point!

By that I meant that I want my updates to clear the validation. If I create these validators, will they go back to the server in order to be fired again or are you forcing them to fire on the browser side?

My point is, I want all logic of validation to be done on the server-side - returning OR clearing the error will come back via dsresponse from the update request.

[Isomorphic]

Right, so as we mentioned in the first reply, define validators, and mark them as serverOnly if that's the only place you're doing validation.

[acarur01]

Ok. I will attempt this. Thanks

[acarur01]

So I added a really simple validator in countryList2 and marked it as serverCustom just to see if the listgrid would keep the validation error - Unfortunately it does not. In a real scenario, I cannot put any logic in my validator as part of the rendered UI because of how we have our data objects decoupled from our UI objects when the UI objects are rendered.


Am I in a completely wrong track at this point?

isc.ListGrid.create({
    ID: "countryList",
    width:550, height:224, alternateRecordStyles:true, cellHeight:22, height:400,
    dataSource: countryDS,neverValidate: true,
    fields:[
        {name:"countryCode", title:"Flag", width:40, type:"image", imageURLPrefix:"flags/16/", imageURLSuffix:".png", canEdit:false, validateOnChange:false},
        {name:"countryName2",validateOnChange:false,
validators:[
                {type:"serverCustom"}
            ]},
        {name:"continent"},
        {name:"member_g8"},
        {name:"population", formatCellValue:"isc.Format.toUSString(value);",
            validators:[
                {type:"integerRange", min:1}
            ]
        },
        {name:"independence"}
    ],
    autoFetchData: true,
    canEdit: true,
    editEvent: "click"
})


isc.Button.create({
ID:"testButton", title:"validate",top: 250,left:700,
click:function(){

countryList.setRowErrors(15,    
            
            {
                countryName2:{
                    errorMessage:"Name must be specified"
                }
            })


}})
isc.Button.create({
ID:"addButton", title: "add ", top: 250, left:800,
click: function(){
countryList.startEditingNew();
}
})

[Isomorphic]

That's a nonsense validator definition - you can't declare type:serverCustom on the client side and not provide any server backing. See the docs on serverCustom for how to do this properly.

No matter what you do, any errors established by setRowErrors() are going to get cleared when validation is run. Again, the point here is to create a serverCustom validator that will validate the data when the framework attempts validation, and to *stop using setRowErrors()*.