...

View Full Version : Update text as numbers are typed into input field



Smudly
07-22-2010, 03:17 AM
I'm creating a page that calculates a number depending on what value is inputted into a text field. I need to create some javascript that updates this new calculated value and outputs it next to the input field. Anytime the user changes the number, it recalculates the value. My calculation is currently being produced by PHP, however if I need to, I can create javascript as well to recalculate these numbers.

My formulas for all 4 calculations are as follows:

First: Inputted Value * 10
Second: Inputted Value * 20
Third: Inputted Value / 2
Fourth: Inputted Value * 2

Here is my code I'm working with:


<?php
session_start();
$username = $_SESSION['username'];

include_once('inc/connect.php');

$credquery = mysql_query("SELECT * FROM userstats WHERE username='$username'");
$row = mysql_fetch_assoc($credquery);

$credits = $row['credits'];
$bannercredits = $row['bannercredits'];
$textcredits = $row['textcredits'];

$sitetobanner = $_POST['sitetobanner'];
$sitetotext = $_POST['sitetotext'];
$bannertotext = $_POST['bannertotext'];
$texttobanner = $_POST['texttobanner'];

if (isset($sitetobanner)){

$bannerimp = round($_POST['bannerimp']);
if ($bannerimp > 1){
$s = "s";
}
if ($bannerimp <= $credits){
$newcredits = $credits - $bannerimp;
$newbannercredits = $bannerimp * 10;
$totalbannercredits = $bannercredits + $newbannercredits;

$updatebanner = mysql_query("UPDATE userstats SET credits='$newcredits', bannercredits='$totalbannercredits' WHERE username='$username'");

$credits = $row['credits'];
$bannercredits = $row['bannercredits'];
$textcredits = $row['textcredits'];

$convertedbanner = "You converted ".$bannerimp." credit".$s." into ".$newbannercredits." banner impressions";

}
else{
if ($credits>1){
$mycredits = $credits - 1;}
$errorbanner = number_format($mycredits, 0, '.', '');

}

}


if (isset($sitetotext)){

$textimp = round($_POST['textimp']);
if ($textimp > 1){
$s = "s";
}
if ($textimp <= $credits){
$newcredits = $credits - $textimp;
$newtextcredits = $textimp * 20;
$totaltextcredits = $textcredits + $newtextcredits;

$updatebanner = mysql_query("UPDATE userstats SET credits='$newcredits', textcredits='$totaltextcredits' WHERE username='$username'");

$credits = $row['credits'];
$bannercredits = $row['bannercredits'];
$textcredits = $row['textcredits'];

$convertedtext = "You converted ".$textimp." credit".$s." into ".$newtextcredits." text ad impressions";

}
else{

if ($credits>1){
$mycredits = $credits - 1;}
$errortext = number_format($mycredits, 0, '.', '');

}

}


if (isset($texttobanner)){

$texttobannerimp = round($_POST['texttobannerimp']);
if ($texttobannerimp > 1){
$s = "s";
}

if ($texttobannerimp <= $textcredits){
if ($texttobannerimp>=2&&$texttobannerimp>""){
$newcredits = $textcredits - $texttobannerimp;
$newbannercredits = $texttobannerimp / 2;
$totalbannercredits = $bannercredits + $newbannercredits;

$updatebanner = mysql_query("UPDATE userstats SET textcredits='$newcredits', bannercredits='$totalbannercredits' WHERE username='$username'");

$credits = $row['credits'];
$bannercredits = $row['bannercredits'];
$textcredits = $row['textcredits'];

$convertedtextimp = "You converted ".$texttobannerimp." text ad impression".$s." into ".$newbannercredits." banner impressions";
}
else{
$convertedtextimp = "You Hag";
}
}
else{

if ($textcredits>1){
$mycredits = $textcredits - 1;}
$errortextimp = number_format($mycredits, 0, '.', '');

}
}


if (isset($bannertotext)){

$bannertotextimp = round($_POST['bannertotextimp']);
if ($bannertotextimp > 1){
$s = "s";
}
if ($bannertotextimp <= $bannercredits){
$newcredits = $bannercredits - $bannertotextimp;
$newtextcredits = $bannertotextimp * 2;
$totaltextcredits = $textcredits + $newtextcredits;

$updatebanner = mysql_query("UPDATE userstats SET bannercredits='$newcredits', textcredits='$totaltextcredits' WHERE username='$username'");

$credits = $row['credits'];
$bannercredits = $row['bannercredits'];
$textcredits = $row['textcredits'];

$convertedbannerimp = "You converted ".$bannertotextimp." banner impression".$s." into ".$newtextcredits." text impressions";

}
else{

if ($bannercredits>1){
$mycredits = $bannercredits - 1;}
$errorbannerimp = number_format($mycredits, 0, '.', '');
}
}



?>
<html>
<head>
<title>Convert Credits</title>
<script type="text/javascript" language="javascript">
function inputLimiter(e,allow) {
var AllowableCharacters = '';
if (allow == 'NumbersOnly'){AllowableCharacters='0123456789.';}

var k;
k=document.all?parseInt(e.keyCode): parseInt(e.which);
if (k!=13 && k!=8 && k!=0){
if ((e.ctrlKey==false) && (e.altKey==false)) {
return (AllowableCharacters.indexOf(String.fromCharCode(k))!=-1);
} else {
return true;
}
} else {
return true;
}
}

</script>
</head>
<body>
<h1>Convert Credits</h1><br />
Credits: <?php echo $credits; ?><br />
Banner Impressions: <?php echo $bannercredits; ?><br />
Text Ad Impressions: <?php echo $textcredits; ?><br />

<form action="convert.php" method="POST">
<h3>Credits To Banner Impressions</h3>
Convert <input type="text" name="bannerimp" id="NumbersOnly" onkeypress="return inputLimiter(event,'NumbersOnly')" value="<?php echo $errorbanner; ?>" onChange=""> credits into BLANK Banner Impressions!
<input type="submit" name="sitetobanner" value="Convert"><br />
<?php echo $convertedbanner; ?>
</form>

<form action="convert.php" method="POST">
<h3>Credits To Text Ad Impressions</h3>
Convert <input type="text" name="textimp" id="NumbersOnly" onkeypress="return inputLimiter(event,'NumbersOnly')" value="<?php echo $errortext; ?>"> credits into BLANK Text Ad Impressions!
<input type="submit" name="sitetotext" value="Convert"><br />
<?php echo $convertedtext; ?>
</form>

<form action="convert.php" method="POST">
<h3>Text Ad To Banner Impressions</h3>
Convert <input type="text" name="texttobannerimp" id="NumbersOnly" onkeypress="return inputLimiter(event,'NumbersOnly')" value="<?php echo $errortextimp; ?>"> Text Ad Impressions into BLANK Banner Impressions!
<input type="submit" name="texttobanner" value="Convert"><br />
<?php echo $convertedtextimp; ?>
</form>

<form action="convert.php" method="POST">
<h3>Banner To Text Ad Impressions</h3>
Convert <input type="text" name="bannertotextimp" id="NumbersOnly" onkeypress="return inputLimiter(event,'NumbersOnly')" value="<?php echo $errorbannerimp; ?>"> Banner Impressions into BLANK Text Ad Impressions!
<input type="submit" name="bannertotext" value="Convert"><br />
<?php echo $convertedbannerimp; ?>
</form>

</body>
</html>

Philip M
07-23-2010, 05:24 PM
Here you are:-


<input type = "text" id = "input1" onchange = "calc()"><br>
<input type = "text" id = "result1" readonly><br>
<input type = "text" id = "result2" readonly><br>
<input type = "text" id = "result3" readonly><br>
<input type = "text" id = "result4" readonly><br>

<script type = "text/javascript">
function calc() {
var x = parseFloat(document.getElementById("input1").value);
if ((isNaN(x)) || (x == "")) {
alert ("Invalid data - re-enter it");
document.getElementById("input1").value = "";
setTimeout("document.getElementById('input1').focus()", 10);
setTimeout("document.getElementById('input1').select()", 10);
return false;
}
document.getElementById("result1").value = x * 10;
document.getElementById("result2").value = x * 20;
document.getElementById("result3").value = x / 2;
document.getElementById("result4").value = x * 2;
}

</script>


i raed a wlihe ago taht as lnog as the frsit and lsat lttesrs in a wrod are in the cerroct pcale msot of us wulod siltl be albe to raed bceause our barnis jsut looks at the frsit and lsat lttesrs.

Smudly
07-23-2010, 06:14 PM
Thanks this script is great. It is almost exactly what I need. Instead of the values showing up in input fields, they need to somehow show as just text next to the input box. How would I edit this code to do something like that?

An example would be on a website called www.easyhits4u.com

If you login, and click Credits -> Impressions, you will see kind of how it works.

Thanks

Philip M
07-23-2010, 06:55 PM
<input type = "text" id = "input1" onchange = "calc()"> &nbsp &nbsp
<span id = "result1" > </span> &nbsp &nbsp
<span id = "result2" > </span> &nbsp &nbsp
<span id = "result3" > </span> &nbsp &nbsp
<span id = "result4" > </span> &nbsp &nbsp

<script type = "text/javascript">
function calc() {
var x = parseFloat(document.getElementById("input1").value);
if ((isNaN(x)) || (x == "")) {
alert ("Invalid data - re-enter it");
document.getElementById("input1").value = "";
setTimeout("document.getElementById('input1').focus()", 10);
setTimeout("document.getElementById('input1').select()", 10);
return false;
}
document.getElementById("result1").innerHTML = x * 10;
document.getElementById("result2").innerHTML = x * 20;
document.getElementById("result3").innerHTML = x / 2;
document.getElementById("result4").innerHTML = x * 2;
}

</script>

Smudly
07-23-2010, 08:30 PM
Brilliant, thanks very much.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum