Detri Amelia Chandra
  • HOME
  • GIS
  • HTML
  • Bootstrap
  • CSS
  • Javascript
  • Ubuntu
  • Useful Tools
    • URL Redirect Tool
    • URL Download Encryptor
No Result
View All Result
Detriamelia.com
  • HOME
  • GIS
  • HTML
  • Bootstrap
  • CSS
  • Javascript
  • Ubuntu
  • Useful Tools
    • URL Redirect Tool
    • URL Download Encryptor
No Result
View All Result
Detriamelia.com
No Result
View All Result

Application of Jquery Mask For Numbers in HTML and PHP Forms

23/04/2019
in HTML, Javascript, PHP
Application of Jquery Mask to Numbers in HTML and PHP Forms

Application of Jquery Mask to Numbers in HTML and PHP Forms

This time again we discuss the problem of numbers in PHP. The application of JQuery Mask to numbers is actually common. But there are still many of us who have not actually implemented the HTML and PHP forms. In the previous article we discussed about the Rupiah Formatting Function in PHP Numbers which explains how to display numbers in rupiah format using the php script. Well this time we will make the same thing, but using JQueryMask javascript.

JQueryMask is a JQuery plugin that is used for masking input numbers on the html form. Examples of its application are rupiah formatting, mobile number, academic year, ISBN, ISSN and so on. The JQuery Mask model itself can be adjusted according to our needs.

JQuery Mask is very important to be applied to input pages. Relating to User Friendly, JQuery Mask is very influential on the user experience so that the display will be more interesting and easier.

Immediately, to the point of discussion, let’s start the tutorial this time by reading Bismillaahirrahmaanirrahiim … ops .. something is left behind. Before starting, it’s a good idea to download the script first. Download JQuery in here, and JQueryMask Javascript you can download in here.

Ok, go ahead and copy the Source Code below:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Penerapan Jquery Mask Untuk Angka Pada Form HTML dan PHP</title>
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    </head>
    <body>
        <div class="container">
            <h1>Penerapan Jquery Mask Untuk Angka Pada Form HTML dan PHP</h1>
            <br>
            <form action="#" method="post">
                <div class="form-group">
                    <label>Rupiah (Rp)</label>
                    <input type="text" class="uang form-control">
                </div>
                <div class="form-group">
                    <label>No. Handphone</label>
                    <input type="text" class="no_hp form-control">
                </div>
                <div class="form-group">
                    <label>Tahun Pelajaran</label>
                    <input type="text" class="tapel form-control">
                </div>
            </form>
        </div>
        <nav class="navbar fixed-bottom navbar-light bg-dark text-warning">
Lihat Artikel : <a class="text-warning" title="Penerapan Jquery Mask Untuk Angka Pada Form HTML dan PHP" href="https://detriamelia.com/penerapan-jquery-mask-untuk-angka-pada-form-html-dan-php/">Penerapan Jquery Mask Untuk Angka Pada Form HTML dan PHP</a>
</nav>
<footer class="my-5 pt-5 text-muted text-center text-small">
<p class="mb-1">© 2019 Detri Amelia Chandra</p>
</footer>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
        <script src="https://cdn.rawgit.com/igorescobar/jQuery-Mask-Plugin/1ef022ab/dist/jquery.mask.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function(){
                // Format mata uang.
                $( '.uang' ).mask('0.000.000.000', {reverse: true});
                // Format nomor HP.
                $( '.no_hp' ).mask('0000−0000−0000');
                // Format tahun pelajaran.
                $( '.tapel' ).mask('0000/0000');
            })
        </script>
    </body>
</html>

For the demo, please click the link below:

[the_ad id=”651″]

DEMO JQUERY MASK DOWNLOAD SOURCE CODE

How, easy right ?! That was the article about Applying Jquery Mask to Numbers in HTML and PHP Forms. May be useful. If you have questions, please ask in the comment form below … 🙂

Tags: JavascriptJQueryJQuery Mask
ShareTweetShare

Related Posts

PHP Forms - Validation With Required Fields
PHP

14. PHP Forms – Validation With Required Fields

Hi everyone, this time we will discuss about PHP Validation using the Required Field. Not many people know, it turns...

15/02/2020
PHP Form Handling
PHP

13. New Performing PHP Form Handling

Detriamelia.Com - Running form functions in PHP is not difficult. By using the $ _POST and $ _GET methods it...

13/02/2020
Learn PHP Global Variables - Superglobals With Example
PHP

12. Learn PHP Global Variables – Superglobals With Example

On this occasion, we will discuss Global and Superglobal Variables. These variables are some that are very important to implement....

20/01/2020
PHP Array Example, Complete Editions
PHP

11. PHP Array Example, Complete Editions

Welcome back to the PHP programming learning page. This time we will discuss arrays, more precisely arrays in PHP. Arrays...

17/01/2020
Next Post
Prevent XSS Injection Attacks On PHP Easily

Prevent XSS Injection Attacks On PHP Easily

GIS Tutorial with Leafletjs (Popup and Marker Modifications)

GIS Tutorial with Leafletjs (Popup and Marker Modifications)

Comments 2

  1. Pingback: Menangkal Serangan XSS Injection Pada PHP Dengan Mudah - Detri Amelia Chandra
  2. Kaleerero says:
    3 years ago

    I score been aquatics online writer than 3 hours today, yet I never launch any gripping article like yours. It is pretty couturier sufficiency for me. In my study, if all tract owners and bloggers prefab just communication as you did, the cyberspace leave be a lot statesman serviceable than e’er before.

    Reply

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Recommended

install-apache-mysql-and-php-in-ubuntu-18-04-lts-part-2

3. How to Install Apache, MySQL and PHP in Ubuntu 18.04 LTS Part 2

11/11/2019
PHP Array Example, Complete Editions

11. PHP Array Example, Complete Editions

17/01/2020
Easy to Identify Identity Card Number (NIK) Using PHP

Easy to Identify Identity Card Number (NIK) Using PHP

27/03/2019
Prevent XSS Injection Attacks On PHP Easily

Prevent XSS Injection Attacks On PHP Easily

21/05/2019

Instagram Feed

  • Sekolah sambil bermain...
  • Produk mahasiswa semester 5 Pendidikan Teknologi Informasi STKIP Rokania..
Kran dispenser otomatis (sensor)
#arduino
#PTI Ok
#STKIPRokania
#AyoKuliahDiRokania
  • Salah satu produk mahasiswa Pendidikan Teknologi Informasi STKIP Rokania...Pemanfaatan Internet Of Thing pada Lampu dan CCTV otomatis dengan Telegram Bot..

#StkipRokania
#PendidikanTeknologiInformasi
  • "Golden Time" yang tidak bisa diputar dan diulang tetapi tersimpan di inner child nya dan diingat selamanya..
  • Selamat atas M.Kom nya yah...semoga ada Reski untuk studi selanjutnya ya...
  • HOME
  • GIS
  • HTML
  • Bootstrap
  • CSS
  • Javascript
  • Ubuntu
  • Useful Tools
Detriamelia.Com

© 2022 Detri Amelia Chandra - IT Tips and Programming Tutorials.

No Result
View All Result
  • HOME
  • GIS
  • HTML
  • Bootstrap
  • CSS
  • Javascript
  • Ubuntu
  • Useful Tools
    • URL Redirect Tool
    • URL Download Encryptor