How to validate a field?

I have tried to setup the validation for some fields but with any results.

I have followed these steps:

- From the Wizard edit: Field "name" > click on "Show the element settings box" > Validation > flag on "required".

- From the form manager > JS validation:
Enable JS Validation = yes
Validation Errors = default
JS Validation Theme = classic
JS Validation Language = italian
Errors event = onSubmit

Nothing happen...

How to do for a right validation of fields?

Thanks for your help!

Filippo

Hi d-force,

Please post a link to the form so I can take a quick look.

I think that there is a bug in the Italian language file - does the validation work if you choose English?

Bob

Hi Bob,

thank you for your kind reply!

This is the link to the form http://www.piedicosta.com/joomla-16/it/contatti/richiesta-informazioni.html

Even if I choose "english" validation does not work.

Is there also a possibility to set the error message?

Hi d-force,

Your template (or some other component) is loading the jQuery JavaScript library. Out of the box jQuery isn't compatible with the MooTools library used by Joomla! and ChronoForms. You can use jQuery with MooTools in no-conflict mode. There are various ways of doing this. The simplest is to add a line of script in the ChronoForms Form JavaScript box:

jQuery.noConflict();

This will free the $ operator which is used by MooTools, so you may need to update your own javascripts to use the longer jQuery operator.

You can edit the messages in the FormsCheck language files - see the components/com_chronoforms/js/formcheck/lang folder

Bob

Ciao Bob,

thank you for your kind reply!

I have discovered that the problem is given by this code used by the main menù:

<script type="text/javascript" src="http://www.piedicosta.com/joomla-16/templates/template_piedicosta/js/jquery-1.2.6.min.js"></script>

How can I solve this? Where do I find the "ChronoForms Form JavaScript box" to add the code you gave me to avoid the JQuery conflict?

Thanks!

Problem solved!

I have added after:

<script type="text/javascript" src="http://www.piedicosta.com/joomla-16/templates/template_piedicosta/js/jquery-1.2.6.min.js"></script>

the following code:

<script type="text/javascript">  $.noConflict();</script>

It's possible to adjust the position of the tootip (ex. top 10px, left 25px) with the error message?

Thank you in advance!

Hi d-force,

If you are using ChronoForms v4 then you can try using the Load JavaScript action. But this is a problem with your template or some other extension and putting the code in the form may not work.

Bob

Hi d-force,

It is possible to adjust the position of the validation messages. There are a whole list of configuration options shown here. I think that you need the tipsOffsetX and tipsOffsetY Display settings.

ChronoForms v4 doesn't make it easy to add these - but if you use my Show HTML action from here it includes an input box for these options.

Bob

Hi Bob, and thank you for your reply!

Where can I find the file to set tipsOffsetX and tipsOffsetY ?

com_chronoforms > js > and than...?

Thanks a lot! 😀

Hi Bob, and thank you for your reply!

Where can I find the file to set tipsOffsetX and tipsOffsetY ?

com_chronoforms > js > and than...?

Thanks a lot! 😀

OK, it seems I have found it, but nothing happen if I change tipsOffsetX and tipsOffsetY...doesen't matter.

[quote="d-force"]Problem solved!

I have added after:

[code]<script type="text/javascript" src="http://www.piedicosta.com/joomla-16/templates/template_piedicosta/js/jquery-1.2.6.min.js"></script>[/code]

the following code:

<script type="text/javascript">  $.noConflict();</script>

It's possible to adjust the position of the tootip (ex. top 10px, left 25px) with the error message?

Thank you in advance![/quote]

Hi Bob, sorry to bother you but I have realized that if I write in the home.php the code

<script type="text/javascript">  $.noConflict();</script>

The slide panel I have on the bottom of the page http://www.piedicosta.com/joomla-16/it/contatti/richiesta-informazioni.html dosent's open.

It seems a conflict with this code:

$(document).ready(function() {
    $(".topMenuAction").click( function() {
        if ($("#openCloseIdentifier").is(":hidden")) {

            $("#slider").animate({
                marginTop: "0px"
                }, 500 );
            $("#topMenuImage").html('<img src="http://www.piedicosta.com/joomla-16/templates/template_piedicosta/images/open.png"/>');
            $("#openCloseIdentifier").show();

        } else {

            $("#slider").animate({
                marginTop: "-141px"
                }, 500 );
            $("#topMenuImage").html('<img src="http://www.piedicosta.com/joomla-16/templates/template_piedicosta/images/close.png"/>');
            $("#openCloseIdentifier").hide();

        }
    }); 
});

In fact, if I cancel the code
[code]<script type="text/javascript"> $.noConflict();</script>[/code]
the bottom panel open itself, but the validation of Chronoforms fields doesen't work.

Could you be so kind to help me? please...

Filippo

Hi d-force,

It's the same problem. You have the noConflict script soon after JQuery is loaded - but the slidepanel.js script has sneaked in between :-(

Bob

Hi Bob,

sorry but I continue not to understand...

Where do I have to place the noConflict to let both script works?

Filippo

Hi d-force,

I don't know exactly where it goes but after JQuery is loaded and before any JQuery or MooTools script are run. Sorry not to be more helpful but this really isn't a ChronoForms problem :-(

Bob

Hi Bob,

OK, no problem. I will try to find a solution in some way...

Thanks the same!

Filippo