I'm trying to enable submit button when some form fields are filled. I've found a piece of javascript code that works, but I've a problem with textarea fiel which is tranformed by tinymce... How to catch it?
My html:
<form id="form_id1">
<fieldset>
<legend>Personal</legend>
Name: <input type="text" size="30" /><br />
Email: <input type="text" size="30" /><br />
Date of birth: <input type="text" size="10" /><br />
Address : <textarea size="30"></textarea><br />
</fieldset>
<input type="submit" value="Submit" />
</form>
My javascript:
$(document).ready(function()
{
$('#form_id1 input:submit').attr("disabled", true);
var textCounter = false;
$('#form_id1 input:text, #form_id1 textarea').keyup(check_submit);
function check_submit() {
$('#form_id1 input:text, #form_id1 textarea').each(function()
{
if ($(this).val().length == 0) {
textCounter = true;
return false;
}
else {
textCounter = false;
}
});
$('#form_id1 input:submit').attr("disabled", textCounter);
}
});
My tinymce init:
tinymce.init({
selector: "textarea",
language: 'fr_FR',
image_advtab: true,
menubar:false,
forced_root_block: false,
plugins: ["link","code","media","image","textcolor", "emoticons"],
toolbar: "bold italic forecolor backcolor alignleft aligncenter alignright alignjustify link unlink image media emoticons",
});
Thanks
In tinymce init add:
setup: function(ed) {
ed.on('keyup', function(e) {
console.log('Editor contents was modified. Contents: ' + ed.getContent());
check_submit();
});
}
Keep in mind you might need to find your editor instance rather than the textarea to get the actual value. If you made the textarea have id="textarea-tiny-mce"
tinymce.get('textarea-tiny-mce').getContent();