Beutelevision » jQuery http://beutelevision.com/blog2 by Thomas Beutel Fri, 23 Jul 2010 16:24:05 +0000 http://wordpress.org/?v=2.8.4 en hourly 1 Detecting a click in a checkbox with jQuery http://beutelevision.com/blog2/2010/03/20/detecting-a-click-in-a-checkbox-with-jquery/ http://beutelevision.com/blog2/2010/03/20/detecting-a-click-in-a-checkbox-with-jquery/#comments Sat, 20 Mar 2010 16:07:50 +0000 Thomas Beutel http://beutelevision.com/blog2/?p=206 A simple script to detect when a checkbox is clicked. What you do with once you’ve detected the click is up to you.

 <html>
 <head>
 <script src="http://www.google.com/jsapi"></script>
 <script>
 google.load("jquery", "1.3.2");
 google.setOnLoadCallback(function() {
  $('#agree').click( function() {
    if($(this).attr('checked')){
      alert('checked');
    }
    else{
      alert('unchecked');
    }
  });
 });
 </script>
 </head>
 <body>
 <p>
 <input id="agree" type="checkbox" /> I agree
 </p>
 </body></html>
]]> http://beutelevision.com/blog2/2010/03/20/detecting-a-click-in-a-checkbox-with-jquery/feed/ 0 Result of expression ‘document.forms[0].submit’ [[object HTMLInputElement]] is not a function. http://beutelevision.com/blog2/2009/09/15/result-of-expression-document-forms0-submit-object-htmlinputelement-is-not-a-function/ http://beutelevision.com/blog2/2009/09/15/result-of-expression-document-forms0-submit-object-htmlinputelement-is-not-a-function/#comments Tue, 15 Sep 2009 21:34:48 +0000 Thomas Beutel http://beutelevision.com/blog2/2009/09/15/result-of-expression-document-forms0-submit-object-htmlinputelement-is-not-a-function/ I was trying to add a small delay into my form submission like so:

<form ... onsubmit="setTimeout('document.forms[0].submit()',2000);return false;">

but everytime I tried it, I got the following error:

Result of expression 'document.forms[0].submit' [[object HTMLInputElement]] is not a function.

This one had me stumped, until I realized what it was telling me… that my submit button was named “submit”.

<input type="submit" name="submit" id="Button1" />

I changed the name of the submit button and the problem went away.

<input type="submit" name="button1" id="Button1" />

Basically, Javascript provides a “convenience” by adding the names of the form inputs as children of the form. But this then clashes with preset function names, like the submit() function.

]]> http://beutelevision.com/blog2/2009/09/15/result-of-expression-document-forms0-submit-object-htmlinputelement-is-not-a-function/feed/ 2 Using jQuery and Prototype together while avoiding the dreaded element.dispatchEvent error http://beutelevision.com/blog2/2009/08/28/using-jquery-and-prototype-together-and-avoiding-the-dreaded-elementdispatchevent-error/ http://beutelevision.com/blog2/2009/08/28/using-jquery-and-prototype-together-and-avoiding-the-dreaded-elementdispatchevent-error/#comments Fri, 28 Aug 2009 18:13:27 +0000 Thomas Beutel http://beutelevision.com/blog2/?p=161 Here is what I do to avoid the dreaded “element.dispatchEvent is not a function” error. I load jQuery first, Prototype second, and then I use jQuery( ) instead of $( ) for all my jQuery calls.

 <!--  Set up jQuery and prototype together  -->
 <script src="http://www.google.com/jsapi"></script>
 <script>
 google.load("jquery", "1.3.2");
 google.load("prototype", "1.6.0.3");
 google.setOnLoadCallback(function() {
  jQuery('#helphide').hide();
  jQuery('#helpbutton').click( function(){
    jQuery('#helphide').toggle();
 });
 });
 </script>
]]> http://beutelevision.com/blog2/2009/08/28/using-jquery-and-prototype-together-and-avoiding-the-dreaded-elementdispatchevent-error/feed/ 0 Fix Margins in IE6 with jQuery http://beutelevision.com/blog2/2008/07/25/fix-margins-in-ie6-with-jquery/ http://beutelevision.com/blog2/2008/07/25/fix-margins-in-ie6-with-jquery/#comments Sat, 26 Jul 2008 00:19:45 +0000 Thomas Beutel http://beutelevision.com/blog2/?p=87 IE6’s well known margin problems can be solved many ways, such as using CSS that only IE6 will read.

I like to use CSS and jQuery as follows:

CSS:

#wrapper
 {
  margin: 0 auto;
  width: 800px;
  ...
 }
 .wrapperie6
 {
  width: 810px !important; /* compensate for IE6 */
 }

and the jQuery code:

$(document).ready(function() {
  if($.browser.version == '6.0'){
  // alert('you are using ie6');
  $('#wrapper').addClass('wrapperie6');
  }

It’s rude and crude, but it does the job.

]]> http://beutelevision.com/blog2/2008/07/25/fix-margins-in-ie6-with-jquery/feed/ 0