Home > Java Script > Fungsi Pindah Baris

Fungsi Pindah Baris


Form Input Supplier

Form Input Supplier

Saya lagi mencoba membuat input data supplier sederhana, terdiri dari beberapa textbox tentunya, nah ketika kita telah selesai mengisikan sebuah data misal Kode Supplier, kursor akan pindah ke textbox Nama Supplier tanpa harus memindahkan kursornya dengan mouse alias cukup dengan menekan Enter, kursor otomatis akan pindah ke textbox berikutnya.

Script ini saya dapat dari hasil nanya2x sama Mas Andry kalo tidak salah namanya, sebab di YM-nya namanya itu he2x..

Kita buat dulu sebuah Fungsi dengan menggunakan Javascript
function nextfield(ID)
{
if (event.keyCode == 13)
document.getElementById(ID).focus();
}

Lalu bikin htmlnya

<table>
<tr>
<td>Kode Supplier</td>
<td>:</td>
<td>><input type=text name=kode_supplier onkeypress=”nextfield(‘Nama_Supplier’)”></td>
</tr>

<tr>
<td>Nama Supplier</td>
<td>:</td>
<td><input type=text name=Nama_Supplier  id=”Nama_Supplier” onkeypress=”nextfield(‘Contact_Person’)”></td>
</tr>

<tr>
<td>Contact Person</td>
<td>:</td>
<td><input type=text name=contact id=Contact_Person></td>
</tr>
</table>

Sedikit saja ya HTMLnya, itu juga sudah mewakili. Oke berikut ini penjelasannya.

Pertama – tama kita buat sebuah fungsi di Javascript dengan nama nextfield(ID), nah ID yang didalam kurung itu adalah paramater textbox yang kita kirim sehingga kursor akan pindah ke textbox yang memiliki id yang kita kirimkan tadi.

onkeypress=”nextfield(‘Nama_Supplier’)”

Event yang digunakan adalah keypress, nah di dalam fungsi dibuat kondisi apakah tombol yang kita tekan itu adalah Enter apa bukan “if (event.keyCode == 13)”, kalo benar yang ditekan adalah tombol Enter maka akan menjalankan perintah selanjutnya yaitu

“document.getElementById(ID).focus();”

mencari textbox dengan ID (getElementById(ID)) yang kita kirimkan tadi, kalo kita memasukan

onkeypress="nextfield('Nama_Supplier')

maka ketika kita menekan tombol Enter maka kursor akan menuju ke textbox Nama Supplier.

..Semoga Bermanfaat..

Categories: Java Script Tags:
  1. ngulik
    October 1, 2011 at 4:48 pm

    kl pindah ke combobox gmn boss?

  2. July 18, 2012 at 3:57 am

    bos saja coba ko ga jalan ya

  3. November 15, 2012 at 3:50 am

    kalo ga pake enter bisa ga ya?misal dibuat maxlenght 4 digit, kemudian kursor pindah ke text selanjutnya…gimana tuh gan?

  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: