Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

Input type number not showing decimal values.

Posted on 2015-01-07
7
Medium Priority
?
308 Views
Last Modified: 2015-01-11
I have an input field defined as numeric.  I'm trying to get it to show the decimal places.  Here's the code:

if ($ROW['RENT'] == "0")
            {
                  if ($ROW['TOTAL'] == "0")
                  {
                        $work = "0";
                  }
                  else
                  {
                        $work = ("$ROW[ANNUAL]" / "$ROW[TOTAL]");
                  }
            }
            else
            {
                  $work = number_format("$ROW[RENT]");
            }
            $work = number_format($work, 2, '.', '');
                  
            echo '<td align = "right">';
            echo '<input type="number" name="$PSF" size = "9" value="';
            echo $work;
            echo '" maxlenghth="9" step = "0.01">';
            echo '</td>';

What am I missing?

Thanks
0
Comment
Question by:breeze351
  • 3
  • 3
7 Comments
 
LVL 111

Expert Comment

by:Ray Paseur
ID: 40536866
This worked well for me in Chrome.

<?php // demo/temp_breeze351.php

/**
 * HOW TO MAKE AN HTML5 INPUT TYPE=NUMBER CONTROL SHOW DECIMALS
 *
 * SEE: http://www.experts-exchange.com/Programming/Languages/Scripting/PHP/Q_28592569.html
 * REF: http://www.w3.org/TR/html-markup/input.number.html
 */
error_reporting(E_ALL);

/**
 * SHOW THE REQUEST INFORMATION
 */
if (!empty($_POST)) var_dump($_POST);

/**
 * CREATE THE HTML5 FORM
 */
$form = <<<EOD
<form method="post">
Number:
<input type="number" min="0.00" max="1.00" step="0.01" placeholder="0.00 to 1.00" name="n" style="width:8em;" />
<input type="submit" />
</form>
EOD;

echo $form;

Open in new window

0
 
LVL 84

Expert Comment

by:Dave Baldwin
ID: 40536950
"$PSF" is not a 'legal' name.  As told in this document http://www.w3.org/TR/1999/REC-html401-19991224/types.html#type-cdata
ID and NAME tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods (".").
Also note that any 'id's used in javascript are case sensitive.
0
 

Author Comment

by:breeze351
ID: 40538445
No joy!
I modifed the input statement to read:
echo '<input type="number" name="PSF" size = "7" min = "0.00" max = "9999.99" value="';
            echo $work;
            echo '" maxlenghth="7" step = "0.01">';

The value of $ROW[RENT] for this record is 750.00

Viewing the source in FireFox shows:

<input type="number" name="PSF" size = "7" min = "0.00" max = "9999.99" value="750.00" maxlenghth="7" step = "0.01">

The display still shows "750".  If i increment it does change to "750.01".

Any ideas?
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 84

Expert Comment

by:Dave Baldwin
ID: 40538505
In most languages, leading zeros and all zeros after the decimal point are discarded because they are meaningless.  If you want the value of '750.00' to show you will probably have to use type="text" and not number.  If you change it to '750.10', it will probably show as '750.1'.
0
 

Author Comment

by:breeze351
ID: 40538572
If I change the input type to "text", I would be hoping that the user doesn't enter "ABCDEF".
0
 
LVL 84

Accepted Solution

by:
Dave Baldwin earned 2000 total points
ID: 40541746
So what will you do?  You can't get what you want with <input type="number"...  And it works the same way in Firefox and Chrome.
0
 

Author Closing Comment

by:breeze351
ID: 40543603
I've done some searching around and it appears that using "text" I need to add a "pattern" to the input statement.  I've tried a couple of different patterns with varying results but they created other problems.

I'm going to post the same question to HTML and see what they suggest.

Thanks

Glenn
0

Featured Post

Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

Question has a verified solution.

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

Q&A with Course Creator, Mark Lassoff, on the importance of HTML5 in the career of a modern-day developer.
When you put your credit card number into a website for an online transaction, surely you know to look for signs of a secure website such as the padlock icon in the web browser or the green address bar.  This is one way to protect yourself from oth…
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).
Suggested Courses

886 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