jQueryUI Tooltip with Validate Plug In Issues

Hi

I have a form and I am using the validate plug in to handle all of the validation.

When the user clicks on submit, i want a tool tip to appear for any items that fail the validation.

I have tried to use qTip 2, Tooltipster and the JqueryUI tooltip and have encountered issues with each one.

I won't use qTip2 as its not supported for jquery 1.9.

I managed to get tooltipster working but whenever i resized the screen. It didn't correctly reposition the tooltips with respect to the form items. After playing around, it didn't seem to like using percentages for widths in the parent containers.

I would really like to get this working in JQueryUI. However I am having several problems.

$('#reg_contentwrapper input[type="text"]').tooltip();
                  

$("#register_form").validate({
                        
                        showErrors: function(errorMap, errorList) {
                              $("div.errorbox").html("The Form contains "
                              + this.numberOfInvalids()
                              + " errors, see details below.");
                              this.defaultShowErrors();
                      },
                        
                        errorPlacement : function (error, element) {
                              //error.appendTo(element.parent());//
                              
                              $(element).tooltip( "option", "content", $(error).text() );

                              },


etc...

this causes the website to crash. if i add $(element).tooltip(); before $(element).tooltip( "option", "content", $(error).text() ); it will work, but this is duplicating the tooltip

i imagine it's because the tooltip that was created initially, isn't the same as the tooltip attached to the element. how do i get around this ?

Thanks