Please help with Live Validation and silent fail messages!

Hello to all!

I'm new to this board so I wanted to say hello to all the members!

I have been working on this project where I'm using a combination of ChronoForms, Virtuemart, LiveValidation and Bixie module. I have all the forms set up and live validation running on the fields that I want. However, there is one thing that I absolutely must have and don't know how to get it done.

I have to have to box or message or something next to or below to the "add to cart" button that tells the user that there are errors on the form. Right now the form is long enough that if you scroll down you won't catch mistakes you might have made when you were at the beginning of the form. Breaking the form to smaller chunks is not an option so I must have this message to show. I know that similar question was asked here but there was no clear answer as to how to do it.

My thought was to have a JavaScript function calling doValidations function of LiveValidation and see that if there are any kind of errors to toggle a div to display:block to show the error message. This function would be triggered inside the button using the onClick option. I have tried to do as I described but it breaks the form everytime. Maybe it has to do with the fact the form is using Bixie module to combine Chronoforms with Virtuemart but I just don't see how one has to do anything with the other. I know, however, that bixie calls a function using the Chronoform onSubmit option in the general tab of the form, maybe that has something to do with it, I don't know.

Here are the examples of the code, let me know what you think:
- Form -
<div class="form_element cf_button">
<input value="Add to Cart" name="button_4" id="sub" type="submit" onClick="doSomething();"/>
</div>

Inside the JavaScript box:
function doSomething()
{
var val = doValidations();
if (val == 'true')
-- here we toggle the div to show
}

I understand that I have to create an object of LiveValidation type but I really don't know how to do it so it's for all the objects and just one field. I hope someone can make sense out of my post and hopefully help me.

Thank you, thank you, thank you!

Hi puzon23,

You can't easily extedn he LiveValidations that ChronoForms applies (at least I haven't found a way yet). You can write Custom LiveValidations that can use more of the LiveValidation options than ChronoForms supports.

The option that you need is insertAfterWhatNode - this lets you place error messages more or less anywhere on the page.

The option is listed in the 'constructor' section of the LiveValidation docs here

Bob

If you don't mind paying a few $ I have a help document on Custom Validations here.

Hi Bob,

Thanks for your reply. I don't mind paying a few dollars as long as this will solve my problem. Do you know if that document has the info that will give me what I need in terms of solving my problem?

Thanks!

Hi puzon23,

I believe that it does. The last section has an example of using a Custom Validation with insertAfterWhatNode to show messges by the Submit button.

Bob

Hi Bob,

Thanks for the document which helped! I was able to get what I wanted out of it and now I have validation messages both right under the field being validated and at the bottom of the form. Great, however... as you all know IE happened!

IE has a problem with this sniplet of JS:

var createMessageDiv = function(make) {
  var div = document.createElement('div');
  div.setHTML(make);
  div.style.display = "block";
  div.setStyles({
    'background-color': 'white',
    'margin': '0',
    'padding': '3px',
    'width': '300px'
  });
return div;
}

It does not like the setHTML call and so on saying that the Object does not support property or method. It most likely refers to div as the object. BTW, the call to 'make' is the name of the field that is being validated.

Do you know why this is happening and if there is a way to fix it in IE. BTW, have I mentioned that I hate IE!?

Anybody?

Anyone has an idea how I can tackle this issue with IE?

Hope someone can help...