Javascript Question

Expand toggle if label hasClass 'error'

this might be a silly question but I need to expand a toggle on a form if it returns an error. When the form is submitted it reloads the page, and therefore the slidedown is initially hidden.

There is a link to toogle down the form:

<span id="slideDownCreateMail" styleId="createEmail" class="createNewEmailGallery">Expand</span>


The HTML looks like this:

<div class="showCreateNewEmailAccount" >
<fieldset>
<h3>Enter mail</h3>
<p id="createNewEmailAccount">
<label for="name">Email:</label>
<html:text property="address" styleClass="border" styleId="address" />
</p>
<div><one:error property="address" element="label" /></div>

<p>
<label for="mailPassword1">Password:</label>
<html:password property="mailPassword1" styleClass="border" styleId="mailPassword1" />
</p>
<div><one:error property="mailPassword1" element="label" /></div>

<p>
<label for="mailPassword2">Password (again):</label>
<html:password property="mailPassword2" styleClass="border" styleId="mailPassword2" />
</p>
<div><one:error property="mailPassword2" element="label" /></div>

</fieldset>
</div>


I am trying to do it with jQuery like this:

$(document).ready(function(){

$("#slideDownCreateMail").click(function(){
$(".showCreateNewEmailAccount").slideToggle("slow");

/*if (!$(".showCreateNewEmailAccount").hasClass("error")) {
$(".showCreateNewEmailAccount").css('display','block');
}*/
});
$('.showCreateNewEmailAccount label').has('error').css('display', 'block');
});


But none of the above seems to work.
The error is returned in this tag:

<p>
<label for="mailPassword1">Password</label>
<html:password property="mailPassword1" styleClass="border" styleId="mailPassword1" />
</p>
<div><one:error property="mailPassword1" element="label" /></div>


Does anyone have any idea what might do the trick? :)
Thanks.

Answer

Without seeing more of the HTML I can only guess...

HTML - If you can add an ID to your tag

<one:error property="mailPassword1" element="label" styleId="errorLabel" />

jQuery -

$(document).ready(function(){

  if ( $('#errorLabel').hasClass('error') ) {
    $('#errorLabel').css('display', 'block');
  }

});

If you cant add a ID onto element make sure its 100% in .showCreateNewEmailAccount and then

EDIT -

$(document).ready(function(){

  if ( $('.showCreateNewEmailAccount label').hasClass('error') ) {
    $('.showCreateNewEmailAccount').css('display', 'block');
  }

});