|
JavaScript - Percentage Off Function For Quote Form
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';
}
Similar TutorialsI have a JavaScript application that needs to preserve double quote marks and apostrophes (" and ') that are entered into form fields by the user. The form data is passed through several screens using hidden fields. Right now, apostrophes work because I have the input fields coded as value="". I have not found a way for JavaScript to retrieve the field's value if double quotes are entered by the user. If I change the parameter to value='' (single quotes) then the apostrophes probably won't work. Is there a straightforward way for JavaScript to retrieve the field value containing quotes, so that I can manipulate it into a different string that can be easily passed between HTML pages? Hi everyone Dont know if it can be done but.... I am using the percentage calculator Code: <SCRIPT language=JavaScript>
<!--
//Script by Tom Richardson Jr.
//If you have any questions, e-mail me at gooftroop@geocities.com
//or visit mt web site at http://home.rmci.net/gooftroop
//For this script and more, visit http://javascriptkit.com
function perc1() {
a = document.form1.a.value/100;
b = a*document.form1.b.value;
document.form1.total1.value = b
}
function perc2() {
a = document.form1.c.value;
b = document.form1.d.value;
c = a/b;
d = c*100;
document.form1.total2.value = d
}
//-->
</SCRIPT>
<FORM name=form1>
<TABLE cellSpacing=1 cellPadding=1 border=1>
<TBODY>
<TR>
<TD align=middle colSpan=3><B><FONT size=4>Percentage Calculator</FONT></B>
</TD>
<TR>
<TD>What is <INPUT size=5 name=a> % of <INPUT size=5 name=b>?</TD>
<TD>Answer: <INPUT maxLength=40 size=5 name=total1></TD>
<TD><INPUT onclick=perc1() type=button value=Calculate></TD>
<TR>
<TD><INPUT size=5 name=c> is what percent of <INPUT size=5
name=d>?</TD>
<TD>Answer: <INPUT size=5 name=total2> %</TD>
<TD><INPUT onclick=perc2() type=button value=Calculate></TD>
<TR>
<TD align=middle
colSpan=3><INPUT type=reset value=Reset></TD></TR></TBODY></TABLE></FORM>
Does anyone know how I could change the answer to a percentage bar instead of the numeric answer ? or change the colour of the answer to say red or green depending on the value ? Many thanks Donna I have the following form working with on onsumbit function, but I would like to change it so that instead of having to click the purchase button to see total price, you only have to change the quanity text box input. I would welcome any help. I just can not seem to get it to work. Code: <script language="javascript" type="text/javascript">
function checkQuantity(frm) {
var succesful = false;
var numQuantity;
numQuantity = parseInt(frm.Quantity.value);
var numTotalPrice;
if (numQuantity != 0) {
numTotalPrice = numQuantity * 4;
frm.TotalPrice.value = numTotalPrice; //new String(numTotalPrice);
successful = true;
}
else {
alert("Sorry must order more than 0");
successful = false;
}
return succesful;
}
</script>
Code: <form action="" onsubmit="return checkQuantity(this)" style="width: 193px">
<table cellpadding="4" style="width:111%">
<tr>
<td class="style1">
Quanity:</td>
<td class="formInputCell">
<input name="Quantity" type="text" style="width: 55px" /></td>
</tr>
<tr>
<td class="style1">
Total Price $
</td>
<td class="formInputCell">
<input name="TotalPrice" type="text" style="width: 55px" /></td>
</tr>
<tr>
<td class="style2"></td>
<td><input id="Submit1" type="submit"
value="Buy Now" class="buttonstyle" /></td>
</tr>
</table>
</form>
I use Firefox and am wondering how to select a word and wrap [b] tags or [quote] tags around it? Any tutorials?
I am using a JavaScript price calculator. Right now it does everything I need except for one thing. If you look at the "type" field, they can choose either woven or printed. Right now, if they choose "woven" it adds 6 cents to to the total as you can see in this portion of the code: if (theForm.select.value=="woven") { priceeach+=0.06; Rather than 0.06, how do I get it to add a percentage--say 20% The form is located he http://goo.gl/YlJWo Thank you! I am having an issue with converting my decimal to a percentage... any suggestions? Thanks - it's probably an easy solution, but I am lost below is my code (cost * .06) is where the issue is - Thanks! var cost = prompt("What is the cost of your purchase?", "") document.write("Return Value: "+cost,("<br />")); var salestax = cost * .06 document.write("Return Value: "+salestax,("<br />")); var total = cost + salestax document.write(cost + salestax); 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="" />
---> 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 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 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, I am fairly new to this so please bare with me. I have a php page that uses Javascript (I think) to calculate the percentage Insurance Premium Tax (IPT field) of a total. I have located where the calculation occurs and can see that it take the total of a predefined amount and divides it by 21 to give me the 5% IPT tax. IPT has risen in the UK today to 6% so I need to know what I need to change the 21 to to give me an accurate IPT calculation. Here's a snippet of the code. Can anyone help please? Is it 17.65? PHP Code: //////////////////////////////////////////// // Motor Bike Calculations //////////////////////////////////////////// $p = 3; $q = 0; while ($p < 6){ $base_array = mysql_fetch_row($result4); // Motor Bikes $risk_code = 2; $ap = (0 + ($p)); $ipt_rate = $ipt_main; $monthly_total = $pricing_row[$ap]; // Calculate IPT $ipt_percentage = $monthly_total / 21; $monthly_ipt = $ipt_percentage; $base_cost = $base_array[0] + $dealer_loading; $base_final = $base_cost; $profit = $monthly_total - $base_cost - $monthly_ipt; $monthly_total = number_format($monthly_total, 2, '.', ''); $monthly_ipt = number_format($monthly_ipt, 2, '.', ''); $base_final = number_format($base_final, 2, '.', ''); $profit = number_format($profit, 2, '.', ''); echo ' <tr align="center" bgcolor="#FFDDFF"> <td>'; if ($p == 3) { echo (''); } elseif ($p == 4) { echo ('UK'); } elseif ($p == 5) { echo ('UK & European'); } echo '</td> <td> <input name="'; if ($p == 3) { echo ('comprehensive_plus_'.$risk_code); } elseif ($p == 4) { echo ('comprehensive_'.$risk_code); } elseif ($p == 5) { echo ('driveline_plus_'.$risk_code); } echo '" type="text" value="'.$pricing_row[$ap].'" size="6" maxlength="6" class="smallinfo"> </td> <td>'.$monthly_ipt.'</td> <td>'.$base_final.'</td> <td>'.$profit.'</td> </tr>'; $q++; $p++; } I have my cumulative totals box at the very end of my order form and I'm required to have another underneath that one that will give a particular discount depending on how great the total of the order is. Would someone please be able to give me the javascript codes that will allow me to do this and also tell me where I'm to put them. Hi. Can someone please tell me if a bent percentage silder is possible (something like this http://www.codingforums.com/showthread.php?t=173255 only I want it to be bent about 330 degrees, and I wouldn't want to link to another class-I would like to host the entire code on my website)? Also, the reason I want the slider to be bent, is because I would like the slider to be a sort of bent rectangle, and when the user clicks/drags the slider, the rectangle would "fill" to that point (change its background color up to where the mouse is). Thank you. Bye.
Is there a way with Firefox/Chrome to get the actual % used instead of the rendered pixel values? For example I have a table with the following CSS markup Code: #tableFoo : { width : 50%; }
In IE to get the percentage set in the CSS file, it is as simple as: Code: var width = tableObj.currentStyle["width"] I am having trouble figuring out a way to get the percentage value with Firefox and Chrome. I am thinking it is not possible other than stylesheet sniffing and ripping out the rules that way which I am not going to do. Thanks, Eric 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 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. 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 +£0</option>
<option value="20">Sponge +£20</option>
<option value="30">Chocolate +£30</option>
</select></p>
<p><b>Tiers:</b><br /><select name="tiers">
<option>1 Tier +£0</option>
<option>2 Tiers +£20</option>
<option>3 Tiers +£40</option>
<option>4 Tiers +£60</option>
<option>5 Tiers +£80</option>
<option>6 Tiers +£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 +£25<br />
<input type="checkbox" id="selecteddelivery" value="20" checked/>25 Mile Maximum Delivery +£20<br /></p>
<h4>Estimated Price: £<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 How can i "prompt the user for the sales tax rate as a percentage"? Thanks soooo much for any help! this is what i have so far.... var tax = prompt("What is your tax rate percentage?", "") document.write("Return Value: "+tax,("<br />")); I am trying to customize this scrollbar so that it will fit all screen resolutions and I was wondering how I could do this by somehow customizing the JavaScript files created by Nathan Faubion or if I could do this using other JavaScript variables (var widthPercentage) to change the pixels to percentages? Please let me know what you think. Thank you very much! One of the pages on the website I'm using the JavaScript on: http://www.clintshipley.com/about.html Code: JavaScript file jsScroller.js:
//Created by Nathan Faubion http://www.n-son.com/scripts/jsScrolling/
function jsScroller (o, w, h) {
var self = this;
var list = o.getElementsByTagName("div");
for (var i = 0; i < list.length; i++) {
if (list[i].className.indexOf("scroller-content") > -1) {
o = list[i];
}
}
//Private methods
this._setPos = function (x, y) {
if (x < this.viewableWidth - this.totalWidth)
x = this.viewableWidth - this.totalWidth;
if (x > 0) x = 0;
if (y < this.viewableHeight - this.totalHeight)
y = this.viewableHeight - this.totalHeight;
if (y > 0) y = 0;
this._x = x;
this._y = y;
with (o.style) {
left = this._x +"px";
top = this._y +"px";
}
};
//Public Methods
this.reset = function () {
this.content = o;
this.totalHeight = o.offsetHeight;
this.totalWidth = o.offsetWidth;
this._x = 0;
this._y = 0;
with (o.style) {
left = "0px";
top = "0px";
}
};
this.scrollBy = function (x, y) {
this._setPos(this._x + x, this._y + y);
};
this.scrollTo = function (x, y) {
this._setPos(-x, -y);
};
this.stopScroll = function () {
if (this.scrollTimer) window.clearInterval(this.scrollTimer);
};
this.startScroll = function (x, y) {
this.stopScroll();
this.scrollTimer = window.setInterval(
function(){ self.scrollBy(x, y); }, 40
);
};
this.swapContent = function (c, w, h) {
o = c;
var list = o.getElementsByTagName("div");
for (var i = 0; i < list.length; i++) {
if (list[i].className.indexOf("scroller-content") > -1) {
o = list[i];
}
}
if (w) this.viewableWidth = w;
if (h) this.viewableHeight = h;
this.reset();
};
//variables
this.content = o;
this.viewableWidth = w;
this.viewableHeight = h;
this.totalWidth = o.offsetWidth;
this.totalHeight = o.offsetHeight;
this.scrollTimer = null;
this.reset();
};
JavaScript on HTML page:
<script type="text/javascript" src="Scripts/jsScroller.js"></script>
<script type="text/javascript" src="Scripts/jsScrollbar.js"></script>
<script type="text/javascript">
var scroller = null;
var scrollbar = null;
window.onload = function () {
scroller = new jsScroller(document.getElementById("scroller"), 550, 275);
scrollbar = new jsScrollbar (document.getElementById("scrollbar-content"), scroller, false);
}
</script>
|
|||||||