Add an attribute to a form input - Problem

I am using the FAQ for adding an attribute to a form input, and I can get it to work on one form, but not another.

I created a plain single input form, added the "Load JS" event with the provided JavaScript, in the On Load section. Added the class, and it works great. Exactly what I needed.

I also have a multipage form, did the same "Load JS" in the On Load section, with the provided script. Added the class, but it's not working. By not working, I mean, the form shows up fine, but the attribute does not show up in the field... and in the source code reads:

<input maxlength="15" size="14" class="[placeholder=Sunday+lunch]" title="" type="text" value="" name="input_text_home_phone" />

My event tab looks like this 1) On Load -> Multi Page (0), Show html (1), Load JS (12) then 2) On Submit -> Multi Page (2), debugger (8), Email (10) 3) -> On Page Two -> Multi Page (3), Show html (5) 4) On Page Three -> Multi Page (4), Show html (8)

Is my order off in the events?

BTW: Using ChronoForms 4.0 on Joomla 3.1.1

What information can I provide to make providing a solution easier?

Thanks,
Melvins

Upon further testing, it appears that each and every text input must have some sort of [placeholder=] place in the class in order for any of them to work.

Seems like a glitch, but I have found away to work around it.

Okay, I am back to having an issue with this.

I followed the direction from the FAQ page, have it working fine, except for one thing. Making the text input "Required" breaks the place-holder labels attribute.

So I create one text input, apply the attribute to the class, then go to the "Validation" tab, and click on "Required" then repeat my steps for a second text input. I save, publish and preview the form, the first text field has the place-holder label, while the second text form does not.

If I remove the "Required" validation from both, both text inputs show the place-holder labels. Basically, once I make any field required, it breaks the place-holder label for all proceeding fields.

This is the code that breaks; with both inputs required:

<div class="ccms_form_element cfdiv_text" id="input_full_name1_container_div" style="">
	<label>Applicant's Full Name:</label>
		<input maxlength="150" size="30" class="[placeholder=John+Smith] validate['required']" title="" type="text" value="" name="input_full_name" />
			<div class="clear"></div>
			<div id="error-message-input_full_name"></div>
</div>

<div class="ccms_form_element cfdiv_text" id="input_preferred_name1_container_div" style="">
	<label>Prefers To Be Called:</label>
		<input maxlength="150" size="30" class="[placeholder=Johnny] validate['required']" title="" type="text" value="" name="input_preferred_name" />
			<div class="clear"></div>
			<div id="error-message-input_preferred_name"></div>
</div>

This is the code that works; with neither input required:

<div class="ccms_form_element cfdiv_text" id="input_full_name1_container_div" style="">
	<label>Applicant's Full Name:</label>
		<input maxlength="150" size="30" class="[placeholder=John+Smith]" title="" type="text" value="" name="input_full_name" />
			<div class="clear"></div>
			<div id="error-message-input_full_name"></div>
</div>

<div class="ccms_form_element cfdiv_text" id="input_preferred_name1_container_div" style="">
	<label>Prefers To Be Called:</label>
		<input maxlength="150" size="30" class="[placeholder=Johnny]" title="" type="text" value="" name="input_preferred_name" />
			<div class="clear"></div>
			<div id="error-message-input_preferred_name"></div>
</div>

Is there a fix to this? I need the some fields to be required.

Hi melvins138,

Sorry, that's my fault. I should have tested more :-( I never quite got to adding validation to my form.

If you find this line in the JavaScript[code]if ( cl.contains('[') ) {[/code]and change it to [code]if ( cl.contains('[') && cl.contains('=') ) {[/code]that seems to fix the problem (provided that the validation classes don't contain '=', and none of the usual ones do).

I've updated the FAQ with this change.

Bob

Hi Bob,

Wonderful!!! That did the trick. Thank you so much for your quick reply.

Melvins138