Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    Regular Coder
    Join Date
    Jun 2010
    Posts
    163
    Thanks
    10
    Thanked 0 Times in 0 Posts

    Update text as numbers are typed into input field

    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 Code:
    <?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($mycredits0'.''');

        }

    }


    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($mycredits0'.''');
        
        }

    }


    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($mycredits0'.''');
        
        }
    }


    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($mycredits0'.''');
        }
    }



    ?>
    <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>

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,730
    Thanks
    202
    Thanked 2,508 Times in 2,486 Posts
    Here you are:-

    Code:
    <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.

  • #3
    Regular Coder
    Join Date
    Jun 2010
    Posts
    163
    Thanks
    10
    Thanked 0 Times in 0 Posts
    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

  • #4
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,730
    Thanks
    202
    Thanked 2,508 Times in 2,486 Posts
    Code:
    <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>

  • #5
    Regular Coder
    Join Date
    Jun 2010
    Posts
    163
    Thanks
    10
    Thanked 0 Times in 0 Posts
    Brilliant, thanks very much.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •