How to enable jQuery with powermail OR How to remove mootools or prototype from powermail, and use jQuery validation

In some cases we may wish to retain one single library throughout our site, so powermail does not have issues if we choose mootools or prototype.
If we prefer jQuery, then we have some issues at present, as powermail does not yet allow us to use jQuery built in.
The future version however seem to include this feature, and we are waiting, untill then this might prove useful.

  • Step 1: Set nothing for the libraryToUse contstant (of course in constants section)
    plugin.powermail.libraryToUse =
  • Step 2: Set up a different template path for the formWrap — This is important, will explain later in Step3!
    To do this I will copy the formwrap.html located in typo3conf/ext/powermail/templates/tmpl_formwrap.html to fileadmin/templates and set following constant.
    plugin.powermail.template.formWrap = fileadmin/templates/tmpl_formwrap.html

    NOTE: You may change template even in setup section, check manual or ext_typoscript_setup.txt for details.

  • Step 3: Remove the validation script from formwrap.html that we copied just now.
    If you look at the tempalte file, you can see folloing JavaScript:

    <script type=”text/javascript”>
    function formCallback(result, form) {
    window.status = “valiation callback for form ‘” + form.id + “‘: result = ” + result;
    }
    var valid = new Validation(‘###POWERMAIL_NAME###’, {immediate : true, onFormValidate : formCallback});
    </script>

    Remove the above completely including <script> tags.

  • Step 4: Remove automatic inclusion of JS files using TypoScript. (IMPORTANT: This must appear in the setup section)
    page.includeJS.file31311 >
    page.headerData.31310 >

There you go, by now you should have disabled the output of all java scripts and inclusion of JS Libraries like mootools or prototype.
Now you are free to use any library you need.

NOTE: By now the default validation methods available in powermail are also disabled. Well we can easily use the jquery form validation!