Form field validation handler issue

cancel
Showing results for 
Search instead for 
Did you mean: 
Highlighted
afielden
Active Member II

Form field validation handler issue

I'm hoping someone here can help out with this problem, because I've done everything as per the book, to use a Javascript function to validate a form field. Here's what I've done:

Altered the share-config-custom.xml file, as follows:

<forms>

  <dependencies>
    <js src="js/date-range-validator.js" />
  </dependencies>

<form>

  <appearance>

    <field id="myfield:dfc-start-date">
      <constraint-handlers>
        <constraint type="MANDATORY" validation-handler="myspace.forms.validation.checkDateRangeValidity" event="keyup"/>
        </constraint-handlers>
    </field>

   ...

</form>  

</forms>

Created a date-range-validator.js file, which I placed in src/main/assembly/web/js

if (typeof fbs == "undefined" || !fbs) {
  var fbs = {};
}

myspace.forms.validation.checkDateRangeValidity = function checkDateRangeValidity(field, args, event, form, silent, message) {
  var valid = true;

  alert('Checked date ' + field);

return valid;
}

However, when the form is displayed I get an exception because "myspace" isn't defined, so it looks like my validator code isn't being loaded. I've tried placing the Javascript file in a variety of locations within the project, but the problem still persists.

12 Replies
sanjaybandhniya
Senior Member

Re: Form field validation handler issue

if you are using sdk3  then your javascript file should be at share/src/main/resources/META-INF/js location.

if you are using sdk  then your javascript file should be at share/src/main/amp/web/js location.

Thanks,

Sanjay

afielden
Active Member II

Re: Form field validation handler issue

Hi Sanjay,

Thanks for your help here and on SO, I appreciate it. Yes this is very odd, I have tried placing my Javascript at both those locations, but so far the validator hasn't shown up in the browser.

sanjaybandhniya
Senior Member

Re: Form field validation handler issue

does your form loaded properly?

afielden
Active Member II

Re: Form field validation handler issue

Ok let's try something else - how about attaching a validate function to the form's submit button? Is this possible using the form specification in the share-config-custom.xml file?

afielden
Active Member II

Re: Form field validation handler issue

Yes, the form is displayed correctly. Just encounters an error when I click on the field to be validated.

sanjaybandhniya
Senior Member

Re: Form field validation handler issue

using share-config-custom.xml we can not do that.

jpotts
Advanced II

Re: Form field validation handler issue

Did you declare your client-side JavaScript file as a dependency in share-config-custom.xml?

<config>
  <forms>
    <dependencies>
      <js src="/resources/someco-core-share/js/some-validator.js"/>
    </dependencies>
  </forms>
</config>

That assumes your file is in src/main/resources/META-INF/resources/someco-core-share/js/some-validator.js.

afielden
Active Member II

Re: Form field validation handler issue

Hi Jeff. Thanks for taking an interest in my problem. Yes I do declare the dependency in share-config-custom.xml.

Just to double check, I created the same directory structure you suggest, and get the same problem. When I try to use my form, the browser's Javascript console displays an error because of the undefined "someco-core-share". Looking at the collection of Javascript sources, I don't see my validator listed.

So the form is trying to use my validator function, but the browser doesn't know anything about it.

jpotts
Advanced II

Re: Form field validation handler issue

As I pointed out in your cross-post on SO, you may be missing the enclosing "config" element which should be a parent of "forms". Can you confirm whether or not that is the case?

Also, an alternative to using share-config-custom.xml is to put all of your Share config into a Share module extension. I have a working example of a similar validator that used that approach, so if you don't get this working as-is, you might try that approach instead (although it really shouldn't make a difference).