|
JavaScript - Mask Input To Insure Decimal And 2 Positions
Hi, I have a text input that will default to "0.00".
However, entries can be for a length of 15 and must include a decimal with 2 positions (hundredths)... How can I force this and prevent 14/15 positions with no decimal being used or a decimal mis placed giving more positions beyond 2 to the right of the decimal? Your response is appreciated -Ron Similar TutorialsHello everyone! I have searched everywhere for a bit of script to do this but I cant find anything. I am in urgent need of a mask to create a comma separated string. The user will be inputing multiple 5 digit numbers and I need them to be organized in a proper fashion. Unfortunately this is not being done... The user will enter 00003 then 00008 etc etc. I want the output to be 00003, 00008, 00019, and so on. Can we create a mask to keep this formatting? Code: <textarea name="Tags" rows="7" cols="46" maxlength="200"></textarea> Thank you all! Hey everyone. I am looking to enforce the use of 3 decimal places in an input. I have found some scripts that do this, however, I also want to format it this way in case someone enters LESS than 3 decimal places. If a user enters 1.25, I want it formatted as 1.250 If a user enters 1 I want it formatted as 1.000 etc. Possible? Not sure where to start. Hi everyone i want to have a "onmouseover" that show a div and also mask 2 others div in a frame (which have id "mainFrame"). I have a javascript that is OK under FireFox, Safari, IE 7 but in IE 5 or 6 the others div are not mask when my mouse is going on the text. Here's my code, if someone can help me ! Code: <td width="180" valign="middle">
<div align="center" class="Menu">
<a href="javascript:showdiv_contact()" class="Menu" onmouseover="parent.frames['mainFrame'].document.getElementById('presentation').style.display='none';parent.frames['mainFrame'].document.getElementById('services').style.display='none';parent.frames['mainFrame'].document.getElementById('prestations').style.display='none';parent.frames['mainFrame'].document.getElementById('contact').style.display='block'" >Contact</a></div></td>
I also try to set the javascript in the head, like this: Code: <script language="javascript" type="text/javascript">
function aff_prest() {
parent.frames['mainFrame'].document.getElementById('prestations').style.display='block';
}
function masque_prest() {
parent.frames['mainFrame'].document.getElementById('prestations').style.display='none';
function aff_presentation() {
parent.frames['mainFrame'].document.getElementById('presentation').style.display='block';
}
function masque_presentation() {
parent.frames['mainFrame'].document.getElementById('presentation').style.display='none';
}
</script>
and then this in the onmouseover: Code: <a href="javascript:showdiv()" class="Menu" onmouseover="javascript:masque_presentation();javascript:aff_prest();">Nos prestations</a> but again that works on FireFox not in IE6 Thanks to everyone for your help! Hi everyone, I am trying to make an image mask using javascript. The basic idea is that the image on the canvas will appear as a black box. When the user hovers over the image a small part of it is revealed. I have attached a picture as an example because its quite hard to explain! Any help would be appreciated! Thanks, Luke var stopper; if ((x-130)!=endpos) { var xpos=130; Hi, im trying to create an effect where by a div moves gradually from one position to another, initially fast and then slowing as it progresses to its final position. The code I have for this is as follows: Code: function up1() {
//get objects
objImgStrip = document.getElementById("str");
objDivStrip = document.getElementById("strip");
objImgMain = document.getElementById("theImage");
//Get End position
var totImg = (objImgStrip.height - 100)/130;
var endpos = -(totImg * 130);
var pos = objDivStrip.style.top;
var C=50;
var dx;
//Find next stopping position
stopper=pos-130;
var i=0;
while (x!=stopper)
{
//Find change in pixels to next div position
dx = (xpos/C);
//xpos - dx
xpos-=Math.round(dx);
//actual x position - dx
x-=Math.round(dx);
objDivStrip.style.top = x + "px";
i++;
}
imgID++;
objImgMain.src = "images/gallery/shower/"+imgID+".jpg";
}
else
{
return false;
}
}
The code just seems to freeze the browser when it executes so I'm not sure whether or no this sort of animation is doable in JS. Any help greatly appreciated Cheers Sol I'm developing a chess game recorder (records chess games just like electronic score sheet) and i am trying to write a function that handles the "en passent" rule in chess. However, when i try to test to see if a Black pawn is at a particular x,y location, it is always giving me back "50px". Even when it's not at that location. i uploaded semi-live version to my website he http://daomingjin.googlepages.com/ScoreMate.html you just click on the 'Play' button to start the game here's the function in question: Code: function PossibleEnpassent()
{
// if a black pawn moved once, and is in the 5th row it is in a situation where maybe can be taken using en passent
for (var x = 0; x < 8; x++)
{
var Offset = x + 1;
if (BlackPawnMoved[0] == 1)
{
alert("alerted");
// the pawn has been moved once
var it = document.getElementById("BlackPawn" + Offset + "Image").style.top;
alert(it);
if(document.getElementById("BlackPawn" + Offset + "Image").style.top == BlockSize * 3)
{
alert("black pawn in the 5th row");
// and if the white pawn is in the 5th row (y coord) and the x coord of the white piece is 1 block to the right OR left of the black piece
if(document.getElementById("WhitePawn" + Offset + "Image").style.top == BlockSize * 3)
{
if(document.getElementById("WhitePawn" + Offset + "Image").style.left == document.getElementById("BlackPawn" + Offset + "Image").style.left + BlockSize)
{
// the white pawn and the black pawn are in the 5th row, and they are next to eachother
BlackPawnCanEnPassented[x] = 1;
alert("ready");
}
// Or to the left of it
if(document.getElementById("WhitePawn" + Offset + "Image").style.left == document.getElementById("BlackPawn" + Offset + "Image").style.left - BlockSize)
{
// the white pawn and the black pawn are in the 5th row, and they are next to eachother
BlackPawnCanEnPassented[x] = 1;
alert("ready");
}
}
}
}
}
}
Dear All, I can check now a field is isNumeric via this method var isNumeric = /^[0-9.]+$/;. My problem now user can put two or more decimal and I want to limit just to single decimal and only 2 numbers before the decimal? How to edit please? The way I have my code now inorder to create .XX places I use Code: var valueY=Math.round(valueX*100)/100; That way if valueX=15.6898 it would give valueY=15.69. but the problem arises when I want it valueX=15.6 to display valueY=15.60 I did some research and people said to use .toFixed(2) but i can't get it to add in the zero if it isn't already there. Any help I would be very helpful. Hi All, Im currently working on a bidding application built within ASP.Net and i have found this javascript snippet to only allow numeric values in the desired <asp:textbox> which is working fine, but i want to allow the user to add a decimal place. For example, say the bid is 1.50 they should be allowed to enter 1.51 but as i cant imput (.) i end up putting in 151 heres the snippet it may be a slight modification but im new to javascript so any help of knowledge will be highly appreciated Code: function isNumberKey(evt)
{
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode > 31 && (charCode < 48 || charCode > 57))
return false;
return true;
}
thanks in advance I'm trying to write a pi calculator that shows a comparison of the calculated value to the actual value. It works, but the output of the comparison shows only the first two decimal spots, followed by two 9s. Why is it showing two 9s and how can I make it more precise? Code:
<head>
<title>
Pi Calculator
</title>
<script language="JavaScript">
function calcpi(digitsn) {
p = 1;
s = 0;
for (c = 3; c < digitsn; c += 2) {
if (s == 0) {
p -= 1/c;
s = 1;
} else {
p += 1/c;
s = 0;
}
}
p *= 4;
return p;
}
function hid(input) { //Highlight Incorrect Digits
pi = "3.14159265358979323846".split('');
input = input.toString().split('');
result = "";
for (c = 0; c < input.length; c++) {
if (input[c] != pi[c]) {
//result += "; " + input[c] + "!=" + pi[c];
result += "<span style='background-color:red'>" + input[c] + "</span>";
} else {
result += input[c];
}
}
return result;
}
</script>
</head>
<body>
Repeat algorithm x many times:<br/>
<input type="text" value="10000" id="digitsx"/><br/>
<input type="button" onClick="document.getElementById('answer').value=calcpi(parseInt(document.getElementById('digitsx').value)).toString()" value="Calculate"/><br/>
Result:<br/>
<input type="text" readonly id="answer"/><br/>
Correct value:<br/>
<input type="text" readonly value="3.14159265358979323846"/><br/>
<input type="button" value="Compare" onClick="document.getElementById('comparison').innerHTML = hid('3.1499')"/>
<div id="comparison"/>
</body>
Hi.. I have javascript code with computation, but I have problem in my result because it was not round off or fixed into two decimal places only. here is my code: Code: <script type="text/javascript">
function test_(cmpd) {
var len_ = (document.frmMain.elements.length) - 1;
for (i=0; i <= len_; i++ ) {
var strPos_ = document.frmMain.elements[i].id.indexOf(cmpd)
if (strPos_ != -1) {
var strPos = document.frmMain.elements[i].id.indexOf("_");
var strId = document.frmMain.elements[i].id.slice(strPos + 1) + "_" + document.frmMain.elements[i].id.slice(0,strPos)
// this is the computation that I need to fixed the result into two decimal places
document.frmMain.elements[i].value = document.getElementById(strId).value * document.getElementById('mult').value;
}
}
}
</script>
Thank you so much Hello all, How to set decimal point in javascript ? e.g. var num1=23.12345; I want output as 23.12 How can i do this ? Please, guide me. Thanks 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); I have a mortgage calc that is adding an extra decimal place to my interest rate. To see this in action go to: http://www.keithknowles.com/elmtree/mortgagecalc2.htm Change the interest rate to 7.5 Click Calculate Payment Click Create Amortization Chart On the following screen you'll see a recap of your data and the interest rate will now say 7.55. Same thing happens if you enter 6.2. Next screen shows 6.22/ I've attached the html and js files in a zip. Any help is greatly appreciated. Thanks. I am trouble in comparing decimal number. var1 = 0.25 var2 = 0.50 if (var1<var2) { alert("Value is less than minimum") } else { return true; } How can I make it work. Thanks for help in advance Hi, Dreamweaver generated the javascript for an onBlur validation for an input textbox. Is it possible to change this code so that I do not have a range but, instead, specific numbers that must be input by the user? I want to ensure that the users input integers and only the following decimals: .25; .5, and .75. [function MM_validateForm() { //v4.0 if (document.getElementById){ var i,p,q,nm,test,num,min,max,errors='',args=MM_validateForm.arguments; for (i=0; i<(args.length-2); i+=3) { test=args[i+2]; val=document.getElementById(args[i]); if (val) { nm=val.name; if ((val=val.value)!="") { if (test.indexOf('isEmail')!=-1) { p=val.indexOf('@'); if (p<1 || p==(val.length-1)) errors+='- '+nm+' must contain an e-mail address.\n'; } else if (test!='R') { num = parseFloat(val); if (isNaN(val)) errors+='- '+nm+' must contain a number.\n'; if (test.indexOf('inRange') != -1) { p=test.indexOf(':'); min=test.substring(8,p); max=test.substring(p+1); if (num<min || max<num) errors+='- '+nm+' must contain a number between '+min+' and '+max+'.\n'; } } } else if (test.charAt(0) == 'R') errors += '- '+nm+' is required.\n'; } } if (errors) alert('The following error occurred:\n'+errors); document.MM_returnValue = (errors == ''); } } </script>] John This script is for car loan payments. I need a R simbol only before the monthly payment and only two figures after the decimal point. Can somebody pse help me with this. Thank you in advance. Kees Meyer (keesmarcha) <script language="JavaScript"> <!-- function showpay() { if ((document.calc.loan.value == null || document.calc.loan.value.length == 0) || (document.calc.months.value == null || document.calc.months.value.length == 0) || (document.calc.rate.value == null || document.calc.rate.value.length == 0)) { document.calc.pay.value = "Incomplete data"; } else { var princ = document.calc.loan.value; var term = document.calc.months.value; var intr = document.calc.rate.value / 1200; document.calc.pay.value = princ * intr / (1 - (Math.pow(1/(1 + intr), term))); } // payment = principle * monthly interest/(1 - (1/(1+MonthlyInterest)*Months)) } // --> </script> The results of this loan payment calculator are for comparison purposes only. They will be a close approximation of actual loan repayments if available at the terms entered, from a financial institution. This is being provided for you to plan your next loan application. To use, enter values for the Loan Amount, Number of Months for Loan, and the Interest Rate (e.g. 7.25), and click the Calculate button. Clicking the Reset button will clear entered values. <p> <center> <form name=calc method=POST> <table width=60% border=0> <tr><th bgcolor="#aaaaaa" width=50%><font color=blue>Description</font></th> <th bgcolor="#aaaaaa" width=50%><font color=blue>Data Entry</font></th></tr> <tr><td bgcolor="#eeeee">Loan Amount</td><td bgcolor="#aaeeaa" align=right><input type=text name=loan size=10></td></tr> <tr><td bgcolor="#eeeee">Loan Length in Months</td><td bgcolor="#aaeeaa" align=right><input type=text name=months size=10></td></tr> <tr><td bgcolor="#eeeee">Interest Rate</td><td bgcolor="#aaeeaa" align=right><input type=text name=rate size=10></td></tr> <tr><td bgcolor="#eeeee">Monthly Payment</td><td bgcolor="#eeaaaa" align=right><em>Calculated</em> <input type=text name=pay size=10></td></tr> <tr><td bgcolor="#aaeeaa"align=center><input type=button onClick='showpay()' value=Calculate></td><td bgcolor="#eeeeaa" align=center><input type=reset value=Reset></td></tr> </table> </form> <font size=1>Enter only numeric values (no commas), using decimal points where needed.<br> Non-numeric values will cause errors.</font> </center> <p align="center"><font face="arial" size="-2">This free script provided by</font><br> <font face="arial, helvetica" size="-2"><a href="http://javascriptkit.com">JavaScript Kit</a></font></p> I'm a bit confused as I'm just learning PHP/Java, and need to display a percentage. I successfully can display a percentage, however, the decimal like any calculate displays .00000012130 whatever sometimes. How can I round the output to the nearest 10s place? <script language="javascript" type="text/javascript"> var a = "14"; var b = "25"; document.write(parseInt(a) / parseInt(b) * 100); document.write("%"); </script> This is the code I use, however, it needs to be modified so that it rounds to the nearest 10 instead of display a decimal. I wrote this microday clock some time ago (with some difficulty) as a project, and now I'm attemtping to make an octal version. I'm still learning JavaScript, so I'm not sure exactly which line/s to edit and what script to add to make it fuctional. if anyone here can show me the most concise script needed to convert the output of this JavaClock from decimal to octal it would be very much appreciated the original script to be converted is shown below : ------------------------------------------------------------ Code: <HTML>
<HEAD>
<META NAME="JAVACLOCK">
<META HTTP=EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
<META NAME="microday clock" INDEX="all">
<META HTTP-EQUIV="Content-Style-Type" CONTENT="text/css">
<STYLE>
BODY {
font-family: Digital Readout Expanded;
}
</STYLE>
<TITLE>microday clock</TITLE>
</HEAD>
<BODY BGCOLOR=BLACK TEXT=BLUE ALIGN=CENTER LINK=ROYALBLUE VLINK=VIOLET>
<DIV ALIGN=CENTER>
<span id="clock">
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function Clock() {
Now = new Date();
var DecTime = Now.getTime()/86400000 + 1004472;
DecTime = '<FONT SIZE=5><FONT COLOR="#3399FF">' + DecTime.toString().substring(1,4) +
' ' + DecTime.toString().substring(4,7) +
'</FONT> <FONT COLOR="#33CC00">' + DecTime.toString().substring(8,11) +
' ' + DecTime.toString().substring(11,14) + '</FONT>'
if (document.all)
document.all.clock.innerHTML=DecTime
else if (document.getElementById)
document.getElementById("clock").innerHTML=DecTime
else
document.write(DecTime)
}
if (!document.all&&!document.getElementById)
Clock()
function Increment() {
if (document.all||document.getElementById)
setInterval("Clock()",86)
}
window.onload=Increment
// End -->
</script>
</span>
function below will output price value in text field based on drop-menu option. It's working but I want it's always show value in 2 decimal point for variable 'price'. Can anyone help me with this problem? function findPrice() { if (document.getElementById("region").value == "blank") { var price = document.getElementById("price"); price.value = "<?php echo 'Choose your region to get the price'; ?>"; } if (document.getElementById("region").value == "Peninsular Malaysia") { var price = document.getElementById("price"); price.value= '<?php echo $PM_Price; ?>'; } if (document.getElementById("region").value == "Sabah/Labuan") { var price = document.getElementById("price"); price.value = '<?php echo $SL_Price; ?>'; } if (document.getElementById("region").value == "Sarawak") { var price = document.getElementById("price"); price.value = '<?php echo $SR_Price; ?>'; } } |
|||||||