Can't get custom validation to work

cagi · January 21, 2013, 2:50pm

Hi, this is my firs post ans I’m novice in all this just trying to make my way out here. Also I would like to apologise in advans for my bad language.
So, on to my problem, as subject states I’m having trouble validate some input field using my own function. Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
       <link rel="stylesheet" type="text/css" href="codebase/skins/dhtmlxform_dhx_skyblue.css">
 
	<script src="codebase/dhtmlxcommon.js"></script>
	<script src="codebase/dhtmlxform.js"></script>
</head>
 
<body onload="doOnLoad()">
	<div id="form_container" style="width:380px;height:250px;"></div>
	<script>
		var myForm, formData;
		function doOnLoad() {
			formData = [
			    {type:"settings",position:"label-top"},
					{type: "input", name: 'Name', label: 'Name:', validate:"MyEmptyF"},
					{type:"input", name:"Age", label:"Age:"},
					{type: "button", name:"Confirm", command:"confirm", value:"Confirm"}
		        ];
			myForm = new dhtmlXForm("form_container", formData);
 
			myForm.attachEvent("onButtonClick", function(id){ 
			         myForm.validate();
			})
			
			function MyEmptyF(data){
				alert("MyEmptyF")
				return true
			}
		}	
		</script>
 
</body>
</html>

I’m not getting “MyEmptyF” alert?
Thanks in advance.

Darya · January 21, 2013, 3:26pm

Hi
Take this :

function MyEmptyF(data){ alert("MyEmptyF") return true }
from the doOnLoad() function - place after.

cagi · January 21, 2013, 3:42pm

So I did but no luck for me. Still not working?

Darya · January 21, 2013, 3:44pm

Type anything in this input before to click the button.

cagi · January 21, 2013, 3:56pm

Colleague from work provided an older version of ‘dhtmlxform.js’ and then my example worked out!
Why ‘dhtmlxform.js’ which I took from ‘…\dhtmlxSuite_v35_pro_120822\dhtmlxForm\codebase’ (it’s where I extracted DHTMLX 3.5 files) isn’t working is beyond me?!

cagi · January 21, 2013, 4:04pm

To make things even odder, when I applied new ‘dhtmlxform.js’ file to my actual project (in opening post code provided by me is just small example) my form gets all assorted.

cagi · January 21, 2013, 5:08pm

Ok, I sorted it out with ‘dhtmlxform.js’ so please forget about it, my mistake. But problem persist, the only way for my alert window to show is to set ‘value’ attribute to not empty, so
Instead of:

{type: "input", name: 'Name', label: 'Name:', validate:"MyEmptyF"}

do it like this:

{type: "input", name: 'Name', label: 'Name:', value:" ", validate:"MyEmptyF"}

Now I get the alert window.
Please also note, that when value attribute is an empty string it’s not working eiter. This wont work:

{type: "input", name: 'Name', label: 'Name:', value:"", validate:"MyEmptyF"}

Can You please confirm this, is it same with you and why do I need to set ‘value’ to non-empty string?

Darya · January 22, 2013, 8:24am

Validation isn’t caused for empty input.

cagi · January 22, 2013, 8:37am

Ok, so what is yours advice how to accomplish custom validation for this? I don’t want to populate my imput field with anything when loading my form (so I put value:"").
Upon button press event I want to execute my own validation (custom rule) which will not get fired if inital state of attribute value isn’t set to non empty string?? Please note that I don’t want to use dhtmlx built in validation rule “NotEmpty”, instead I want my own function to be called for validation purposes.
Thanks for your input on this.

Darya · January 22, 2013, 9:57am

If you don’t want to use validate:“NotEmpty,MyEmptyF” (though it would be the simplest way), you can onValidateError Event, which will call NotEmpty.

cagi · January 22, 2013, 11:39am

What I was trying is: whem the button is pressed check and see if input field is empty, if so display message box (dhtmlx message box) displaying “Please enter data…!” and then return false so that input field can get “all red”.

Andrei · January 22, 2013, 1:13pm

Hi

Inner form’s logic do the following thing:

if input empty and validation rule NotEmpty - fire validation, otherwise - no value = nothing to validate
if input not empty - any validation will fired

in your case your validation rule will not work while input empty. if you still need at least any validation - you can use them both, validate:“NotEmpty,YourCustomFunc”

Andrei · January 22, 2013, 1:14pm

to show dialog box you can use onValidateError event, check our demos for details

cagi · January 22, 2013, 1:51pm

Thanks for yours input.
I’ve got it.

cagi · January 22, 2013, 2:59pm

In case someone will ever be wondering same thing, this is how I did it:

	var myForm, formData;
	function doOnLoad() {
         formData = [
             {type:"settings",position:"label-top"},
             {type: "input", name: 'Name', label: 'Name:'},
             {type:"input", name:"Age", label:"Age:"},
             {type: "button", name:"Confirm", command:"confirm", value:"Confirm"}
              ];
         myForm = new dhtmlXForm("form_container", formData);

         myForm.attachEvent("onButtonClick", function(id){
                  MyValidate();
         })
	}   
          
	function MyValidate()
	{
		var data = myForm.getItemValue('Name');
		if(data=="")
		{
			// display yours message box
			myForm.setValidateCss("Name", "Error");//this will set desired "all red state"
			return;
		}
		
		myForm.resetValidateCss("Name");//this will reset element state to normal
		/*
		//this will reset all form's element state to 'normal'
		myForm.resetValidateCss();
		*/
	}

Andrei · January 22, 2013, 3:19pm

[code]{type: “input”, name: ‘Name’, label: ‘Name:’, validate: ‘NotEmpty’}

myForm.attachEvent(“onButtonClick”, function(id){
myForm.validate();
})[/code]

will do the same

cagi · January 22, 2013, 3:28pm

Maybe I didn’t provide sufficient code, my real form is much larger. Builtin funcionallity will mark all fields “red” which don’t pass validation rule. What I wanted is to go step-by-step, or to be more precise field-by-field:

Is fild ‘no. 1’ ok?
1a. If not display message box, mark him “red” and return
1b. If OK go to field ‘no.2’ do the same for it and all other fields

gbarnes · April 27, 2013, 2:04am

I know this is an old post, but this is something I have come up against.
Basically, I now ignore all the built-in validationrules and have created custom versions. You still have the problem of the function not being called when the input value is empty (duh!? - if empty is acceptable it should be part of the validation!), so to overcome this I commented out the following lines in the dhtmlx.js file (around line 4508 for the compiled version):

var r = true;
for (var q=0;q<item._validate.length;q++){
var v = “is”+item._validate[q];
// ISNL - to call validation function even when value is empty
// if ((val == null || val.length == 0)&& v != “isNotEmpty”) {

// }else {
var f = dhtmlxValidation[v];
if (typeof(f)!= “function” && typeof(item._validate[q]) == “function”) f = item._validate[q];
if (typeof(f)!= “function” && typeof(window[item._validate[q]]) == “function”) f = window[item._validate[q]];
r = ((typeof(f)==“function”?f(val):new RegExp(item._validate[q]).test(val)) && r);
f = null;
// }
}

Andrei · April 29, 2013, 9:21am

hi to all

the logic is:
if you need any value entered - use NotEmpty (+custom if you need)
if you need other rule - value not entered==nothing to validate