Converting to 2 decimal places

Use .toFixed() for this.


Example:
var compliance_fee = 20;
taxreturn_fee.value = ((compliance_fee.value * 34)/100).toFixed(2);

Jquery Tips



Check if checkbox is checked


jQuery provides us 3 ways to determine if a checkbox is checked.


1. // First way


2. $('#checkBox').attr('checked');


3.


4. // Second way


5. $('#edit-checkbox-id').is(':checked');


6.


7. // Third way


8. $("[:checkbox]:checked").each(


9. function() {


10. // Insert code here


11. }


12. );






How to disabled/enable an element with jQuery


1. // To disable


2. $('.someElement').attr('disabled', 'disabled');


3.


4. // To enable


5. $('.someElement').removeAttr('disabled');


6. // OR you can set attr to ""


7. $('.someElement').attr('disabled', '');






Disable right click


Some of us might want to disable right click, or want to create our own context menu for the website, this is how we can detect right click:


1. $(document).bind("contextmenu",function(e){


2. //you can enter your code here, e.g a menu list


3.


4. //cancel the default context menu


5. return false;


6. });


Get mouse cursor x and y axis


This script will display the x and y value - the coordinate of the mouse pointer.


1. $().mousemove(function(e){


2. //display the x and y axis values inside the P element


3. $('p').html("X Axis : " + e.pageX + "
Y Axis " + e.pageY);


4. });






1.


Prevent default behaviour


Assuming we have a long page, and we have a link similar to below that is used for other purposes other than a hyperlink. If you clicked on it, it will bring you to the top of your page. The reason of this behavior is because of the # symbol. To solve this problem, we need to cancel the default behavior by doing this:


view plaincopy to clipboardprint?


1. $('#close').click(function(e){


2. e.preventDefault();


3. });


4.


5. /* OR */


6.


7. $('#close').click(function(){


8. return false;


9. });




1.






Loop through Elements Backwards


One of my personal favorites is being able to loop backwards through a set of elements. We all know each() lets us easily loop through elements, but what if we need to go backwards? Here’s the trick:



$(function(){


var reversedSet = $("li").get().reverse();


//Use get() to return an array of elements, and then reverse it


$(reversedSet).each(function(){


//Now we can plug our reversed set right into the each function. Could it be easier?


});


});






Access iFrame Elements

Iframes aren’t the best solution to most problems, but when you do need to use one it’s very handy to know how to access the elements inside it with Javascript. jQuery’s contents() method makes this a breeze, enabling us to load the iframe’s DOM in one line like this:



 
 $(function(){


var iFrameDOM = $("iframe#someID").contents();


//Now you can use find() to access any element in the iframe:






iFrameDOM.find(".message").slideUp();


//Slides up all elements classed 'message' in the iframe


});










Find a Selected Phrase and Manipulate It


Whether you’re looking to perform find and replace, highlight search terms, or something else, jQuery again makes it easy with html():


 $(function(){


//First define your search string, replacement and context:


var phrase = "your search string";


var replacement = "new string";


var context = $(body);






//


context.html(


context.html().replace('/'+phrase+'/gi', replacement);


);
});



 




Partial Page Refresh Using load()


This excellent technique found at the Mediasoft Blog is way cool and very handy for creating a regularly updating dashboard/widget/etc. It works by using jQuery.load() to perform a AJAX request:

 
$(document).ready(function() {


setInterval(function() {


$("#content").load(location.href+" #content>*","");


}, 5000);


});


Voila! It works – no iframes, meta refreshes or other such nonsense.


Cloning an object in jQuery


Use .clone() method of jQuery to clone any DOM object in JavaScript.


1 // Clone the DIV


2 var cloned = $('#somediv').clone();


Query’s clone() method does not clone a JavaScript object. To clone JavaScript object, use following code.






1 // Shallow copy


2 var newObject = jQuery.extend({}, oldObject);


3


4 // Deep copy


5 var newObject = jQuery.extend(true, {}, oldObject);


Test if something is hidden using jQuery


We use .hide(), .show() methods in jquery to change the visibility of an element. Use following code to check the whether an element is visible or not.


1 if($(element).is(":visible") == "true") {


2 //The element is Visible


3 }


Counting immediate child elements


If you want to count all the DIVs present in the element #foo

01


02


03


04


05


06


07


08


09 //jQuery code to count child elements


10 $("#foo > div").size()


Center an element on the Screen
1 jQuery.fn.center = function () {


2 this.css("position","absolute");


3 this.css("top", ( $(window).height() - this.height() ) / 2+$(window).scrollTop() + "px");


4 this.css("left", ( $(window).width() - this.width() ) / 2+$(window).scrollLeft() + "px");


5 return this;


6 }


7


8 //Use the above function as:


9 $(element).center();


Get mouse cursor x and y axis


This script will display the x and y value – the coordinate of the mouse pointer.


1 $().mousemove(function(e){


2 //display the x and y axis values inside the P element


3 $('p').html("X Axis : " + e.pageX + "
Y Axis " + e.pageY);


4 });


5


6






Detect browser


Although it is better to use CSS conditionnal comments to detect a specific browser and apply some css style, it is a very easy thing to do with JQuery, which can be useful at times.


//A. Target Safari


if( $.browser.safari ) $("#menu li a").css("padding", "1em 1.2em" );






//B. Target anything above IE6


if ($.browser.msie && $.browser.version > 6 ) $("#menu li a").css("padding", "1em 1.8em" );






//C. Target IE6 and below


if ($.browser.msie && $.browser.version <= 6 ) $("#menu li a").css("padding", "1em 1.8em" );






//D. Target Firefox 2 and above


if ($.browser.mozilla && $.browser.version >= "1.8" ) $("#menu li a").css("padding", "1em 1.8em" )






Prevent Cut, Copy and Paste Operations in a TextBox using jQuery


Challenge:


Users should be prevented from doing Cut, Copy and Paste operations in an ASP.NET TextBox.


Solution:


$(‘input’).bind(“cut copy paste”).function(e)


{


e.preventDefault();


alert(“You can’t ” + e.type + “ here.”);


});