Membuat Digit Nominal Angka dengan Javascript



Latar belakang

Untuk membuat aplikasi keuangan berbasis web, kita membutuhkan tampilan untuk memudahkan user dalam menginput nilai uang. misalnya nilai 150000 saat di input akan terdapat tanda titik pemisah setiap 3 digit menjadi 1.500.000. namn ketika di simpan di database, nilainya tetap tanpa titik pemisah.

Coding Javascript

function kurensi(nilai)
{
bk = nilai.replace(/[^\d]/g,””);
ck = “”;
panjangk = bk.length;
j = 0;
for (i = panjangk; i > 0; i–)
{
j = j + 1;
if (((j % 3) == 1) && (j != 1))
{
ck = bk.substr(i-1,1) + “.” + ck;
xk = bk;
}
else
{
ck = bk.substr(i-1,1) + ck;
xk = bk;
}
}
return ck;
}

function ri32()
{
ttm = document.getElementById( ‘postform’ ).elements[‘jumlah_transaksi’].value;
strtt= ttm.toString();
kttm = kurensi(strtt);

document.getElementById( ‘postform’ ).elements[‘jumlah_transaksi’].value = kttm;
}

Coding PHP

<?php
if(isset($_POST[‘submit’])){
$nilai=str_replace(“.”,””,$_POST[‘jumlah_transaksi’]);
echo “Nilai Sebenarnya : “.$nilai;
}else{
unset($_POST[‘submit’]);
}
?>

<html>
<head>
<title>Ri32 Community</title>
http://ri32-fungsi.js
</head>
<body onLoad=”document.postform.elements[‘jumlah_transaksi’].focus();”>

<form id=”postform” name=”postform” method=”post” action=”index.php”>
<input style=”text-align:right;” name=”jumlah_transaksi” onKeyup=”ri32();” value=0>
<input type=”submit” name=”submit” value=”Kirim”>
</form>

</body>
</html>

Download

http://www.4shared.com/zip/_fIDVd2L/bilangan-ri32.html

Sekian artikel dari saya semoga bermanfaat untuk teman-teman dan anda semua…aamiin

Cibubur, 4-6-2012

GusnaNuri

Advertisements

Membuat Mega Menu dengan Javascript


Latar Belakang

Mungkin teman-teman pernah mengunjungi situs bhineka.com. di menu atas terdapat menu yang kita di mouseover muncul banyak sub menu. menu seperti itu disebut dengan Mega Menu.

Mega Menu merupakan perkembangan menu drop down, dan terdiri dari beberapa kolom menu. Mega Menu cocok dipakai untuk menampilkan menu Katalog atau menu yang terdapat banyak sub menu nya.

Download

http://www.4shared.com/zip/G-g8jhID/megamenu-ri32.html

Sekian artikel dari saya semoga bermanfaat untuk teman-teman dan anda semua…aamiin

Cibubur, 5-5-2012

NuriGusna

Membuat program sandi morse dengan javascript


Latar Belakang :

Waktu saya belajar Pramuka di MTs Al I’anah, saya suka dengan pelajaran sandi karena tidak semua orang dapat membacanya seperti konsep enkripsi. walaupun beberapa sandi sudah menjadi standar komunikasi seperti sandi morse.

Pada artikel ini saya akan membahas tentang aplikasi sandi morse yang dibuat dengan menggunakan javacsript. aplikasi sederhana ini dapat menterjemahkan dari teks menjadi sandi morse ataupun sebaliknya dari sandi morse ke teks.

Belajar Sandi Morse

Untuk memudahkan belajar dan mengkhafal sandi morse, teman-teman dapat membaca artikel cara cepat hafal sandi morse

Sandi Morse ke Teks

function code2Text()
{
var ced3 = “.- +”, i, d, ced5, ced9=””;
var ced4 = window.document.morse.input;
var ced1 = window.document.morse.output;
var ced2 = ced4.value.length;

for(ced5=0; ced5<ced2; ced5++)
{
switch (ced4.value.charAt(ced5))
{
case ‘.’:{ced9 += “.”; break;}
case ‘-‘:{ced9 += “-“; break;}
case ‘+’:{ced1.value += ” “; break;};
case ‘ ‘:
{switch(ced9)
{
case ‘.-‘:{ced1.value +=”a”; ced9=””; break;}
case ‘-…’:{ced1.value +=”b”; ced9=””; break;}
case ‘-.-.’:{ced1.value +=”c”; ced9=””; break;}
case ‘-..’:{ced1.value +=”d”; ced9=””; break;}
case ‘.’:{ced1.value +=”e”; ced9=””; break;}
case ‘..-.’:{ced1.value +=”f”; ced9=””; break;}
case ‘–.’:{ced1.value +=”g”; ced9=””; break;}
case ‘….’:{ced1.value +=”h”; ced9=””; break;}
case ‘..’:{ced1.value +=”i”; ced9=””; break;}
case ‘.—‘:{ced1.value +=”j”; ced9=””; break;}
case ‘-.-‘:{ced1.value +=”k”; ced9=””; break;}
case ‘–…’:{ced1.value +=”7″; ced9=””; break;}
case ‘—..’:{ced1.value +=”8″; ced9=””; break;}
case ‘—-.’:{ced1.value +=”9″; ced9=””; break;}
}break;
}
}
}
}

Teks ke Sandi Morse

function text2Code()
{
var ced3 = “abcdefghijklmnopqrstuvwxyz. “, i, d, f;
var ced4 = window.document.morse.input.value.toLowerCase();
var ced1 = window.document.morse.output;
var ced2 = ced4.length;

for(i=0; i<ced2; i++)
{
i = ced4.charAt(i);
if(ced3.indexOf (i) ==-1)
{
alert(“Please use only letters.”);
break;
}
else
{
for(f=0; f<ced2; f++)
{
switch (ced4.charAt(f))
{
case ‘a’:{ced1.value += ” .- “; break;}
case ‘b’:{ced1.value += ” -… “; break;}
case ‘c’:{ced1.value += ” -.-. “; break;}
case ‘d’:{ced1.value += ” -.. “; break;}
case ‘e’:{ced1.value += ” . “; break;}
case ‘f’:{ced1.value += ” ..-. “; break;}
case ‘2’:{ced1.value += ” ..— “; break;}
case ‘3’:{ced1.value += ” …– “; break;}
case ‘4’:{ced1.value += ” ….- “; break;}
case ‘5’:{ced1.value += ” ….. “; break;}
case ‘6’:{ced1.value += ” -…. “; break;}
case ‘7’:{ced1.value += ” –… “; break;}
case ‘8’:{ced1.value += ” —.. “; break;}
case ‘9’:{ced1.value += ” —-. “; break;}
}
}
}
}
}

Download Aplikasi

http://www.4shared.com/zip/k4bn68W9/sandi-morse-ri32.html

Sekian artikel dari saya semoga dapat bermanfaat untuk teman-teman dan anda semua…aamiin

Depok, 10-02-2012

noname

Javascript untuk bookmark dan proteksi copy halaman web



Latar Belakang

Dalam artikel ini saya akan menjelaskan 2 fungsi javascript yang bisa kita gunakan dalam membuat sebuah halaman web. yaitu fungsi bookmark dan fungsi agar halaman web kita tidak bisa di copy. dengan catatan pengaturan javascript di browsernya dalam keadaan aktif.

Bookmark adalah kegiatan user menandai halaman web di sebuah web browser untuk suatu saat nanti di kunjungi kembali. Untuk bookmark halaman web biasanya kita menggunakan shortcut ctrl+D pada web browser. javascript juga menyediakan fungsi seperti itu. tinggal klik link maka browser khususnya mozila akan muncul kotak bookmark.

Fungsi Bookmark

function addBookmark()
{
bookmarkurl = “http://www.ri32.wordpress.com&#8221;;
bookmarktitle=”Blog Ri32″;
if (document.all)
window.external.AddFavorite(bookmarkurl,bookmarktitle)
else if ( window.sidebar ) {
window.sidebar.addPanel(bookmarktitle, bookmarkurl,””);
}
}

Fungsi Proteksi

if (typeof document.onselectstart!=”undefined”) {
document.onselectstart=new Function (“return false”);
}
else{
document.onmousedown=new Function (“return false”);
document.onmouseup=new Function (“return true”);
}

Klik kanan Copyright

document.oncontextmenu = new Function(“alert(‘Copyright by Agus Sumarna – WebGIS’);return false”);

Implementasi

<body>
Don’t copy this page!
<a href=”javascript:addBookmark();”>Bookmark this page!</a>
</body>

Download

http://www.4shared.com/zip/7tnMvPag/Javascript-ri32.html

Sekian artikel dari saya semoga bermanfaat untuk teman-teman dan anda semua…aamiin

Depok, 22-12-2011

noname

Input Textfield menggunakan Combobox dan window PopUp Javascript


Latar Belakang

Artikel ini menjelaskan tentang cara menginput suatu nilai ke dalam textfield yang datanya bersumber dari sebuah combobox atau window popup. ini berguna untuk para programmer menangani masalah penginputan data pada sebuah web menggunakan javascript.

dalam artikel ini saya menyajikan 3 file javascript yaitu :

  1. input_combobox.html yang digunakan untuk menginput nilai ke textfield yang sumber datanaya dari sebuah combobox.
  2. input_popup.html yang digunakan untuk menginput nilai ke textfield yang sumber datanya dari sebuah window popup.
  3. input_textarea.html yang digunakan untuk menginput nilai ke textarea. terdapat  script untuk menghitung jumlah karakter dan jumlah maksimum karakter yang di input adalah 100 karakter.

Input Window PopUp

Script Input Textarea

function hitung_karakter()
{
var wert,max;
max = 100
wert = max-(document.form_input.txt_tulisan.value.length);
if(wert

Script Input Combobox

function tambah_text() {
var x = document.getElementById(“combro”);
var y = document.getElementById(“tempe_txt”);

getCmb = x.value;
y.value = getCmb;
}

Script Input PopUp

function bukaWindow() {
var myWindow=window.open(‘popup.html’,’windowRef’,’width=200,height=300′);
if (!myWindow.opener) myWindow.opener = self;
}

Download

http://www.4shared.com/file/Go0U714u/input_javascript.html

Sekian artikel dari saya semoga bermanfaat untuk teman-teman dan anda semua…aamiin

Depok, 28-06-2011

noname

Membuat Timer Countdown pada Ujian Online


Pertanyaan

mas saya mw ditambahin wktu pengerjaan soal gk bisa2 ya jadi pad saat lagi ngerjai soal klo waktu ya abis maka muncul tampilan “maaf waktu abis ” kira2 pnya script ya g ?

Coding (file timer.html)

<html>
<head>
<title>Timer Ujian Online</title>

//120 detik
const timer = 120;
var count = timer;
function startClock()
{
if (count>0) count–;
document.getElementById(“status”).innerHTML = count;
setTimeout(“startClock()”, 1000);

if(count==0)
{
alert(“Waktu Anda telah habis”);
document.location.href=”selesai.html”;
//count=0;
}
}

</head>
<body onLoad=”startClock()”>
Segera submit jawaban anda sebelum waktunya selesai. &raquo; Sisa waktu ujian anda adalah : … <b><span id=status></span> detik</b>
</body>
</html>

Memakai Menit

<html>
<head>
<title>Timer Ujian Online</title>

var detik=”120″
if (document.images)
{
parselimit=detik
}
function begintimer()
{
if (!document.images)
return
if (parselimit==1)
window.location=”jawab_soal.php”
else
{
parselimit-=1
curmin=Math.floor(parselimit/60)
cursec=parselimit%60
if (curmin!=0)
curtime=curmin+”:”+cursec+””
else
curtime=cursec+” detik”
document.getElementById(“servertime”).innerHTML=curtime
setTimeout(“begintimer()”,1000)
}
}

</head>
<body onLoad=”begintimer()”>
Segera submit jawaban anda sebelum waktunya selesai. &raquo; Sisa waktu
ujian anda adalah : … <b>

</b>
</body>
</html>

Download

http://www.4shared.com/file/X1V1IQVG/timedown.html

Sekian artikel dari saya semoga bermanfaat untuk teman-teman dan anda semua…aamin

Depok, 17-03-2011

noname

Membuat Kalkulator Sederhana dengan Javascript


Ada teman yang bertanya : “bagaimana cara membuat kalkulator sederhana menggunakan javascript?”. Maka pada artikel kali ini saya akan menjelaskan cara membuat aplikasi kalender dengan menggunakan javascript.

Inti dari program ini adalah file “calculate.js” yang digunakan untuk memproses inputan angka dari user dan menampilkan kembali hasilnya. untuk lebih jelasnya teman-teman bisa mendownload contoh programnya.

Potongan Script

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”&gt;
<html xmlns=”http://www.w3.org/1999/xhtml”&gt;
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″ />
<title>Kalkulator Ri32</title>
http://calculate.js
</head>
<body>
<form name=”calculator”>
<table border=”0″ cellpadding=”2″ cellspacing=”0″ background=”/images/background.jpg” width=”233″ height=”259″>
<tr><td align=”center” style=”padding-bottom:0px;padding-top:15px”><input type=”text” name=”win” value=”0″ style=”height:30px;width:190px;text-align:right;font-size:20px;font-weight:bold;border:1px solid #666666;padding-right:2px;” maxlength=’15’></td></tr>
<tr><td>
<table border=”0″ cellpadding=”5″ cellspacing=”1″ align=”center”>
<tr><td style=”padding-top:0px”><input type=”button” value=”CE” style=”width:40px” onClick=”calc(‘CE’)”></td>
<td style=”padding-top:0px”><input type=”button” value=”C” style=”width:40px” onClick=”calc(‘C’)”></td>
<td style=”padding-top:0px”><input type=”button” value=”+/-” style=”width:40px” onClick=”calc(‘+/-‘)”></td>
<td style=”padding-top:0px”><input type=”button” value=”%” style=”width:40px” onClick=”calc(‘%’)”></td></tr>

<tr><td><input type=”button” value=”7″ style=”width:40px” onClick=”calc(‘7’)”></td>
<td><input type=”button” value=”8″ style=”width:40px” onClick=”calc(‘8’)”></td>
<td><input type=”button” value=”9″ style=”width:40px” onClick=”calc(‘9’)”></td>
<td><input type=”button” value=”/” style=”width:40px” onClick=”calc(‘/’)”></td></tr>

<tr><td><input type=”button” value=”4″ style=”width:40px” onClick=”calc(‘4’)”></td>
<td><input type=”button” value=”5″ style=”width:40px” onClick=”calc(‘5’)”></td>
<td><input type=”button” value=”6″ style=”width:40px” onClick=”calc(‘6’)”></td>
<td><input type=”button” value=”x” style=”width:40px” onClick=”calc(‘*’)”></td></tr>

<tr><td><input type=”button” value=”1″ style=”width:40px” onClick=”calc(‘1’)”></td>
<td><input type=”button” value=”2″ style=”width:40px” onClick=”calc(‘2’)”></td>

<td><input type=”button” value=”3″ style=”width:40px” onClick=”calc(‘3’)”></td>
<td><input type=”button” value=”-” style=”width:40px” onClick=”calc(‘-‘)”></td></tr>

<tr><td><input type=”button” value=”0″ style=”width:40px” onClick=”calc(‘0’)”></td>
<td><input type=”button” value=”.” style=”width:40px” onClick=”calc(‘.’)”></td>
<td><input type=”button” value=”=” style=”width:40px” onClick=”calc(‘=’)”></td>
<td><input type=”button” value=”+” style=”width:40px” onClick=”calc(‘+’)”></td></tr>
</table>
</td></tr>
</table>
</form>
</body>
</html>

Download

http://www.4shared.com/file/qdGHYkIL/kalkulator.html

Sekian tutorial dari saya, semoga bermanfaat untuk teman-teman dan anda semua..aamin

Depok, 10-01-2011

noname

%d bloggers like this: