I was wondering if you could tell me where to edit the code to make my contact form work with this matching columns script. If you take a look at my form and click submit (without any input), you'll see the problem. The error messages make the form fall outside the div.
Looking at the source code that the form puts out, I assume I need to add my class="columns" to this line: <div id="usermessagea" class="cf_info"></div> . Do you think that's right? And if so, where do I find this?
The above line sets an absolute height for the parent div container. Hence it will not dynamically grow with a growing cforms form.
If you must use the 455px height, you can try to disable a few cforms options (e.g. fancy err msgs) that 'blow up' the form after submitting.
Or simply remove style="height: 455px;".
EDIT: sorry I shouldn't reply this early to posts…the style="height: 455px;" apparently stems from that 'matching columns' script.
That's a problem, because cforms uses DOM manipulation to enlarge the form when necessary, you script would have to be rerun after that (essentially triggered by cforms) to adjust again.
A min-height would certainly work better on browsers supporting it, but I'm not sure about IE etc.
Thanks so much, Oliver. I opened Firebug and found that maxHeight style you were talking about. I changed it to minHeight and all seems to be working fine now.
I spoke too soon. I still don't have this working properly. I posted a question at the support forum where I got the script and following is what they said. Can you help me with this?
<blockquote>
Ok I see it now on the /contact page…
Don't change the JS code. Tim nailed the problem.
The form is using an ajax request to validate and generate error messages.
The
columns js loads 1x when the page loads. It waits until the DOM is
fully loaded, looks at the column heights and adjusts them as needed.
Then it becomes dormant. The page will have to fully refresh to load
that script again.
The form's script doesn't need to reload the page to work – ajax.
If
you have access to the submit button's code, you might be able to add
an event handler to it to trigger the matching columns script again.
I know you didn't ask for my personal opinion :-) , but looking at your design and what you want to achieve, I would get rid of the match_columns script, it just introduces Javascript overhead without much value add.
None of what's on that page couldn't be done with CSS, and top it off, it would even work when JS is disabled by the user.
To answer your question:
The reason it isn't working is due to the function not being called. My script seems to abort and not give control to the match_c.. script. Try to remove the return part before cforms_vali…
I have the same problem as Susan; if you check my website (still under construction) http://limpede.ro and go to Register then just press Submit without entering any value (all fileds are required) it will move all the form to the left side of the site. I don't know what's the problem, i guess it might interfere with other plugins i am using…
Could you please tell me what could be the problem? If you need any aditional info please let me know. Thank you!
Me again, i just tested it again and yes, it's from the other plugins wpcodaorange uses… on other themes it works just fine. So if you have any idea what i can do please drop a note. Thank you so much anyway for this great form application.