JavaScript - Javascript Error In Firefox -- Quote Marks Misread?

Hi Coders,

I have a javascript function which lets a user to choose one of the 7 option buttons on a "mainsub.asp" page and the page will then be forwarded to one of the 7 process pages depending on what has been chosen.

The problem is that firefox is angry with the first line ("if" statement) and tells the following in its error console:

Error: document.forms[0].C1 is not a function
Source File: [localhost...]
Line: 117

Here is the code:

function fSubmit(){
if (document.forms[0].C1(0).checked) document.forms[0].action="process.asp";
else if (document.forms[0].C1(1).checked) document.forms[0].action="process1.asp";
else if (document.forms[0].C1(2).checked) document.forms[0].action="process2.asp";
else if (document.forms[0].C1(3).checked) document.forms[0].action="process3.asp";
else if (document.forms[0].C1(4).checked) document.forms[0].action="process4.asp";
else if (document.forms[0].C1(5).checked) document.forms[0].action="process5.asp";
else if (document.forms[0].C1(6).checked) document.forms[0].action="process6.asp";
else document.forms[0].action="process.asp";
return;
}

Internet explorer does not complain about anything and does its job great.
But I could not figure out how to change the code to be also compliant with Firefox?

Thanks for all the comments.

Please help, I'm getting this error, Object expected, Code: 0 in Internet Explorer (not in Firefox, though). Here is the link to the page:

http://www.uatparts.com/miva/merchan...Category_Code=

I'm worried that my customers might shy away and not buy from me when they see this error. What do I need to do in order to stop this error from appearing? Note: I tried including the code in this thread but it was too long, the forum wouldn't let me.

Hi,
I've written a small script for a website, and strangely enough (or maybe not) it works in Firefox and Chrome but not IE.
I'd read about block level inside inline causing this but i'm still not entirely sure. Here is the offending script:

Code:

function changeImage(image) {
 if (image == 6) {
  var vid = document.createElement('object');
  vid.width = "700";
  vid.height = "370";
  vid.id = "photo";
  vid.innerHTML = '<param name="movie" value="http://www.youtube-nocookie.com/v/g4cpDgGlFng&hl=en_US&fs=1&rel=0"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube-nocookie.com/v/g4cpDgGlFng&hl=en_US&fs=1&rel=0" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="700" height="370"></embed>';
  document.getElementById("body").replaceChild(vid, document.getElementById("photo"));
 } else {
  var img = document.createElement('img');
  var old = document.getElementById("photo")
  img.width = "700";
  img.height = "370";
  img.id = "photo";
  img.alt = "Photo of Gippsland Lakehous";
  img.src = "images/photos/" + image + ".jpg";
  document.getElementById("body").replaceChild(img, old);
 }

The offending line is the long innerHTML one. I'm sure this must be a very hacky way of doing things (incidentally the thing is replacing an image with another image or video depending on what is clicked), but I rarely code at all, so don't know any better

Thanks!

FireFox is throwing a DOM security error. And i don't really know why. i've used toDataURL() before, and it's never done this.
Hopefully i can get this little app fixed, so that i can use it on my TabletPC for taking notes in class.

The line of code that is throwing this error is:

Code:

var Note = document.getElementById("SketchPage").toDataURL();

here's the full error from the Error Console:

Error: uncaught exception: [Exception... "Security error" code: "1000" nsresult: "0x805303e8 (NS_ERROR_DOM_SECURITY_ERR)" location: "file:///C:/SketchBook-Dev/SketchBook.js Line: 236"]



here is the JS file:

Code:

var PenSize = "3";
var PenShape = "Circle";
var PenColor = "Black";
var LoadFile = "";
var UIstatus = "visible";
var CurrentNote = 0;
var BGcolor = "#C7C1A3";
var DataPath = "\Data\\";
var ImageExtension = ".img";
var FileList = [];
var SystemPath;
var UIstatus = "visible";
var Server = "localhost";
var NxtNote = new Image();

document.onkeyup = ToggleUI;

function Init()
{
 // Get the System Path
 GetSystemPath("SketchBook.html");
 
 // Load All Filenames of the DataPath directory into an array
 GetFileList(SystemPath + DataPath, FileList);
 
 //Load the first Note onto the canvas
   // if there are no notes in the directory, don't try to load anything
   if(FileList.length > 0)
      {
	   var Source = LoadFromDisk(FileList[CurrentNote]);
	   NxtNote.src = Source;
	   
	   // Load the image data onto the canvas
       var canvas = document.getElementById('SketchPage').getContext('2d');
       canvas.drawImage(NxtNote , 0, 0);
	  }
}

function HideOptions()
{
 document.getElementById("Options").style.visibility = "hidden";
}

function ToggleUI(e)
{
 var KeyID = (window.event) ? event.keyCode : e.keyCode;
 
 var KeyValue = 18;
 
 // Use a key to hide the toolbars so that most of the screen is used for the UI
 if(KeyID == KeyValue)
   {
    if(UIstatus == "visible")
	  {
	   UIstatus = "hidden";
	   document.getElementById("UI").style.visibility = "hidden";
	   return;
	  }
	if(UIstatus == "hidden")
	  {
	   UIstatus = "visible";
	   document.getElementById("UI").style.visibility = "visible";
	  }
   }
 
}

function ShowOptions()
{
 document.getElementById("Options").style.visibility = "visible";
}

function UpdatePenSize()
{
 PenSize = document.getElementById('GetPenSize').value;
}

function UpdatePenShape()
{
 PenShape = document.getElementById('GetPenShape').value;
}

function UpdatePenColor()
{
 PenColor = document.getElementById('GetPenColor').value;
}
	  
function Draw(element, event) 
{
  document.addEventListener("mousemove", PenHandler, true);
  document.addEventListener("mouseup", upHandler, true);

  event.stopPropagation();
  event.preventDefault();
	
  function PenHandler(event) 
  {
  
    var x = event.clientX;
	var y = event.clientY;
    
    // mouse event goes here
	var canvas = document.getElementById("SketchPage");
    var ctx = canvas.getContext("2d");

	if (PenShape ="Circle")
	   {
	    // This draws a circle
        ctx.fillStyle = PenColor;
        ctx.beginPath();
        ctx.arc(x, y, PenSize, 0, Math.PI*2, true);
        ctx.closePath();
        ctx.fill();
	   }
	 
    event.stopPropagation();
  }

  function upHandler(event) 
  {
    document.removeEventListener("mouseup", upHandler, true);     
    document.removeEventListener("mousemove", PenHandler, true);
    event.stopPropagation();
  }

}

function SaveNote()
{
 // Get the current file name
 var FileName = SystemPath + DataPath + CurrentNote + ImageExtension;

 // Convert the Canvas Data into a Base64 encoded PNG image
 var Note = document.getElementById("SketchPage").toDataURL();
 
 // Write the PNG file to the disk
 SaveToDisk(FileName, Note);
}

function NextNote(Direction)
{
 if(Direction == "up")
    {
	 // Display the previoius note
	 CurrentNote--;
	    // Make sure you don't incrimnet to a non-existant note
		if(CurrentNote <= 0)
		  {
		   CurrentNote = FileList.length;
		  }
		  
	  var Source = LoadFromDisk(FileList[CurrentNote]);
	  NxtNote.src = Source;
	 
	 // Load the image data onto the canvas
	 
	 // Clear the Pre-existing Canvas Data First
	  ClearSketch();
	  
	 var canvas = document.getElementById('SketchPage').getContext('2d');
     canvas.drawImage(NxtNote, 0, 0);
	 return;
	}
	
 if(Direction == "down")
    {
	 //Display the Next note
	 CurrentNote++;
	 	// Make sure you don't incrimnet to a non-existant note
		if(CurrentNote > FileList.length)
		  {
		   CurrentNote = 0;
		  }
	 var Source = LoadFromDisk(FileList[CurrentNote]);
	 NxtNote.src = Source;
	 
	 // Load the image data onto the canvas
	 
	 // Clear the Pre-existing Canvas Data First
	 ClearSketch();
	 var canvas = document.getElementById('SketchPage').getContext('2d');

     canvas.drawImage(NxtNote, 0, 0);
	 return;
	}
}

function DeleteNote()
{
 // Delete The current note
 DeleteFile(SystemPath + DataPath + FileList[CurrentNote]);
 
 // Reload the Directory List
    // Clear the FileList Array
	FileList = [];

  GetFileList(SystemPath + DataPath, FileList);

 // Load The Previous Note
 
 	 // Display the previoius note
	 CurrentNote--;
	    // Make sure you don't incrimnet to a non-existant note
		if(CurrentNote <= 0)
		  {
		   CurrentNote = FileList.length;
		  }
		  
	 var Source = LoadFromDisk(FileList[CurrentNote]);
	 NxtNote.src = Source;
	 	 
	 // Load the image data onto the canvas
	 var canvas = document.getElementById("SketchPage");
     var context = canvas.getContext("2d");
     canvas.drawImage(NxtNote, 0, 0);
	 return;
 
}

function AddNote()
{
 // Add a note to the notebook and at the end of the File List
 // **** Later this function should be modified to be an INSERT function rather than just an add
 // Just incase the user needs to go back an edit and add more things to their notebook
 
 CurrentNote++;
 
 // Add the new Note File name to the end of the FileList Array
 FileList.push(CurrentNote + ImageExtension);
 
 // Clear the Canvas
 ClearSketch();
 // Write a blank image file to the Data directory so that we have the actual file there
 
 var FileName = SystemPath + DataPath + CurrentNote + ImageExtension;
 var Note = document.getElementById("SketchPage").toDataURL();
}

function ClearSketch()
{
 // Clear the contents of the Canvas
 
 //Draw a rectangle that covers the canvas
 var canvas = document.getElementById("SketchPage");
 var ctx = canvas.getContext("2d");

 ctx.fillStyle = BGcolor;
 ctx.fillRect (0, 0, canvas.width, canvas.height);
}

function Crypt(method)
{
 // This function will Encrypt or Decrypt All the NoteData
 if(method == "encrypt")
   {
    
    return;
   }
 
 if(method == "decrypt")
   {
    
    return;
   }
}

function Archive(method)
{
 // This function will Restore or Backup all NoteData to a network resource
 if(method == "restore")
   {
    
    return;
   }
 
 if(method == "backup")
   {
    
    return;
   }
}
// ******************** These are the XPCOM Functions ************************

function GetSystemPath(ApplicationName)
{
 // This function should Detect the system directory of the app
 // and return that string as the  SystemPath variable
 // You must supply the filename of the HTML file that it is being called from
 // I suppose later i could add the code to detect the HTML's actual file name
 // It's on the ToDo List...
 
 var GetSysPath = self.location;
 GetSysPath = GetSysPath + "";
 Get = GetSysPath.replace("file:///" , "");
 Get = Get.replace(/\//g , "\\");
 Get = Get.replace(ApplicationName, "");
 SystemPath = Get;
 return SystemPath;
}

function DeleteFile(FileName)
{
 // Delete a local file
 netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
 var aFile = Components.classes["@mozilla.org/file/local;1"].createInstance();
 if (aFile instanceof Components.interfaces.nsILocalFile)
    {
     aFile.initWithPath(FileName);
     aFile.remove(false);
    }
}

function GetFileList(Directory, FileList)
{
netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
var _nsILocalFile = Components.classes["@mozilla.org/file/local;1"]
      .createInstance(Components.interfaces.nsILocalFile);
// initialize path to work with
_nsILocalFile.initWithPath(Directory);
 
// get file interface implemenation
// this means that an XPCOM Class can implement multiple interface
var lv_oFile = _nsILocalFile.QueryInterface(Components.interfaces.nsIFile);
var lv_oEntries = lv_oFile.directoryEntries;
 
while(lv_oEntries.hasMoreElements())
{
   var lv_cFile = lv_oEntries.getNext()
     .QueryInterface(Components.interfaces.nsIFile).path;
   FileList.push(lv_cFile);
}
}

function SaveToDisk(filepath, content) {
	try {
		netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
	} catch (e) {
		alert("Permission to save file was denied.");
	}
	var file = Components.classes["@mozilla.org/file/local;1"]
		.createInstance(Components.interfaces.nsILocalFile);
	file.initWithPath( filepath );
	if ( file.exists() == false ) {
		file.create( Components.interfaces.nsIFile.NORMAL_FILE_TYPE, 420 );
	}
	var outputStream = Components.classes["@mozilla.org/network/file-output-stream;1"]
		.createInstance( Components.interfaces.nsIFileOutputStream );

	outputStream.init( file, 0x04 | 0x08 | 0x20, 420, 0 );
	var output = content;
	var result = outputStream.write( output, output.length );
	outputStream.close();
}

function LoadFromDisk(filePath)
{
 if(window.Components)
   try
   {
    netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
    var file = Components.classes["@mozilla.org/file/local;1"].createInstance(Components.interfaces.nsILocalFile);
    file.initWithPath(filePath);
    if (!file.exists())
    return(null);
    var inputStream = Components.classes["@mozilla.org/network/file-input-stream;1"].createInstance(Components.interfaces.nsIFileInputStream);
    inputStream.init(file, 0x01, 00004, null);
    var sInputStream = Components.classes["@mozilla.org/scriptableinputstream;1"].createInstance(Components.interfaces.nsIScriptableInputStream);
    sInputStream.init(inputStream);
    return(sInputStream.read(sInputStream.available()));
   }
   catch(e)
   {
    //alert("Exception while attempting to load\n\n" + e);
    return(false);
   }
return(null);
}

and the HTML UI code:

Code:

<html><head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>Sketch Book v1.0</title>

<script src="SketchBook.js" type="text/javascript"></script>
<script src="JSxpcom.js" language="text/javascript"></script>




</head>
<body onLoad="Init();">
<div id="SketchPageView">
<canvas id="SketchPage" width="480" height="640" style="background: #C7C1A3; position: absolute; top: 0px; left: 0px;" onmousedown="Draw(this, event);"></canvas>
</div>

<div id="Options" style="position: absolute; visibility: hidden; top: 100px; left: 50px;">

<table cellwidth="100" border="0" cellpadding="0" cellspacing="0" height="50">
<tbody><tr><td><img src="./Image/TL-black.PNG" height="19" width="19"></td><td bgcolor="#bce0f8"><center><b>Options</b></center><img src="./Image/delete.png" style="position:absolute; top: 2px; left: 150px; height: 18; width: 18;" onClick="HideOptions();"></td><td><img src="./Image/TR-black.PNG" height="19" width="19"></td></tr>
<tr><td bgcolor="#bce0f8"></td>

<td bgcolor="#bce0f8">

<div style="border: 1px solid black;">
<table>
<tbody><tr>
<td><center>Pen Size</center></td><td><center>Color</center></td>
</tr>
<tr>
<td>
<select id="GetPenSize" onchange="UpdatePenSize();">
  <option value="1">1 px</option>
  <option value="2">2 px</option>
  <option value="3">3 px</option>
  <option value="4">4 px</option>
  <option value="5">5 px</option>
</select>
</td>
<td>
<select id="GetPenColor" onchange="UpdatePenColor();">
  <option value="Black">Black</option>
  <option value="White">White</option>
  <option value="Red">Red</option>
  <option value="Blue">Blue</option>
  <option value="Green">Green</option>
  <option value="Brown">Brown</option>
</select>
</td>
</tr>
<tr>
<td><input value="Restore" onclick="RestoreData();" type="button"></td><td><input value="Backup" onclick="BackupData();" type="button"></td>
</tr>
<tr>
<td><input value="Encrypt" onclick="EncryptData();" type="button"></td><td><input value="DeCrypt" onclick="DecryptData();" type="button"></td>
</tr>
</tbody></table>
</div>
</td>
<td bgcolor="#bce0f8"></td></tr>
<tr><td><img src="./Image/BL-black.PNG" height="19" width="19"></td> <td bgcolor="#bce0f8"></td><td align="right"><img src="./Image/BR-black.PNG" height="19" width="19"></td></tr>
</tbody></table>
</div>
<table id="UI" style="position: absolute; top: 0px; left: 412px; visibility: visible;" border="0" cellpadding="0" cellspacing="0" width="40">
<tbody><tr><td><img src="./Image/TL-black.PNG" height="19" width="19"></td><td bgcolor="#bce0f8"></td><td><img src="./Image/TR-black.PNG" height="19" width="19"></td></tr>
<tr><td bgcolor="#bce0f8"></td>
<td bgcolor="#bce0f8" height="600">
<img src="./Image/up.png" style="width: 30px; height: 30px;" alt="up" onclick="NextNote('up');"><br><br><br><br>
<img src="./Image/plus.png" style="width: 30px; height: 30px;" alt="add" onclick="AddNote();"><br><br><br><br>
<img src="./Image/save.png" style="width: 30px; height: 30px;" alt="save" onclick="SaveNote();"><br><br><br><br>
<img src="./Image/clear.png" style="width: 30px; height: 30px;" alt="clear" onclick="ClearSketch();"><br><br><br><br>
<img src="./Image/delete.png" style="width: 30px; height: 30px;" alt="delete" onclick="DeleteNote();"><br><br><br><br>
<img src="./Image/gear.png" style="width: 30px; height: 30px;" alt="options" onclick="ShowOptions();"><br><br>
<img src="./Image/down.png" style="width: 30px; height: 30px;" alt="down" onclick="NextNote('down');">
</td>
<td bgcolor="#bce0f8"></td>       </tr>
<tr><td><img src="./Image/BL-black.PNG" height="19" width="19"></td> <td bgcolor="#bce0f8"></td>   <td align="right"><img src="./Image/BR-black.PNG" height="19" width="19"></td></tr>
</tbody></table>
</body></html>

Hi all again,

Firstly thanks to Philip M for getting me this far but i still have a few quirks that i'd like to get around.

Its a price generator with 3 options. User selects an option from a drop down, inputs "number of words" and hey-presto the price appears.

That works superbly well but what would be really cool is if after someone gets a price they then would like to select a different option in order to see a new price. At the moment it means selecting another option and re-entering the number of words and then clicking in the price box to get the new result.

Is there anyway to make that price change automatically (as if by magic even) if either the "option" or "number of words" is changed

I have a sneaky suspicion that Philip M will come to the rescue again but should anyone else have a view that would be great also.

Thanks as always in advance, Phil

Code:

<head>
<!--quote generator -->
<script type="text/javascript">
function update(){
var price = document.getElementById("Package").value;
var words = document.getElementById("words").value;
var wordsOver2000 = words-2000;
if (wordsOver2000 <0) {wordsOver2000 = 0}
words = words - wordsOver2000;
var Tprice = ((price * words) + (price * .80 * wordsOver2000)).toFixed(2) ;document.getElementById("Totprice").value = Tprice;
document.getElementById("Totprice2").innerHTML = "Your Quote Total Is: MYR" + Tprice
}
</script>
<!--end quote generator -->
</head>

Code:

<body>
<!--quote generator -->
<div align="center" class="generator">
  PACKAGE - <select name="Package" id = "Package">
    <option value="0.027">Economy</option>
    <option value="0.038">Standard</option>
    <option value="0.049">Express</option>
  </select>
  No. of Words -  
  <input type="text" id="words" onchange="update()" value="" />
  ---&gt; MYR 
  <input type = "text" id = "Totprice" value="...then click here" /><br />
<br /><strong>(NB - To see a quote for a different package, please select package and re-enter the number of words)</strong>
</div>
<!--end quote generator -->
</body>

Hi All,

I need a code for my online blind shop so that customers can get a quote without having to go through the order process. They would need to enter their fabric range, style and width and drop. My first obsticle is where to start learning how to do it! Could anyone please point me in the direction of a good but easy to understand tutorial or advise me on how I can achieve my goal? I've looked all over the internet but cant find what I am looking for. I'm willing to learn and do this myself, otherwise I'll have to pay for someone else to do it for me.

Any help would be great!

Thanks,

Deb.

Hi all. I hope that everyone is fine and doing well.

This is something of an annual visit for me. You guys helped me enormously with the code below. It is a price quote generator that takes a number (entered by the client) and depending on the package selected, produces a price quote.

As I said, it works really well, but it's time for me to expand my business overseas.

At the moment, I display the price as a single currency, but I would like for clients to be able to select (maybe from a drop down list in the answer field) any one of 4 different currencies (i.e., GBP, USD, EURO, MYR). The different exchange rates don't need to be up to the minute accurate. I'm quite happy to go in to the code and update them weekly or as required.

I have attempted to research different ways of doing this, but as my needs are quite unusual and my brain really can't wrap around the ins and outs of java script, i'm here again begging with my cap in hand for help.

To see this code in action as it stands, please go to www.grammarproofing.com

Code:

<head>
<!--quote generator -->
<script type="text/javascript">
function update(){
var price = document.getElementById("Package").value;
var words = document.getElementById("words").value;
if (words != "") {
words = parseInt(words);
if (isNaN (words)) {
alert ("Please enter the number of words in figures");
document.getElementById("words").value = "";
return false;
}
}
var wordsOver2000 = words-2000;
if (wordsOver2000 <0) {wordsOver2000 = 0}
words = words - wordsOver2000;
var Tprice = ((price * words) + (price * .95 * wordsOver2000)).toFixed(2) ;document.getElementById("Totprice").value = Tprice;
document.getElementById("Totprice2").innerHTML = "Your Quote Total Is: MYR" + Tprice
}
</script>
<!--end quote generator -->
</head>

Code:

<body>
<!--start quote generator -->
<div class="quote" id="quote">
  <select name="Package" id = "Package" onchange = "update()">
    <option value="0.052">STUDENTS THE 11th HOUR PACKAGE</option>
    <option value="0.041">STUDENTS EXPRESS PACKAGE</option>
    <option value="0.035" selected="selected">STUDENTS WORK in PROGRESS PACKAGE</option>
  </select> 
   x   
   <input type="text" id="words" onchange="update()" value="" />
  WORDS<br />
= MYR
<input type = "text" id = "Totprice" readonly />
</div>
<!--end quote generator -->
</body>

Thanks in advance for any help offered.

Regards as always, Phil

I am trying to create a function or have this work some how where it displays the first number when you make your choice in the first drop down box, which is working so far. In the second drop down box, if any of the answers are chosen except for none, it will take off 10% of the first number. Then add or subtract from there. I just have a problem with creating a function to take off that 10%. Here is the javascript:

Code:

/*
This source is shared under the terms of LGPL 3
www.gnu.org/licenses/lgpl.html

You are free to use the code in Commercial or non-commercial projects
*/

 //Set up an associative array
 //The keys represent the size of the cake
 //The values represent the cost of the cake i.e A 10" cake cost's $35
 var practice_field = new Array();
practice_field["None"]=0;
practice_field["Allergy and Immunology"]=4400;
practice_field["Endocrinology"]=4400;
practice_field["Pathology"]=4400;
practice_field["Dermatology"]=4400;
practice_field["Geriatrics"]=4400;
practice_field["Physical Rehabilitation"]=4400;
practice_field["Family Practice"]=6900;
practice_field["General Practice"]=6900;
practice_field["Internal Medicine"]=6900;
practice_field["Oncology"]=6900;
practice_field["Oral Surgery"]=6900;
practice_field["Radiology"]=6900;
practice_field["Gastroenterology"]=6900;
practice_field["Infectious Disease"]=6900;
practice_field["Nephrology"]=6900;
practice_field["Ophthalmology"]=6900;
practice_field["Pediatrics"]=6900;
practice_field["Urology"]=6900;
practice_field["Anesthesiology"]=9000;
practice_field["Cosmetic Surgery"]=9000;
practice_field["General Surgery"]=9000;
practice_field["Neurology"]=9000;
practice_field["Otolaryngology"]=9000;
practice_field["Plastic Surgery"]=9000;
practice_field["Vascular Surgery"]=9000;
practice_field["Cardiology"]=9000;
practice_field["Emergency Medicine"]=9000;
practice_field["Gynecology"]=9000;
practice_field["Orthopedic Surgery"]=9000;
practice_field["Pain Management"]=9000;
practice_field["Pulmonary Surgery"]=9000;
practice_field["Neurological Surgery"]=9900;
practice_field["Obstetrics"]=9900;

 
 //Set up an associative array 
 //The keys represent the filling type
 //The value represents the cost of the filling i.e. Lemon filling is $5,Dobash filling is $9
 //We use this this array when the user selects a filling from the form
 var society_member= new Array();
 society_member["None"]=1;
society_member["BCMA"]=0.10;
society_member["DCMA"]=0.10;
society_member["FOGS"]=0.10;
society_member["FNS"]=0.10;
society_member["PBCMS"]=0.10;
society_member["FSPS"]=0.10;
 
//This function finds the filling price based on the 
//drop down selection
function getPracticeField()
{
    var docPracticeField=0;
    //Get a reference to the form id="cakeform"
    var theForm = document.forms["cakeform"];
    //Get a reference to the select id="filling"
     var selectedPracticeField = theForm.elements["practice"];
     
    //set cakeFilling Price equal to value user chose
    //For example filling_prices["Lemon".value] would be equal to 5
    docPracticeField = practice_field[selectedPracticeField.value];

    //finally we return cakeFillingPrice
    return docPracticeField;
}	 
	 


//This function finds the filling price based on the 
//drop down selection
function getSelectedSociety()
{
    var docSelectedSociety=0;
    //Get a reference to the form id="cakeform"
    var theForm = document.forms["cakeform"];
    //Get a reference to the select id="filling"
     var selectedSociety = theForm.elements["society"];
     
    //set cakeFilling Price equal to value user chose
    //For example filling_prices["Lemon".value] would be equal to 5
    docSelectedSociety = society_member[selectedSociety.value];

    //finally we return cakeFillingPrice
    return docSelectedSociety;
}

//candlesPrice() finds the candles price based on a check box selection
function candlesPrice()
{
    var candlePrice=0;
    //Get a reference to the form id="cakeform"
    var theForm = document.forms["cakeform"];
    //Get a reference to the checkbox id="includecandles"
    var includeCandles = theForm.elements["includecandles"];

    //If they checked the box set candlePrice to 5
    if(includeCandles.checked==true)
    {
        candlePrice=5;
    }
    //finally we return the candlePrice
    return candlePrice;
}

function insciptionPrice()
{
    //This local variable will be used to decide whether or not to charge for the inscription
    //If the user checked the box this value will be 20
    //otherwise it will remain at 0
    var inscriptionPrice=0;
    //Get a refernce to the form id="cakeform"
    var theForm = document.forms["cakeform"];
    //Get a reference to the checkbox id="includeinscription"
    var includeInscription = theForm.elements["includeinscription"];
    //If they checked the box set inscriptionPrice to 20
    if(includeInscription.checked==true){
        inscriptionPrice=20;
    }
    //finally we return the inscriptionPrice
    return inscriptionPrice;
}
        
function calculateTotal()
{
    //Here we get the total price by calling our function
    //Each function returns a number so by calling them we add the values they return together
    var cakePrice = getPracticeField() * getSelectedSociety() + candlesPrice() + insciptionPrice();
    
    //display the result
    var divobj = document.getElementById('totalPrice');
    divobj.style.display='block';
    divobj.innerHTML = "Total Price For the Cake $"+cakePrice;

}

function hideTotal()
{
    var divobj = document.getElementById('totalPrice');
    divobj.style.display='none';
}

Firstly i have to thank Philip M for this code which is great but for what i need, requires a little extra tweaking.

Its a price quote generator (package price x number of pages = price) However if the customer has more pages over a set amount (2000) the package price changes. So the formula becomes (package price x pages (upto 2000) = price + number of pages over 2000 x new package price = Total price. Does that make sense?

So i can do a flat rate with this code but if anyone has suggestions on how to do the rest? I would be eternaly grateful as my head really hurts.

Code:

<head>
<script type="text/javascript">
function update(){
var price = document.getElementById("Package").value;
var pages = document.getElementById("pages").value;
var Tprice = (price * pages).toFixed(2) ;
document.getElementById("Totprice").value = Tprice;
document.getElementById("Totprice2").innerHTML = "Your Order Total Is: $" + Tprice
}
</script>
</head>

<body>
  choose<select name="Package" id = "Package">
    <option value="2">a</option>
    <option value="3">b</option>
    <option value="4">c</option>
  </select>
  No. of PAGES <input type = "text" id = "pages" onChange="update()" ><br>
  QUOTE <input type = "text" id = "Totprice"> <br><br>
  <span id ="Totprice2"></span><br>

</body>

Thanks all

It shouldn't be too hard. I just can't crack it. I haven't moved from my computer in hours

So, my problem...

In a form I have two drop down menus (list of 3 and 7) and two tick boxs.

What I want to do is show an estimated quote based on the selections.

Here is the code I have if it helps. I haven't included the javascript in the header since it doesn't make sense.

Code:

<form method="post" action="">
    <div id="left">
      <p><b>Name:</b><br /><input type="text" name="name" /></p>
      <p><b>Daytime Number:</b><br /><input type="text" name="daytime" /></p>
      <p><b>Address Line 1:</b><br /><input type="text" name="address1" /></p>
      <p><b>City/Town:</b><br /><input type="text" name="citytown" /></p>
      <p><b>Postcode:</b><br /><input type="text" name="postcode" /></p>
	  <p><b>Cake Type:</b><br /><select id="caketype">
        <option value="0">Fruit cake +&pound;0</option>
        <option value="20">Sponge +&pound;20</option>
        <option value="30">Chocolate +&pound;30</option>
      </select></p>
      <p><b>Tiers:</b><br /><select name="tiers">
        <option>1 Tier +&pound;0</option>
        <option>2 Tiers +&pound;20</option>
        <option>3 Tiers +&pound;40</option>
        <option>4 Tiers +&pound;60</option>
        <option>5 Tiers +&pound;80</option>
        <option>6 Tiers +&pound;100</option>
      </select></p>
      <p><input type="submit" value="Submit Message"/><input type="reset" /></p>
    </div>

    <div id="right">
      <p><b>Email:</b><br /><input type="text" name="email" /></p>
      <p><b>Mobile Number:</b><br /><input type="text" name="mobile" /></p>
      <p><b>Address Line 2:</b><br /><input type="text" name="address2" /></p>
      <p><b>County:</b><br /><input type="text" name="county" /></p>
      <p><b>Message:</b><br /><textarea name="message" cols=30 rows=2></textarea></p>
      <p><b>Extras:</b><br />
         <input type="checkbox" id="selecteddecorativebox" value="25" />Decorative Box +&pound;25<br />
         <input type="checkbox" id="selecteddelivery" value="20" checked/>25 Mile Maximum Delivery +&pound;20<br /></p>
		 <h4>Estimated Price: &pound;<script type="text/javascript">
          var base = 100;
		  var quote = base + caketype + tiers + decorativebox + delivery;
		  document.write(quote);
        </script><button type="button" onclick="refresh()">Refresh</button></h4>
		 
		<div id=output><br /></div>
    </div>
      </form>

Thanks

I have to create a website as a project for my university course. Said course has nothing at all to do with computers really so it's really throwing us into the deep end as the majority of us have/had no interest in this particular field.

Regardless, I am creating a website that uses the Random Quote Generator Javascript that I copied from the Hotscripts website. The code details are below and my question is: is there any way I could change the formatting for each quote? For example, change quote 1 to be, say, yellow or bold and change quote 3 to be aligned right and blue? I mainly want to change the colour for each quote but having any other info on how to format it would be really helpful.

Code:

var quotes=new Array();
quotes[0] = "This is quote 1.";
quotes[1] = "This is quote 2.";
quotes[2] = "This is quote 3.";

var q = quotes.length;
var whichquote=Math.round(Math.random()*(q-1));
function showquote(){document.write(quotes[whichquote]);}
showquote();

Also if you could put it into total idiot-speak for me I'd be oh so grateful.

so im using firfoxes firebug and its giving me this java script error

missing ; before statement
document.getElementById("aia").innerHTML = "<p onclick="" >Sword</p>";

i tried just puting this ; behind the beginning but i just cant figure it out.

Hi all,

I'm faced to a problem :

I'm programming a styles generator for the Stylish add-on.
What i want is the same thing that when i click on the button "Install with Stylish" : A Window appear to ask user if he wants to install the script with Stylish.

I saved the website page on my desktop and opened it. Obviously it did not worked, nothing happens when i click. I also changed the path for javascript file in the html and so on.. There is a XMLhttprequest() function wich opens the url of the style ending by ".css". But i replaced the url by my file path ( by a locally file) and i replaced the statut (200 by 0, because i'm working on a local file).

But whatever i do, nothing happens when i click.

There is also a function called firecustomevent() who creates the event, but my knowledges are limited at this point. I read document on mozilla website on how to call an event but i can't get it to work.

So if anybody knows how to display a windows asking the user if he wants to install the style, i will be grateful. Thanks and sorry for my bad english


The url containing the javascript is a simple style url like this one : http://userstyles.org/styles/17120 where you can see the "install with stylish" button. I also attached the concerned javascript in a txt file.

I have a small form that I'm working on for a client. They want a form that their potential leads can fill out and then hit 'calculate rate'.

Once this is done, the results should display on another page with a short summary of what their quote will be as well as some of the other information they filled out. It should also send an email to my client displaying the information that their lead just filled out. My only problem is I am not sure how to go about the calculation part. I know I would have to do an onSubmit, but how would I hide that calculation and then receive that number on another page. Here is the javascript for that form:

Code:

/*
This source is shared under the terms of LGPL 3
www.gnu.org/licenses/lgpl.html

You are free to use the code in Commercial or non-commercial projects
*/

 //Set up an associative array
 //The keys represent the size of the cake
 //The values represent the cost of the cake i.e A 10" cake cost's $35
 var practice_field = new Array();
practice_field["None"]=0;
practice_field["Allergy and Immunology"]=4400;
practice_field["Endocrinology"]=4400;
practice_field["Pathology"]=4400;
practice_field["Dermatology"]=4400;
practice_field["Geriatrics"]=4400;
practice_field["Physical Rehabilitation"]=4400;
practice_field["Family Practice"]=6900;
practice_field["General Practice"]=6900;
practice_field["Internal Medicine"]=6900;
practice_field["Oncology"]=6900;
practice_field["Oral Surgery"]=6900;
practice_field["Radiology"]=6900;
practice_field["Gastroenterology"]=6900;
practice_field["Infectious Disease"]=6900;
practice_field["Nephrology"]=6900;
practice_field["Ophthalmology"]=6900;
practice_field["Pediatrics"]=6900;
practice_field["Urology"]=6900;
practice_field["Anesthesiology"]=9000;
practice_field["Cosmetic Surgery"]=9000;
practice_field["General Surgery"]=9000;
practice_field["Neurology"]=9000;
practice_field["Otolaryngology"]=9000;
practice_field["Plastic Surgery"]=9000;
practice_field["Vascular Surgery"]=9000;
practice_field["Cardiology"]=9000;
practice_field["Emergency Medicine"]=9000;
practice_field["Gynecology"]=9000;
practice_field["Orthopedic Surgery"]=9000;
practice_field["Pain Management"]=9000;
practice_field["Pulmonary Surgery"]=9000;
practice_field["Neurological Surgery"]=9900;
practice_field["Obstetrics"]=9900;

 
 //Set up an associative array 
 //The keys represent the filling type
 //The value represents the cost of the filling i.e. Lemon filling is $5,Dobash filling is $9
 //We use this this array when the user selects a filling from the form
 var society_member= new Array();
 society_member["None"]=null;
society_member["BCMA"]=0.10;
society_member["DCMA"]=0.10;
society_member["FOGS"]=0.10;
society_member["FNS"]=0.10;
society_member["PBCMS"]=0.10;
society_member["FSPS"]=0.10;
 
//This function finds the filling price based on the 
//drop down selection
function getPracticeField()
{
    var docPracticeField=0;
    //Get a reference to the form id="cakeform"
    var theForm = document.forms["cakeform"];
    //Get a reference to the select id="filling"
     var selectedPracticeField = theForm.elements["practice"];
     
    //set cakeFilling Price equal to value user chose
    //For example filling_prices["Lemon".value] would be equal to 5
    docPracticeField = practice_field[selectedPracticeField.value];

    //finally we return cakeFillingPrice
    return docPracticeField;
}	 
	 


//This function finds the filling price based on the 
//drop down selection
function getSelectedSociety()
{
    var docSelectedSociety=0;
    //Get a reference to the form id="cakeform"
    var theForm = document.forms["cakeform"];
    //Get a reference to the select id="filling"
     var selectedSociety = theForm.elements["society"];
     
    //set cakeFilling Price equal to value user chose
    //For example filling_prices["Lemon".value] would be equal to 5
    docSelectedSociety = society_member[selectedSociety.value];

    //finally we return cakeFillingPrice
    return docSelectedSociety;
}

//candlesPrice() finds the candles price based on a check box selection
function candlesPrice()
{
    var candlePrice=0;
    //Get a reference to the form id="cakeform"
    var theForm = document.forms["cakeform"];
    //Get a reference to the checkbox id="includecandles"
    var includeCandles = theForm.elements["includecandles"];

    //If they checked the box set candlePrice to 5
    if(includeCandles.checked==true)
    {
        candlePrice=0;
    }
    //finally we return the candlePrice
    return candlePrice;
}

function insciptionPrice()
{
    //This local variable will be used to decide whether or not to charge for the inscription
    //If the user checked the box this value will be 20
    //otherwise it will remain at 0
    var inscriptionPrice=0;
    //Get a refernce to the form id="cakeform"
    var theForm = document.forms["cakeform"];
    //Get a reference to the checkbox id="includeinscription"
    var includeInscription = theForm.elements["includeinscription"];
    //If they checked the box set inscriptionPrice to 20
    if(includeInscription.checked==true){
        inscriptionPrice=0;
    }
    //finally we return the inscriptionPrice
    return inscriptionPrice;
}
        
function calculateTotal()
{
    //Here we get the total price by calling our function
    //Each function returns a number so by calling them we add the values they return together
    var cakePrice = getPracticeField() + null - (getPracticeField() * getSelectedSociety()) + candlesPrice() + insciptionPrice();
    
    //display the result
    var divobj = document.getElementById('totalPrice');
    divobj.style.display='block';
    divobj.innerHTML = "Your Pre-Paid Legal Defense Fee Will Be Around $"+cakePrice;

}

function hideTotal()
{
    var divobj = document.getElementById('totalPrice');
    divobj.style.display='none';
}

If you look at the bottom you can see where the Function that Calculates everything is. Right now it calculates onClick. I just want it to calculate after the user has filled out the form completely and display that calculation on another page along with the rest of the information they inputted.