I'm using JQTransform to style all form elements. Is it possible to disable the styling on a specific element, leaving all the others styled by JQTransform?
I've added if( $input.hasClass('ignore') == true ) { return; }
to line 99 of the plugin to ignore any text fields with class=ignore. Maybe this will help you.
Use the class jqtransformdone
. It is built in-to the plugin.
I'm confirming that mattbee's solution has worked for me in leiu of a response from the member posting the question. As instructed, I pasted the code on line 99, above the following line:
if($input.hasClass('jqtranformdone') || !$input.is('input')) {return;}
To anyone that it isn't obvious to, paste the code ABOVE line 99 rather than REPLACING line 99 as follows:
/*Custom code: Regarding class for elements exceptional to transformation.*/
/*Custom code: http://stackoverflow.com/questions/3727517/jqtransform-exclude-an-element-from-styling*/
if( $input.hasClass('ignore') == true ) { return; }
if($input.hasClass('jqtranformdone') || !$input.is('input')) {return;}
I didn't see an option to comment on mattbee's answer so I've submitted it in the form of an an answer.
EDIT: The above code will prompt jqTransform to skip/exclude/ignore/avoid input elements. In my case I used it to exclude type="text" and type="image". However, applying the .ignore class to my textarea element indeed excluded the undesired transformation but for some reason additionally excluded the transformation of my select elements. Please note that the edit to jquery.jqtransfrom.js for the text area was made within the textarea function starting at line 201 of the original unedited document rather than the function for the text fields starting at line 95 in the above code block.
Here's an example of what I attempted (placed ABOVE line 207):
if( $textarea.hasClass('ignore') == true ) { return; }
To reiterate, it worked but also excluded the transformation of my select boxes which wasn't my intention.
After searching for solutions I came across the following blog post: http://www.deliciouscoding.com/post.cfm?entry=use-jqtransform-and-tinymce-together
Essentially, the table that jqTransform creates to replace textarea elements is replaced by a textarea or more simply put, it undoes the transformation:
<!--Undo textarea transformation.-->
<!--Source: http://www.deliciouscoding.com/post.cfm?entry=use-jqtransform-and-tinymce-together.-->
<script language="javascript">
jQuery(function(){
jQuery("form.transform table").replaceWith('<textarea></textarea>');
});
</script>
For those new to jQuery, the above code is to be placed in with the head of your document (i.e. between <head>
and </head>
).
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With