Question

I have 2 problems at the moment. I bought a template and am trying to integrate it into a rails app.

First problem:

I’m having trouble with the jquery tools form validations. The validation is not working. When you click the submit button, it just shows the input’s value where the validation message should be. Also, even though the required fields are filled in, it still won’t let me submit the form.

If you go to this link – , you can try and edit the data to see the valiation errors.

Second problem:

If you go to this link – , you can see that the avatar and “Edit info” button are hanging through the gray background. How can i get that gray background to fully encapsulate the avatar icon?

Answer 1

The problem is in your validation script only.,

Please refer the following location :

To see it in action http://jsbin.com/uwuqul/1/edit

I did three changes in your codings those are,

(1). I have changed the Validator Script

<script src="http://cdn.jquerytools.org/1.2.7/full/jquery.tools.min.js" type="text/javascript"></script>

(2). For Email validation, we need to change the type in email field,like

<input id="demo_email" name="demo_email" required="required" size="30" type="text" value="" novalidate/>

(to)

<input id="demo_email" name="demo_email" required="required" size="30" type="email" value="" novalidate/>

(3). Adding Style in validator script

jQuery(".edit_profile_form").validator({ 
      position: 'top', 
      offset: [25, 10],
      messageClass:'form-error',
      message: '<div style="width:270px;"><em/></div>' // em element is the arrow
    }).attr('novalidate', 'novalidate');

I think this may help you resolve your problems.