membuat format rupiah dengan javascript

share

  • membuat format rupiah dengan javascript

    Membuat Format Rupiah dengan Javascript


    Tutorial cara membuat format rupiah dengan javascript ke dalam form input nominal secara otomatis yang dipisahkan oleh tanda titik pada tiap 3 digit angka terakhir satuan ribuan, jutaan, milyar dan seterusnya.
  • membuat format rupiah dengan javascript
    Service
    1. Complete Website
    2. Only web script
    3. Web modification
    4. Application program
    5. Free web template
    6. Free application
    7. Basic SEO
    8. Article request
    9. Tutorial programing
  • membuat format rupiah dengan javascript
    MOTO
    "Kepuasan Pelanggan adalah Prioritas kami, Sebagai Pemicu Semangat Dalam Memberikan Pelayanan Terbaik".
  • membuat format rupiah dengan javascript Teknologi dan Bahasa
    PHP-5, HTML-5, CSS3, SQL Server, MySQL Database, Access Database, Java, JavaScript, dan Visual Basic.
  • membuat format rupiah dengan javascript
    VISI
    "Menjadi penyedia layanan yang terpercaya dan maju dalam dunia Teknologi Informasi."

Membuat Format Rupiah dengan Javascript

Pada kesempatan ini kita akan belajar tutorial tentang cara membuat format rupiah dengan javascript ke dalam form input nominal secara otomatis yang dipisahkan oleh tanda titik pada tiap 3 digit angka terakhir. Maksudnya adalah ketika kita ketik angka nominal rupiah di kolom input yang berjumlah lebih dari ribuan, jutaan atau milyaran, maka otomatis akan tampil tanda titik di tiap 3 digit terakhir nominal input tersebut. Membuat format rupiah secara otomatis ini sangat dibutuhkan pada aplikasi keuangan yang mengaharuskan menampilkan pemisah satuan. Kemudian bagaimana bentuk format rupiah javascript tersebut? dan seperti apa kode javascript untuk membuat format rupiah otomatis ini.

Tutorial cara membuat format rupiah dengan javascript pada kolom input dengan pemisah 3 digit angka lengkap dengan script ini kami lakukan pada localhost menggunakan XAMPP ver 5.6 include dengan database MySQL. Untuk mengikuti tutorial ini pastikan komputer anda telah completed install web server XAMPP tersebut. Sehingga tutorial format rupiah javascript dapat diikuti dengan lancar.

Berikut langkah - langkah atau cara membuat format rupiah dengan javascript ke dalam kolom input nominal yang secara otomatis akan dipisahkan oleh tanda titik:

Membuat Format Rupiah dengan Javascript



format rupiah javascript

membuat format rupiah dengan javascript

1. Membuat Folder Direktori Project.

Folder direktori ini dapat kita buat langsung di htdocs atau bebas di mana saja karena file project bukan dalam script php, sebagai contoh nama folder nya adalah "rupiah-javascript". Kegunaan folder ini adalah untuk menyimpan seluruh file yang akan kita buat untuk menjalankan tutorial membuat format rupiah dengan javascript.

2. Membuat Form Input Format Rupiah Javascript

Sebagaimana telah dijelaskan bahwa format rupiah otomatis ini berjalan pada kolom input nominal angka yang akan dipisahkan oleh tanda titik pada setiap 3 digit angka satuan. Sehingga hasilnya akan terlihat langsung saat kita mengetik nominal rupiah nya pada kolom input yang tersedia. Form input format rupiah ini kita buat sebagai homepage atau index, javascript untuk memproses format rupiah juga akan kita buat pada file ini.

Berikut adalah kode javascript nya, simpan sebagai index.html

<html>
<head>
	<title>Membuat Format Rupiah Dengan Javascript - Tutorial</title>
	<style type="text/css">
	body {
		font-family: sans-serif;
	}
	.kotak {
		width: 300px;
		padding: 5px;
	}
	p{
		margin-bottom: 20px;
		color: #0004ff;
	}
	input {
		text-align: right;
		width: 100%;
		margin-bottom: 20px;
		margin-top: 10px;
		padding: 7px 10px;
		font-size: 18px;
	}
	</style>
</head>
<body> 
	<h2>Membuat Format Rupiah dengan Javascript</h2>
	<h4>Form Input Nominal:</h4>
	<div class="kotak">
		Nominal: <input type="text" id="rupiah"/>
	</div>
	<script type="text/javascript">
		var rupiah = document.getElementById('rupiah');
		rupiah.addEventListener('keyup', function(e){
			// tambahkan 'Rp.' pada saat ketik nominal di form kolom input
			// gunakan fungsi formatRupiah() untuk mengubah nominal angka yang di ketik menjadi format angka
			rupiah.value = formatRupiah(this.value, 'Rp. ');
		});
		/* Fungsi formatRupiah */
		function formatRupiah(angka, prefix){
			var number_string = angka.replace(/[^,\d]/g, '').toString(),
			split   		= number_string.split(','),
			sisa     		= split[0].length % 3,
			rupiah     		= split[0].substr(0, sisa),
			ribuan     		= split[0].substr(sisa).match(/\d{3}/gi);
 
			// tambahkan titik jika yang di input sudah menjadi angka satuan ribuan
			if(ribuan){
				separator = sisa ? '.' : '';
				rupiah += separator + ribuan.join('.');
			}
 
			rupiah = split[1] != undefined ? rupiah + ',' + split[1] : rupiah;
			return prefix == undefined ? rupiah : (rupiah ? 'Rp. ' + rupiah : '');
		}
	</script>
</body>
</html>

Kode untuk membuat format rupiah dengan javascript yang di embed ke dalam html di atas jika dijalankan akan menampilkan form input angka. Kemudian ketika diketik akan menampilkan format rupiah dengan tanda titik pada tiap satuan ribuan, ratusan ribu, jutaan, milyaran dan seterusnya.

Jika dijalankan pada web browser akan menampilkan interface format rupiah javascript seperti gambar di bawah ini.

membuat format rupiah dengan javascript
Form Input Format Rupiah Javascript

Form input format rupiah dalam kolom tersebut terletak pada baris kode ke-29 hingga ke-31, yaitu pada kode html berikut ini.

<div class="kotak">
	Nominal: <input type="text" id="rupiah"/>
</div>

Perhatikan atribut-atribut pada tag input di atas terdapat id="rupiah", hal ini harus diperhatikan pada variable di kode javascript. Nama id harus sama dengan getElementById di kode javascript yaitu pada bagian var rupiah = document.getElementById('rupiah');.

Untuk membuktikan tutorial cara membuat format rupiah dengan javascript berhasil atau tidak, silahkan ketik angka berapapun hingga melebihi satuan ribuan. Seharusnya menampilkan format rupiah sebagaimana gambar di bawah ini.

membuat format rupiah dengan javascript
Format Rupiah Javascript Berhasil

Sampai pada tahap ini tutorial cara membuat format rupiah dengan javascript telah selesai dan berhasil di jalankan pada web browser. Inti dari kode javascript yang merubah format angka menjadi format rupiah menggunakan function terletak mulai pada baris kode ke-33 hingga baris kode ke-55, yaitu pada bagian kode javascript berikut ini.

var rupiah = document.getElementById('rupiah');
rupiah.addEventListener('keyup', function(e){
	// tambahkan 'Rp.' pada saat ketik nominal di form kolom input
	// gunakan fungsi formatRupiah() untuk mengubah nominal angka yang di ketik menjadi format angka
	rupiah.value = formatRupiah(this.value, 'Rp. ');
});
/* Fungsi formatRupiah */
function formatRupiah(angka, prefix){
	var number_string = angka.replace(/[^,\d]/g, '').toString(),
	split   		= number_string.split(','),
	sisa     		= split[0].length % 3,
	rupiah     		= split[0].substr(0, sisa),
	ribuan     		= split[0].substr(sisa).match(/\d{3}/gi);
 
	// tambahkan titik jika yang di input sudah menjadi angka satuan ribuan
	if(ribuan){
		separator = sisa ? '.' : '';
		rupiah += separator + ribuan.join('.');
	}
 
	rupiah = split[1] != undefined ? rupiah + ',' + split[1] : rupiah;
	return prefix == undefined ? rupiah : (rupiah ? 'Rp. ' + rupiah : '');
}

Tutorial Membuat Format Rupiah dengan Javascript

Sekian penjelasan dari kami tentang tutorial bagaimana cara membuat format rupiah dengan javascript menggunakan function formatRupiah() lengkap dengan source code nya. Untuk mendapatkan source code nya Anda dapat langsung copas melalui sumber kode pada artikel di atas, jika terjadi gagal atau error atau tidak berjalan baik mohon hubungi kami melalui SMS atau email atau melalui form komentar dan obrolan. Semoga dapat membantu.

Baca juga :


Membuat Format Rupiah dengan Javascript

Tags: format rupiah dengan javascript, membuat format rupiah javascript, membuat format rupiah, format rupiah javascript, membuat format rupiah dengan javascript


Reliable

membuat format rupiah dengan javascript

Advertise

membuat format rupiah dengan javascript

Payment & Donation

membuat format rupiah dengan javascript

Rekening BCA : 343 1156 006

a/n : Andi Hatmoko

Rekening MANDIRI : 13300 11921 079

a/n : Andi Hatmoko

membuat format rupiah dengan javascript

Account :

andihatmoko@gmail.com

Live Chat

HeatherMip2020-07-14, 23:01 pm
Dear Sir_ mdm, How are you? We supply Professional surveillance & medical products_ Moldex, makrite and 3M
Feria2020-07-10, 16:50 pm
Untuk aplikasi penyimpanan berkas pengajuan administrasi capil, KK dan KTP berapa biaya nya ??
nugraha2020-07-10, 09:46 am
gan, cara dapat aplikasi simpeg7 gimana?
Adi2020-07-08, 19:25 pm
Kami instansi BUMN mau beli full aplikasi Arsip Surat Berbasis Web SIPAS_ Harganya berapa ya? Dan Caranya gimana ya?
kasmono2020-07-08, 15:09 pm
mas, minta link donlot untuk script kode otomatisnya_ trims
Asep Gunawan2020-07-08, 09:50 am
Mau tanya versi Full Aplikasi stok barang
Iwan2020-07-08, 09:40 am
Berapa harga Program Aplikasi Manajemen Anggota
ferry 2020-06-24, 13:51 pm
apakah saya bisa mendapatkan aplikasi SPPD exel sederhana
adam2020-06-24, 11:02 am
apakah bisa mengirimkan biaya pembuatan aplikasi E_arsip_ terima kasih
nina2020-06-23, 14:59 pm
siang_ _ _ untuk aplikasi pengarsipan adakah contoh pengarsipan di divisi internal audit_ _ _ saya mau lihat dahulu_ _ _
Shany2020-06-19, 20:43 pm
Untuk aplikasi persediaan ini apakah masih bisa di customize dengan warna dan ukuran?
adi2020-06-17, 22:15 pm
Assalamualaikum WRWB
Triyanto2020-06-17, 15:02 pm
Halo admin,,,saya tertarik dengan aplikasi cutinya,,harganya berapa
fadhil2020-06-17, 09:53 am
bisakan anda mengirimkan penawaran ke email saya tentang program aplikasi e_ arsip dan data pegawai
jiching2020-06-12, 14:40 pm
Untuk mendownload script live chat bgmn?
aa2020-06-08, 11:11 am
brp harga untuk aplikasi Program Aplikasi Inventory Barang Gudang
Budhi Dwipa2020-06-08, 10:48 am
halo admin saya tertarik dengan aplikasi simpeg 7 apakah ada nomor wa yg bisa dihubungi ?
abu hafidz2020-06-04, 14:23 pm
kalau untuk menampilkan hanya data yang ada di table lain gimana ya ? mohon bantuannya
Muhlis2020-06-04, 12:09 pm
saya berminat software pengajuan judul skripsi, saya ingin membahas harganya jida chat ini di respon ke Email
nic2020-06-04, 07:49 am
brp harga e_ arsip
NUR CAHYANIG2020-06-03, 15:20 pm
Berapa harga untuk software koperasi?
Arif Mahmudi2020-06-03, 11:00 am
Assalamualaikum
Shaiful A2020-05-27, 10:22 am
brp harga aplikasi koperasinya bro ? email me or call 08114700475
nanda2020-05-24, 22:34 pm
ini car ameliat cht pada code nya gmnya?
mugiarto2020-05-09, 08:33 am
bgmana cara beli program iin, apakah termasuk souce code nya ??
Muhammad Zae2020-04-30, 10:14 am
Bagaimana cara membeli aplikasi ini?
willbertus2020-04-28, 16:49 pm
Admin mohon info utk Aplikasi Dokumen Kantor gimana cara dapatnya secara komplit_ Minat_ thks
Galih2020-04-27, 23:18 pm
Min, bagaimana cara mendapatkan source code aplikasi cuti?
ariel2020-04-18, 11:02 am
kami berminat dgn aplikasi SPPD berapa harga gan?
Aris2020-04-12, 08:45 am
plikasi Arsip Surat Berbasis Web SIPAS harganya brp?dpt source code y
Wida Widiyaw2020-04-11, 12:01 pm
Ingin Mengubah Tanggal Lahir Akun Google
Zulfikri2020-04-10, 10:33 am
Mau tanya biayanya berapa kalau bikin aplikasi SPPD lengkap
willy2020-04-06, 22:59 pm
cara dapat password _ rar dari file aplikasi inventory barangnya gmn ?
Asih2020-03-16, 00:31 am
Bagaimana cara mendapatkan license office 365 ? Makasih
irfan2020-03-14, 10:18 am
selamat pagi pak,apa program sewa mobil ini bisa castem sesuai dengan kebutuhan kami
Aji2020-03-10, 11:39 am
Ini tidak bisa di download min?di info saat download ada notif untuk hubungi admin untuk download aplikasi hrd web
Hamdan2020-03-09, 16:05 pm
Berapa harga membuat aplikasi rental atau penyewaan kamera berbasis web?
rokbi2020-03-09, 09:19 am
kami berniat mau order aplikasi offline simpan pinjam cu? gmna cara dan berapa bugjed nya?
feliks hatam2020-03-07, 16:17 pm
konsultasi pemesanan blog
Fatimah2020-03-06, 14:40 pm
Berapa aplikasi KTP
Muhammad2020-02-26, 20:59 pm
Assalamualaikum min, cara mendapatkan aplikasi ini gmana ya min?
rizki firman2020-02-25, 12:05 pm
mau tanya untuk spk metode fuzzy berapa ya? tentang pemilihan tempat wisata
DAVID2020-02-15, 11:14 am
Aplikasi HRD brp gan_
Rendhi roman2020-02-13, 22:38 pm
Untuk Sistem Rekrutment BIsa_
windra2020-02-13, 14:43 pm
untuk harga program data karyawan brp
adam2020-02-13, 11:59 am
apakah ada aplikasi system harga pasar_
FERY DIANTA 2020-02-08, 09:51 am
gan mau nanya harga simpeg versi 7 nya_
rudy2020-02-07, 15:58 pm
berapa harga sw management anggota pak_
Manyu2020-02-07, 14:44 pm
berapa harga aplikasi sppd nya_ pls respon cepat melalui email ya, saya berminat mau beli
naomi2020-02-04, 15:08 pm
halo, untuk aplikasi e ktp nya ada kendala saat mendownload, mohon bantuannya
yadi2020-02-01, 19:34 pm
harga Aplikasi Simpan Pinjam Berapa
hendi 2020-01-25, 18:59 pm
untuk afk sofware developer property penjualan di harga berapa _
Abdurrahman 2020-01-25, 01:08 am
Tolong syarat dan ketentuan utk mendapatkan software koperasi jasa (bukan simpan pinjam) dan software UKM Terima kasih
Dinollah Rai2020-01-24, 11:37 am
aplikasi simpan pinjam tdk free kah
Suwarto plaz2020-01-21, 15:45 pm
berapa harga aplikasi cuti online?
Heri Nurjono2020-01-20, 09:45 am
Berapa harga Aplikasi data anggota?
riau2020-01-19, 19:49 pm
halo.... gan... bisa gak di ubah menjadi KTP menjadi SIM ?
wid2020-01-16, 13:26 pm
gan aplikasi simpeg bisakah kita download demonnya dulu

Post your chat:


Name



Email



Chat



Confirm you are NOT a spammer

 
membuat format rupiah dengan javascript