Javascript/jQuery

Submit is not a function?! ARGH!!

This Javascript error happens when you have a function trying to call the form’s submit() method, but you also have a button with the name “submit”.  This causes a conflict in Javascript, because the submit method is already bound to that button.

To solve the problem, simply change the name of the button so that name=”mySubmitButton” (orwhatever you like). Your submit() call in your javascript function/method will now work. (YAY!)

After moving a client’s website to a new server, several Javascript functions which used to work fine, were causing problems.  One of the discrepancies is the error listed above.  I assume these new errors are due to a slightly different server configuration.  Regardless, the above solution works perfectly.  I hope this helps you as well.  Many thanks to Christo and his posting: http://www.spiration.co.uk/post/1232/Submit-is-not-a-function. I only found his post AFTER I pulled out my hair, so hopefully it will grow back soon.

Read more

Check all Checkboxes with jQuery

I was searching for a solution to this problem and came upon this post. Most Javascript functions that do this rely on the fact that the input checkboxes all have the same ‘name’ property.  This jQuery solution merely requires them to all be in the same FIELDSET.  Clean, simple and effective.  Brilliant solution.  Bravo Brian Cray!

SUMMARY

This code checks/unchecks all checkboxes within the same fieldset. A simple end elegant solution to a problem that would be much more involved in Javascript alone.

HTML

<fieldset>
	// these will be affected by check all
	<div><input type="checkbox" class="checkall"> Check all</div>
	<div><input type="checkbox"> Checkbox</div>
	<div><input type="checkbox"> Checkbox</div>
	<div><input type="checkbox"> Checkbox</div>
</fieldset>
<fieldset>
	// these won't be affected by check all; different fieldset
	<div><input type="checkbox"> Checkbox</div>
	<div><input type="checkbox"> Checkbox</div>
	<div><input type="checkbox"> Checkbox</div>
</fieldset>

The jQuery Piece

$(function () { // this line makes sure this code runs on page load
	$('.checkall').click(function () {
		$(this).parents('fieldset:eq(0)').find(':checkbox').attr('checked', this.checked);
	});
});

You can see it in action here in Brian's site:

http://briancray.com/tests/checkboxes/index.html

Read more