MessageBox dalam JavaScript

1187

MessageBox dalam JavaScript atau pada awalnya penulis mengenalnya sebagai ‘popup box’ adalah jenis khusus dari form yang dapat menampilkan suatu informasi kepada user dan harus sepakat dengannya sebelum dapat berhubungan dengan bagian lain dari aplikasi. Yang termasuk kedalam MessageBox dalam javascript yaitu:

  1. Alert box
  2. Confirm box
  3. Prompt box

Alert Box

Biasanya digunakan untuk menampilkan informasi langsung ke user dan akan muncul berupa tombol ‘OK’ saja.

//<js

<html>

<head>

<title>Alert Box</title>

<script type=”text/javascript”>

function call_alrBox(){

alert(‘Hi, Aku adalah alert box’);

return false;

}

</script>

</head>

<body>

<h3>Alert Box</h3>

<p><input type=”button” onclick=”return call_alrBox()” value=”Tampilkan Alert Box” /></p>

<p>Ini adalah halaman web</p>

</body>

</html>

//&gt;js

Confirm Box

Biasanya digunakan untuk menampilkan konfirmasi terhadap user. Confirm Box muncul berupa tombol ‘OK’ dan ‘Cancel’. Tombol ‘OK’ akan mengembalikan nilai ‘true’ dan tombol ‘Cancel’ mengembalikan nilai ‘false’.

//&lt;js

<html>

<head>

<title>Confirm Box</title>

<script type=”text/javascript”>

function call_confBox(){

var retConfBox =confirm(“Silahkan click tombolnya”);

if(retConfBox==true){

document.getElementById(‘disp-conf’).innerHTML=”Anda menekan ‘OK’”;

}else{

document.getElementById(‘disp-conf’).innerHTML=”Anda menekan ‘Cancel’”;

}

return false;

}

</script>

</head>

<body>

<h3>Confirm Box</h3>

<p><input type=”button” onclick=”return call_confBox()” value=”Tampilkan Confirm Box” /></p>

<p id=”disp-conf”>konfirmasi anda akan muncul disini.</p>

</body>

</html>

//&gt;js

Prompt Box

Prompt Box muncul berupa input-an yang harus diisi oleh user sebelum masuk ke proses selanjutnya serta tombol ‘OK’ dan ‘Cancel’. Tombol ‘OK’ akan mengembalikan nilai yang di-input-kan oleh user dan tombol ‘Cancel’ akan mengembalikan nilai null.

//&lt;js

<html>

<head>

<title>Prompt Box</title>

<script type=”text/javascript”>

function call_prmBox(){

var retPromptBox =prompt(“Tuliskan sesuatu:”);

document.getElementById(‘disp-prm’).innerHTML =retPromptBox;

return false;

}

</script>

</head>

<body>

<h3>Prompt Box</h3>

<p><input type=”button” onclick=”return call_prmBox()” value=”Tampilkan Prompt Box” /></p>

<p id=”disp-prm”>isi propt box akan muncul disini.</p>

</body>

</html>

//&gt;js

Demo

//&lt;demojs

konfirmasi anda akan muncul disini.

isi propt box akan muncul disini.

//&gt;demojs

SHARE
Previous articlePengenalan JavaScript
Next articleCara Membuat Blog di WordPress.com
"Jangan kecewa apabila hasil yang diperoleh tidak seperti yang diharapkan, Percaya bahwa semuanya adalah kesuksesan, bukan kegagalan. Mengapa saya punya banyak kesuksesan? saya tahu banyak usaha yang gagal." - Thomas Alfa Edison -
  • jhon

    thanks sharingnya..mau nanya gan..gimana buat messagebox di php ?? misalnya untuk validasi kode mahasiswa..jadi kalau data sudah ada di database mysql, muncul pesan messagebox “Data sudah ada “, kalau belum lanjut proses selanjutnya…trima kasih

    • terima kasih atas kunjungannya….Silahkan sekarang dapat di cek di sini, semoga dapat membantu.

  • Pingback: Skrip PHP untuk Upload dan Hapus File Gambar | forum.catatanku.in()

  • mas,.. 🙂
    saya minta tolong dong,..

    bagaimana cara membuat confirm box “Apakah ingin mengganti tulisan ditombol?”, jika ditekan “OK” maka tombol yang tulisan-ny “Tulisan Tombol Belum Diganti” (tombol awal yang jika d-klik tadi akan memunculkan confirm box) akan berubah menjadi “Tulisan Tombol Diganti”, dan kalau pilih “Cancel” tidak terjadi perubahan apa2.

    Tolong yahh mas,..

    Thnx b4

  • grace

    who to show the button yes and button cancel in language malay? Yes=Ya and Cancel=Tidak? someone can help me?

  • azjifa

    maksih atas sharingnya
    mau nanya, klo prompt box terus dimunculin hasil inputannya di halaman lain bisa ga? caranya gimana ya? terima kasih atas pencerahannya

  • php_user

    mau nanya, gimana kalo mau buat message box
    misalnya ada data nama, alamat, no telp yang belum diisi..
    trs penggunaan mesage box pada link..
    mohon pencerahannya