Forum Moderators: open
A friend of mine recently helped me out with adding some Javascript to a webpage of mine. The function of this script is to calculate and display a price immediately when different drop down selections are made and numeric values are entered into certain fields. This script is working perfectly fine in IE07 and Firefox. The calcuations work and the total price is displayed appropriately. But in Safari, on two different MACs, nothing is displayed. No error is given on the page either. It is as if the Javascript is not running at all since the validation for each field does not work. My friend said that maybe something is wrong with the original JS that was being used for NavBar (inserted by default from Dreamweaver when the Nav was created i think) and that Safari is ignoring all the JS on the page because of it.
I ran the debug Java console for Safari and was able to get the following information:
"SyntaxError - Parse error" on Line 416
and then several Object errors when selecting any of the form fields such as:
"Object (result of expression calculatePrice) does not allow calls" on lines 127, 141, 159, 175, 191, 198, 205, 212, 219, 226, 233, 241
the webpage in question is located at:
<url removed>
Any help at all would be appreciated as I have been beating my head against the wall trying to figure this out.
Thanks
[edited by: encyclo at 2:19 am (utc) on Mar. 13, 2007]
[edit reason] no URLs please, see TOS [webmasterworld.com] [/edit]
<script type="text/JavaScript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
function MM_nbGroup(event, grpName) { //v6.0
var i,img,nbArr,args=MM_nbGroup.arguments;
if (event == "init" && args.length > 2) {
if ((img = MM_findObj(args[2]))!= null &&!img.MM_init) {
img.MM_init = true; img.MM_up = args[3]; img.MM_dn = img.src;
if ((nbArr = document[grpName]) == null) nbArr = document[grpName] = new Array();
nbArr[nbArr.length] = img;
for (i=4; i < args.length-1; i+=2) if ((img = MM_findObj(args[i]))!= null) {
if (!img.MM_up) img.MM_up = img.src;
img.src = img.MM_dn = args[i+1];
nbArr[nbArr.length] = img;
} }
} else if (event == "over") {
document.MM_nbOver = nbArr = new Array();
for (i=1; i < args.length-1; i+=3) if ((img = MM_findObj(args[i]))!= null) {
if (!img.MM_up) img.MM_up = img.src;
img.src = (img.MM_dn && args[i+2])? args[i+2] : ((args[i+1])? args[i+1] : img.MM_up);
nbArr[nbArr.length] = img;
}
} else if (event == "out" ) {
for (i=0; i < document.MM_nbOver.length; i++) {
img = document.MM_nbOver[i]; img.src = (img.MM_dn)? img.MM_dn : img.MM_up; }
} else if (event == "down") {
nbArr = document[grpName];
if (nbArr)
for (i=0; i < nbArr.length; i++) { img=nbArr[i]; img.src = img.MM_up; img.MM_dn = 0; }
document[grpName] = nbArr = new Array();
for (i=2; i < args.length-1; i+=2) if ((img = MM_findObj(args[i]))!= null) {
if (!img.MM_up) img.MM_up = img.src;
img.src = img.MM_dn = (args[i+1])? args[i+1] : img.MM_up;
nbArr[nbArr.length] = img;
} }
}
function MM_openBrWindow(theURL,winName,features) { //v2.0
window.open(theURL,winName,features);
}
//-->
</script>
<script type='text/javascript'>
<!--
function calculatePrice()
{
//----------------------------------------------------------------------
//form elements
//----------------------------------------------------------------------
var package = document.getElementById("ddlPackage").value;
var genre = document.getElementById("ddlGenre").value;
var plot = document.getElementById("ddlPlot").value;
var coverDesign = document.getElementById("ddlCoverDesign").value;
var digitalPhotos = document.getElementById("txtDigitalPhotos").value;
var hardCopyPhotos = document.getElementById("txtHardCopyPhotos").value;
var songs= document.getElementById("txtSongs").value;
var captions= document.getElementById("txtCaptions").value;
var transitions = document.getElementById("txtTransitions").value;
var digitalVideoClips= document.getElementById("txtDigitalVideoClips").value;
var vhsTransfers= document.getElementById("txtVHSTransfers").value;
var dvds = document.getElementById("txtDVDs").value;
//----------------------------------------------------------------------
//price elements
//----------------------------------------------------------------------
var packagePrice= 0;
var digitalPhotosPrice = 0;
var hardCopyPhotosPrice = 0;
var songsPrice= 0;
var captionsPrice= 0;
var transitionsPrice = 0;
var digitalVideoClipsPrice= 0;
var vhsTransfersPrice= 0;
var dvdsPrice = 0;
var totalQuotePrice= 0;
//----------------------------------------------------------------------
//test each field that for valid numeric values
//----------------------------------------------------------------------
var validCharacters = "0123456789";//valid numeric characters
var itemCount;//quantity of items entered into text box
var currentCharacter;//current character of items entered into text box
var result;//indicator if character in text box is valid
//----------------------------------------------------------------------
//traverse though each text box field and determine if all characters are valid
for (counter = 0; counter <= 7; counter++)
{
//----------------------------------------------------------------------
//determine counter and obtain value from appropriate text box
switch (counter)
{
case 0:{ itemCount = digitalPhotos;break; }
case 1: { itemCount = hardCopyPhotos; break; }
case 2: { itemCount = songs; break; }
case 3: { itemCount = captions; break; }
case 4: { itemCount = transitions; break; }
case 5: { itemCount = digitalVideoClips;break; }
case 6: { itemCount = vhsTransfers; break; }
case 7: { itemCount = dvds; break; }
}
//----------------------------------------------------------------------
//check each character of item selected
for (characterIndex = 0; characterIndex < itemCount.length; characterIndex++)
{
//----------------------------------------------------------------------
//obtain current character
currentCharacter = itemCount.charAt(characterIndex);
//----------------------------------------------------------------------
//validate the character
if (validCharacters.indexOf(currentCharacter) == -1)
{
//----------------------------------------------------------------------
//if an invalid character is found, alert customer and reset the field
//----------------------------------------------------------------------
switch (counter)
{
case 0:{ document.getElementById("txtDigitalPhotos").value = "";break; }
case 1: { document.getElementById("txtHardCopyPhotos").value = ""; break; }
case 2: { document.getElementById("txtSongs").value = ""; break; }
case 3: { document.getElementById("txtCaptions").value = ""; break; }
case 4: { document.getElementById("txtTransitions").value = ""; break; }
case 5: { document.getElementById("txtDigitalVideoClips").value = "";break; }
case 6: { document.getElementById("txtVHSTransfers").value = ""; break; }
case 7: { document.getElementById("txtDVDs").value = ""; break; }
}
alert ( "The value just entered was not numeric and has been reset." );
return;
//----------------------------------------------------------------------
}
//----------------------------------------------------------------------
}
//----------------------------------------------------------------------
}
//----------------------------------------------------------------------
//----------------------------------------------------------------------
//calculate package price
//----------------------------------------------------------------------
switch (package)
{
case "0": { packagePrice = 0; break; }
case "Bronze": { packagePrice = 149.99; break; }
case "Silver": { packagePrice = 299.99; break; }
case "Gold": { packagePrice = 399.99; break; }
case "Platinum":{ packagePrice = 599.99; break; }
case "Holiday": { packagePrice = 39.99; break; }
default: { packagePrice = 0; break; }
}
//----------------------------------------------------------------------
//calculate options price
//----------------------------------------------------------------------
digitalPhotosPrice = digitalPhotos * 3;
hardCopyPhotosPrice = hardCopyPhotos * 2;
songsPrice= songs * 3;
captionsPrice= captions * .25;
transitionsPrice = transitions * .5;
digitalVideoClipsPrice= digitalVideoClips * 10;
vhsTransfersPrice= vhsTransfers * 19.99;
//special pricing for dvds by order quantity
if ( dvds <= 10 ) { dvdsPrice = dvds * 6.99;}
if ( dvds > 10 && dvds <= 20 ){ dvdsPrice = dvds * 5.99; }
if ( dvds > 20 ){ dvdsPrice = dvds * 4.99; }
//----------------------------------------------------------------------
//----------------------------------------------------------------------
//calculate and display total quote price
//----------------------------------------------------------------------
//total all pricing elements
totalQuotePrice = packagePrice + digitalPhotosPrice + hardCopyPhotosPrice +
songsPrice + captionsPrice + transitionsPrice +
digitalVideoClipsPrice + vhsTransfersPrice + dvdsPrice;
//round the decimal, this function will not included padded zeros
//totalQuotePrice = Math.round(totalQuotePrice*Math.pow(10,2))/Math.pow(10,2);
totalQuotePrice = formatTotalQuotePrice(totalQuotePrice, 2);
//display the price
document.getElementById("txtTotalQuote").value = totalQuotePrice;
//----------------------------------------------------------------------
}
function formatTotalQuotePrice(totalQuotePrice, decimalCount)
{
//----------------------------------------------------------------------
//format the total quote
//----------------------------------------------------------------------
var price1 = totalQuotePrice * Math.pow(10, decimalCount);
var price2 = Math.round(price1);
var price3 = price2 / Math.pow(10, decimalCount);
return padPriceWithZeros(price3, decimalCount);
//----------------------------------------------------------------------
}
function padPriceWithZeros(price, decimalCount) {
//----------------------------------------------------------------------
//convert price to string and determine decimal point location
//----------------------------------------------------------------------
var priceString = price.toString();
var deciamlPointLocation = priceString.indexOf(".");
var currentDecimalLength;
var padding;
//----------------------------------------------------------------------
//determine how to pad the decimal
//----------------------------------------------------------------------
if (deciamlPointLocation == -1)
{
//if a decimal is not found
currentDecimalLength = 0;
priceString += decimalCount > 0? "." : "";
}
else
{
//if a decimal is found
currentDecimalLength = priceString.length - deciamlPointLocation - 1;
}
//----------------------------------------------------------------------
//----------------------------------------------------------------------
//determine the number of decimal places to pad
//----------------------------------------------------------------------
var padding = decimalCount - currentDecimalLength;
//----------------------------------------------------------------------
//if the padding is required, pad the price
if (padding > 0)
{
for (var counter = 1; counter <= padding; counter++)
{ priceString += "0"; }
}
//----------------------------------------------------------------------
//----------------------------------------------------------------------
//return the formatted price
//----------------------------------------------------------------------
return priceString;
//----------------------------------------------------------------------
}
function validateOrder()
{
//----------------------------------------------------------------------
//error message variant
//----------------------------------------------------------------------
var errorMessage = "";
//----------------------------------------------------------------------
//required fields to submit the order
//----------------------------------------------------------------------
if ( document.getElementById("ddlPackage").selectedIndex == "0" )
{ errorMessage += "Please choose a Base Package to submit the order." + "\n"; }
//----------------------------------------------------------------------
if ( document.getElementById("ddlGenre").selectedIndex == "0" )
{ errorMessage += "Please choose an Event to submit the order." + "\n"; }
//----------------------------------------------------------------------
if ( document.getElementById("ddlPlot").selectedIndex == "0" )
{ errorMessage += "Please choose a Theme to submit the order." + "\n"; }
//----------------------------------------------------------------------
if ( document.getElementById("ddlCoverDesign").selectedIndex == "0" )
{ errorMessage += "Please choose a Cover to submit the order." + "\n"; }
//----------------------------------------------------------------------
if ( document.getElementById("txtName").value == "" )
{ errorMessage += "Please enter your Name to submit the order." + "\n"; }
//----------------------------------------------------------------------
if ( document.getElementById("txtTotalQuote").value == "0" )
{ errorMessage += "Your total quote is $0. Please select a Package and any additional items to complete your order." + "\n"; }
//----------------------------------------------------------------------
if ( document.getElementById("txtPhoneNumber").value == "" )
{ errorMessage += "Please enter your 10 digit Phone Number to submit the order." + "\n"; }
//----------------------------------------------------------------------
if ( document.getElementById("txtEmailAddress").value == "" )
{ errorMessage += "Please enter your Email Address to submit the order." + "\n"; }
//----------------------------------------------------------------------
if ( document.getElementById("chkTermsOfService").checked == false )
{ errorMessage += "You must agree to DVD Flashbacks Terms of Service to submit the order." + "\n"; }
//----------------------------------------------------------------------
//----------------------------------------------------------------------
//display error alert if any errors were found
//----------------------------------------------------------------------
if ( errorMessage!= "" )
{ alert ( errorMessage ); }
//----------------------------------------------------------------------
//Go to the first error found on order form
//----------------------------------------------------------------------
if ( document.getElementById("ddlPackage").selectedIndex == "0" )
{
document.getElementById("ddlPackage").focus();
return false;
}
//----------------------------------------------------------------------
if ( document.getElementById("ddlGenre").selectedIndex == "0" )
{
document.getElementById("ddlGenre").focus();
return false;
}
//----------------------------------------------------------------------
if ( document.getElementById("ddlPlot").selectedIndex == "0" )
{
document.getElementById("ddlPlot").focus();
return false;
}
//----------------------------------------------------------------------
if ( document.getElementById("ddlCoverDesign").selectedIndex == "0" )
{
document.getElementById("ddlCoverDesign").focus();
return false;
}
//----------------------------------------------------------------------
if ( document.getElementById("txtName").value == "" )
{
document.getElementById("txtName").focus();
return false;
}
//----------------------------------------------------------------------
if ( document.getElementById("txtPhoneNumber").value == "" )
{
document.getElementById("txtPhoneNumber").focus();
return false;
}
//----------------------------------------------------------------------
if ( document.getElementById("txtEmailAddress").value == "" )
{
document.getElementById("txtEmailAddress").focus();
return false;
}
//----------------------------------------------------------------------
if ( document.getElementById("chkTermsOfService").checked == false )
{
document.getElementById("chkTermsOfService").focus();
return false;
}
//----------------------------------------------------------------------
}
//-->
</script>
Okay here is what I would do: create a test page with all the HTML and JUST the calculation javascript. Remove all the MM_stuff which will disable the mouseovers, etc. for now.
I would also remove all the validation code temporarily, this is to break this down into simpler parts to isolate the problem.
Add a bunch of alerts at various points to see if you're getting expected values.
alert('pkg ' + package + ' genre ' + genre + ' plot ' + plot);
Like so.
One by one eliminate all extraneous stuff until you have it broken down into sizable portions, this will help you isolate exactly where the problem occurs.
At first glance,
Object (result of expression calculatePrice) does not allow calls
It seems like it's interpreting calculatePrice as an object, which it is, but it's a function object (right?) So somewhere along the line it may be interpreting it as a document object . . .or something.
Sorry this code is a bit too bloated for an immediate answer, this is what I would do, break it down.
