Vanilla 1 is no longer supported or maintained. If you need a copy, you can get it here.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.

Adding an onSubmit="" to Sign-up form, any easy way?

mahoddermahodder New
edited March 2007 in Vanilla 1.0 Help
Is there any easy way to add something like: onSubmit="return ValidateForm()" inside the <form> tag for the sign up form? I want to be able to validate some custom fields with javascript before the form is submitted. I'm crossing my fingers that this would be an easy hack, I have tried to figure it out myself but so far no luck.


  • I'm really not the best person to explain this, but look up addEventListener functions as an alternative way to attach a function to the form's events.
  • I've worked with the signup form to add a field. I won't be home until later, but will look at what I did. You can check in my profile for my email address.
  • @jimw: It's not a field I am looking to add though its an attribute in the starting <form tag> for the sign up form. Is that what you mean? example: <form onSubmit="return ValidateForm()"> </form>
  • @WallPhone: I could try and do it that way but that will bring a lot more cross browser compatibility problems it seems from my research.
  • Then the other solution would be to go into your themes folder, copy people_apply_form_nopostback.php into the themes/Vanilla folder, and make your edit.
  • Yeah thats the first place I looked, unfortunately the form is not rendered there in standard html as I hoped, rather it is through some funky Vanilla stuff that I am not sure how to add what I need.
  • edited February 2007
    Don't worry about the funky stuff (PHP), just edit what you need in what looks like HTML. For example, the top few lines after the edit would look like this:<?php // Note: This file is included from the library/People/People.Control.ApplyForm.php class. echo '<div class="About"> '.$this->Context->GetDefinition('AboutMembership').' <p><a href="'.GetUrl($this->Context->Configuration, $this->Context->SelfUrl).'">'.$this->Context->GetDefinition('BackToSignInForm').'</a></p> </div> <div id="Form" class="ApplyForm" onsubmit="return ValidateForm()"> <fieldset> <legend>'.$this->Context->GetDefinition('MembershipApplicationForm').'</legend> <p>'.$this->Context->GetDefinition('AllFieldsRequired').'</p>';

    edit: Oh shoot... that isn't a form element, its a div... checking...
  • hehe, yeah thats how easy I was hoping it was going to be, unfortunately not :(
  • Dug through the form control where the form element is generated and there aren't any built-in methods to attach attributes. A really hacky method would be to start output buffering before and after the form renders, capture that, parse the event into it then spit it back out. Not fun, and not sure if it even would work. Looks like this question needs to be answered by a Javascript guru. There are prototype and scriptacoulous libraries included with Vanilla that may help.
  • And it can be done with jQuery as well - but validation should be both client and server side, never just client.
  • edited February 2007
    mahooder do this..

    put your javascript functions into [directory of vanilla install]/js/global.js

    then, open up the file in the /theme folder, and add {onsubmit="function();"} right after the opening "<form" tag.
  • @quickguap: There is no opening form tag in the file in the /theme folder, that is the main problem here. I might just do it on server side I guess, there doesn't seem to be any easy way to do it on client side with Vanilla.
  • Oh your so right, Can't believe I didn't remember that. You can however do this. Instead of onsubmit to the form tag, do what I said above in the global.js and add onclick="function();" to the submit button.
  • @quickguap: Of course! That works :)
  • Any chance of a ZIP file with all these changes in? :)
This discussion has been closed.