Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

input field formatting

Posted on 2012-04-01
5
Medium Priority
?
620 Views
Last Modified: 2012-04-02
Hi,

I have a input text box. It accepts number. This input field is submitted to the next page using POST.

What i want to do :
1. format the input field to currency format
2. but while POST-ing the field to next page, only the numeric value of the field should get posted.

Example:
Case 1: Text input field (without formatting)
2500
after post 2500

Case 2: (Desired case) Text input field
$ 2,500.00
after post 2500
0
Comment
Question by:genius_geek
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 2
5 Comments
 
LVL 12

Expert Comment

by:Amick
ID: 37794202
Couldn't you simply format the display variable as "$"+mynumber.toFixed(2), and post mynumber.
0
 

Author Comment

by:genius_geek
ID: 37794208
its a textbox, its not a label. the formatting needs to be done as you type.
0
 
LVL 12

Accepted Solution

by:
Amick earned 1500 total points
ID: 37794258
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">

var dollars = ''
var decimal = '.'
var cents = ''
var pennies = false;

function editVal(e) {
    e = e || event
    that = e.target || e.srcElement

    switch (e.keyCode) {
      case 8:
            if (pennies == false) {
                if (dollars.length) dollars = dollars.substring(0, dollars.length - 1);
            } else {
                if (cents.length) {
                    cents = cents.substring(0, cents.length - 1)
                } else {
                pennies = false
                }
            }
            that.value = "$"+dollars + decimal + cents;

            return false;
    }
}
function showIt() {
      alert(dollars + decimal + cents);
      }

function showVal(e) {
    e = e || event
    that = e.target || e.srcElement

    var m48 = (e.charCode || e.keyCode) - 48

    switch (m48) {
        case -2: pennies = true; break;
        case 0: if (!dollars.length && pennies==false) break;
        case 1: case 2: case 3: case 4: case 5: case 6: case 7: case 8: case 9:
            if (pennies == false) {
                if (dollars.length < 9) dollars = dollars + m48;
            } else {
                if (cents.length < 2) cents = cents + m48;
            }
            break
        default:
    }
    that.value = "$"+dollars + decimal + cents;


    return false;
}

    </script>
    <title></title>
  </head>
  <body>
    <form onsubmit="showIt()">
      <input id='amount'>
      <input type="submit" value="Submit" />
    </form>
    <script type="text/javascript">
      document.getElementById('amount').onkeypress = showVal;
      document.getElementById('amount').onkeydown = editVal;
    </script>
  </body>
</html>

For discussion of the format as you type code:  http://www.daniweb.com/web-development/javascript-dhtml-ajax/threads/295485/format-dollar-input-as-you-type
0
 

Author Comment

by:genius_geek
ID: 37794311
http://jsfiddle.net/jfCGD/1/ decimals and commas do not work.
0
 
LVL 12

Expert Comment

by:Amick
ID: 37795658
Decimals do work, but you are correct that commas don't as no comma logic has been provided.
Try entering 123.45 and you should see $123.45 in your input box and 123.45 as the submitted value.
Example
The purpose of the example code was simply to illustrate the first response by showing a way to use formatted input in the input box while submitting an unformatted value.
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
Introduction This article is intended for those who are new to PHP error handling (https://www.experts-exchange.com/articles/11769/And-by-the-way-I-am-New-to-PHP.html).  It addresses one of the most common problems that plague beginning PHP develop…
The viewer will learn how to dynamically set the form action using jQuery.
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.

670 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question