programming4us
 
 
 
Programming

jQuery 1.3 : Working with numeric form data (part 9) - The finished code

- How To Install Windows Server 2012 On VirtualBox
- How To Bypass Torrent Connection Blocking By Your ISP
- How To Install Actual Facebook App On Kindle Fire
12/19/2010 4:12:20 PM

The finished code

Taken together, the code for the shopping cart page is a mere 80 lines—quite small considering the functionality it accomplishes, but especially so when we take into account the breezy style that the code has acquired for optimum readability. Many of the lines in jQuery could have been merged, were we particularly concerned with number of lines, because of jQuery's chainability. At any rate, here is the finished code for the shopping cart page, which concludes this chapter on forms:

$(document).ready(function() {
var stripe = function() {
$('#cart tbody tr').removeClass('alt')
.filter(':visible:odd').addClass('alt');
};
stripe();
$('#recalculate').hide();
$('.quantity input').keypress(function(event) {
if (event.which && (event.which < 48 ||
event.which > 57)) {
event.preventDefault();
}
}).change(function() {
var totalQuantity = 0;
var totalCost = 0;
$('#cart tbody tr').each(function() {
var price = parseFloat($('.price', this)
.text().replace(/^[^\d.]*/, ''));
price = isNaN(price) ? 0 : price;
var quantity =
parseInt($('.quantity input', this).val(), 10);
var cost = quantity * price;
$('.cost', this).text('$' + cost.toFixed(2));
totalQuantity += quantity;
totalCost += cost;
});
$('.subtotal .cost').text('$' + totalCost.toFixed(2));
var taxRate = parseFloat($('.tax .price').text()) / 100;
var tax = Math.ceil(totalCost * taxRate * 100) / 100;
$('.tax .cost').text('$' + tax.toFixed(2));
totalCost += tax;
$('.shipping .quantity').text(String(totalQuantity));
var shippingRate = parseFloat($('.shipping .price')
.text().replace(/^[^\d.]*/, ''));
var shipping = totalQuantity * shippingRate;
$('.shipping .cost').text('$' + shipping.toFixed(2));
totalCost += shipping;
$('.total .cost').text('$' + totalCost.toFixed(2));
});
$('<th>&nbsp;</th>')
.insertAfter('#cart thead th:nth-child(2)');
$('#cart tbody tr').each(function() {
$deleteButton = $('<img />').attr({
'width': '16',
'height': '16',
numeric form data, working withshopping cart page code'src': '../images/cross.png',
'alt': 'remove from cart',
'title': 'remove from cart',
'class': 'clickable'
}).click(function() {
$(this).parents('tr').find('td.quantity input')
.val(0).trigger('change')
.end().hide();
stripe();
});
$('<td></td>')
.insertAfter($('td:nth-child(2)', this))
.append($deleteButton);
});
$('<td>&nbsp;</td>')
.insertAfter('#cart tfoot td:nth-child(2)');
});
$(document).ready(function() {
var editShipping = function() {
$.get('shipping.php', function(data) {
$('#shipping-name').remove();
$(data).hide().appendTo('#shipping').slideDown();
$('#shipping form').submit(saveShipping);
});
return false;
};
var saveShipping = function() {
var postData = $(this).serialize();
$.post('shipping.php', postData, function(data) {
$('#shipping form').remove();
$(data).appendTo('#shipping');
$('#shipping-name').click(editShipping);
});
return false;
};
$('#shipping-name').click(editShipping);
});


Other -----------------
- The Art of SEO : Controlling Content with Cookies and Session IDs
- iPad SDK : New Graphics Functionality - We Are All Tool Users (part 5) - The Freehand Tool
- iPad SDK : New Graphics Functionality - We Are All Tool Users (part 4) - The Ellipse and Rectangle Tools
- iPad SDK : New Graphics Functionality - We Are All Tool Users (part 3) - The Line Tool
- iPad SDK : New Graphics Functionality - We Are All Tool Users (part 2) - The Pencil Tool
- iPad SDK : New Graphics Functionality - We Are All Tool Users (part 1)
- Security-As-a-[Cloud] Service : Today’s Offerings
- CSS for Mobile Browsers : CSS Sprites
- CSS for Mobile Browsers : Common Patterns (part 4)
- CSS for Mobile Browsers : Common Patterns (part 3) - Titles and Pseudoclasses
- CSS for Mobile Browsers : Common Patterns (part 2) - Rounded corners
- CSS for Mobile Browsers : Common Patterns (part 1) - Absolute and floating positions
- iPad SDK : New Graphics Functionality - The Basic Drawing Architecture
- jQuery 1.3 : Compact forms (part 6)
- jQuery 1.3 : Compact forms (part 5)
- jQuery 1.3 : Compact forms (part 4)
- jQuery 1.3 : Compact forms (part 3)
- jQuery 1.3 : Compact forms (part 2) - AJAX auto-completion
- jQuery 1.3 : Compact forms (part 1) - Placeholder text for fields
- The Art of SEO : Duplicate Content Issues (part 3)
 
 
 
Top 10
 
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Finding containers and lists in Visio (part 2) - Wireframes,Legends
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Finding containers and lists in Visio (part 1) - Swimlanes
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Formatting and sizing lists
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Adding shapes to lists
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Sizing containers
- Microsoft Access 2010 : Control Properties and Why to Use Them (part 3) - The Other Properties of a Control
- Microsoft Access 2010 : Control Properties and Why to Use Them (part 2) - The Data Properties of a Control
- Microsoft Access 2010 : Control Properties and Why to Use Them (part 1) - The Format Properties of a Control
- Microsoft Access 2010 : Form Properties and Why Should You Use Them - Working with the Properties Window
- Microsoft Visio 2013 : Using the Organization Chart Wizard with new data
- First look: Apple Watch

- 3 Tips for Maintaining Your Cell Phone Battery (part 1)

- 3 Tips for Maintaining Your Cell Phone Battery (part 2)
programming4us programming4us
 
Popular tags
 
Video Tutorail Microsoft Access Microsoft Excel Microsoft OneNote Microsoft PowerPoint Microsoft Project Microsoft Visio Microsoft Word Active Directory Biztalk Exchange Server Microsoft LynC Server Microsoft Dynamic Sharepoint Sql Server Windows Server 2008 Windows Server 2012 Windows 7 Windows 8 Adobe Indesign Adobe Flash Professional Dreamweaver Adobe Illustrator Adobe After Effects Adobe Photoshop Adobe Fireworks Adobe Flash Catalyst Corel Painter X CorelDRAW X5 CorelDraw 10 QuarkXPress 8 windows Phone 7 windows Phone 8 BlackBerry Android Ipad Iphone iOS