Masino Sinaga

Web Development and PHPMaker

Anda di sini: Beranda / PHPMaker / Mengotomatiskan Field Terisi Berdasarkan Field Lain di Aplikasi Web dari PHPMaker

Mengotomatiskan Field Terisi Berdasarkan Field Lain di Aplikasi Web dari PHPMaker

oleh 54 Komentar

Bukan PHPMaker namanya jika tidak bisa memberi kemudahan kepada Web Developer untuk membuat fitur yang memungkinkan Pengguna untuk mengisi field tertentu (Field Tujuan) berdasarkan nilai yang terdapat di field lainnya (Field Asal). Hal ini sering disebut dengan istilah Auto fill yang artinya Otomatis mengisi. Istilah yang sama tadi ternyata digunakan juga di PHPMaker.

Sebenarnya fitur Auto fill ini sudah diuraikan dengan sangat detail melalui menu Help pada aplikasi PHPMaker. Anda dapat membaca topik Field Setup -> Using Lookup Table for Edit Tag (Text/Radio/Checkbox/Select) -> Auto fill. Saya tidak akan membahas konten Help tersebut di sini. Tapi, saya berharap Anda membaca topik tersebut dengan teliti, supaya benar-benar memahami konsep dan cara mengimplementasikannya di Aplikasi Web yang Anda bangun.

Artikel ini hanya ingin menekankan mengenai fleksibilitas PHPMaker yang memungkinkan Web Developer untuk menggunakan control Textbox daripada Combobox untuk memicu terjadinya event Auto fill tersebut.

PHPMaker juga sudah menyediakan file demo project untuk mengimplementasikan fitur Auto fill ini. Silahkan buka menu Order Details di Aplikasi Web yang dihasilkan oleh file demo project tadi. Melalui file demo project, diharapkan Anda semakin memahami syarat-syarat apa saja yang harus dipenuhi agar fitur ini bisa diterapkan di Aplikasi Web Anda. Salah satunya, Anda harus mengikuti konsep struktur tabel yang disarankan oleh PHPMaker (meskipun terkesan adanya redudansi data di sana).

Biasanya, fitur Auto fill di-trigger atau dipicu oleh control Combobox atau Select Option. Artinya, ketika Pengguna memilih salah satu data di Combobox (Field Asal), maka nilai di Field yang terdapat di bawahnya (Field Tujuan) akan otomatis terisi berdasarkan nilai yang terpilih tadi. Demikian juga halnya pada demo project tadi, menggunakan control Combobox pada field ProductID (Field Asal) untuk memicu event Auto fill pada field UnitPrice (Field Tujuan).

Harus diakui bahwa tidak semua business logic menggunakan Combobox sebagai control untuk memicu event Auto fill tadi. Ada kalanya kita harus menggunakan control Textbox. Mengapa? Karena jika menggunakan Combobox, maka akan sangat merepotkan Pengguna apabila jumlah pilihan di Combobox relatif banyak (ratusan atau bahkan ribuan Record).

Dengan menggunakan control Textbox, maka itu artinya Pengguna cukup hanya mengetikkan beberapa karakter saja di Field Asal. Selanjutnya sistem akan menampilkan satu/beberapa pilihan di Field Tujuan. Tentu saja dalam hal ini harus ada batasan, pada saat apa event Auto fill tadi akan dibangkitkan. Apakah saat Pengguna baru mengetikkan sebagaian karakter, saat Pengguna selesai mengetikkan semua karakter, atau saat Pengguna menekan Enter, dan seterusnya.

Secara intuisi, seharusnya setelah Pengguna memilih satu pilihan lalu menekan Enter, barulah event Auto fill terjadi. Karena kalau saat Pengguna baru mengetikkan sebagian karakter di Field Asal, maka ada kemungkinan data di Field Tujuan masih mengacu kepada lebih dari satu Record. Kalau saat Pengguna sudah selesai mengetikkan seluruh karakter, maka sistem belum memahami pilihan data yang mana yang akan terisi di Field Tujuan. Jadi, yang lebih tepat saat Pengguna menekan Enter setelah menentukan satu pilihan di Field Tujuan tersebut.

Pertanyaannya adalah, apakah PHPMaker bisa mengatasi hal tersebut? Hehehe… sekali lagi saya mau bilang, bahwa bukan PHPMaker namanya jika tidak mengatasi kebutuhan tadi. Jawabannya, tentu saja: BISA! Lalu bagaimana caranya?

Hanya dua langkah saja:

  1. Ganti control Combobox menjadi Textbox, dari panel Edit Tag, dengan memilih Text.
  2. Aktifkan pilihan Force selection.

Sedangkan untuk pengaturan Lookup Table dan yang lainnya tidak perlu Anda ubah. Terakhir, generate ulang semua file script dari PHPMaker seperti biasa. Setelah proses pembangkitan file script selesai dilakukan oleh PHPMaker, jalankan Aplikasi Web dari browser favorit Anda.

Pastikan bahwa sekarang Pengguna dapat mengetikkan data di Field Asal (yang tadinya Combobox sekarang menjadi Textbox). Jika berdasarkan beberapa karakter yang diketik tadi sistem menemukan data yang valid di Database, maka sistem akan menampilkan semacam Auto-Complete (jendela kecil berisi pilihan seperti ketika kita mengetikkan beberapa karakter di kotak pencarian Google) di Field Tujuan.

Pengguna tinggal memilih salah satu pilihan yang terdapat di Field Tujuan (dengan tombol panah bawah), lalu menekan Enter di keyboard. Atau, bisa juga dengan cara memilihnya menggunakan mouse di keyboard. Selanjutnya, nilai di Field Tujuan tadi akan otomatis terisi berdasarkan pilihan di Field Asal.

Betapa mudah dan cepatnya bukan? Bayangkanlah jika Anda harus melakukan hal ini secara manual. Berapa lama waktu yang Anda butuhkan? Belum lagi stress-nya Anda harus mencari-cari script yang terkait melalui Google. Itupun belum tentu langsung ketemu. Belum lagi usaha yang harus Anda lakukan untuk mengetes dan memastikan fitur ini berjalan di Aplikasi Web Anda! Hohoho (Sinterklass mode on), hehe…

Wow! PHPMaker, lagi-lagi, benar-benar terbukti sangat powerful, sekaligus flexible! Beruntung sekalilah Anda jika sudah menggunakan PHPMaker. Bagi yang belum, sudah saatnya Anda menggunakan PHPMaker mulai sekarang. Tinggalkan cara-cara membangun Aplikasi Web yang masih kuno, yang masih menulis kode di file script di sisi Aplikasi Web Anda, yang akan menghabiskan waktu Anda dengan percuma!

Masino Sinaga

Web Developer pengguna PHPMaker untuk membangun Aplikasi Web sejak tahun 2004. Sampai sekarang masih aktif dan rajin membagikan pengalamannya menggunakan PHPMaker melalui situs masinosinaga.com, ilovephpmaker.com, dan phpmakerprojects.com.

Komentar

  1. Pak masino, maaf mau minta solusi ini! Bagaimana jika kita harus auto fill dari beberapa record kedalam satu 1 record dengan menggunakan pemisah “/” atau “-” ? Trima kasih sebelumnya pak. Sukses selalu buat pak masino

    Balas

  2. Pak masino saya mau tanya, kalo menggunakan auto fill, tapi ada karakter yang di field asal yang harus di filter terlebih dahulu bagaimana caranya?

    Balas

    • Tinggal definisikan saja string filter yang Anda inginkan pada property Filter di panel Lookup Table dari Fields setup.

      Silahkan baca topik Using Lookup Table for Edit Tag (Text/Radio/Checkbox/Select) di bawah topik Field Setup pada menu Help PHPMaker untuk informasi lebih lanjut.

      Balas

      • Pak saya , buat Filter untuk melakukan FIlter pada sebuah Auto Fill pada sebuah Tabel Transaksi agar Hanya memunuculkan data dengan Kriteria :
        Status = 0 dan Bagian = ‘Bagian dari User yang Login’.
        Kode nya seperti ini :
        (“`status`= ‘0’”) AND (“`bagian`= CurrentUserInfo(bagian)”)

        untuk Status nya sudah berhasil Ter Filter, namun untuk bagian kok belum ya ?
        apakah ada yang sallah dengan kode itu…
        jadi Bagian ada juga di Tabel ‘Users’ dimana yang diharapkan hanya user pada Bagian terkait yang bisa dimunculkan pada Auto Fill tersebut.
        (Bagian = Unit Kerja)

        oh iya.. Pak untuk Auto Fill ini secara Default Pengaturan dari project memang ga bisa di cari/ ketik menggunakan kriteria % Like % ya.. ?
        jadi misal akan cari kode : TRX-1001-2017 maka harus di ketik awal kode dulu ‘TRX…” engga bisa langsung ketik ‘1001’ ?

        Balas

  3. Pak masino,
    saya ada table 2:
    table 1 = “datakaryawan” yang isinya ada:
    karyawan_id int(11), primary key, AI
    name varchar(20)
    username varchar(20)
    password varchar(20)

    table 2 = dataprospek yang isinya :
    data_id int(11), primary key, AI
    karyawan_id int(11), foreign key
    sales_name

    bagaimana agar ketika saya input di table dataprospek field karyawan_id autofill mengambil data dari karyawan_id di table datakaryawan?
    karena sekarang ketika saya input data di data prospek field karyawan_id harus dimasukkan manual, padahal hasilnya sama dengan karyawan_id di datakaryawan.

    mohon bantuannya pak, masih belajar phpmaker….
    salam

    Balas

          • Maaf pak sebelumnya mau nanya..tapi sedikit lari dari topik php maker…

            saya mau buat auto fill. ne saya kasih codingnya boleh ya pak…

            .tbl
{
	border-collapse:collapse;
	border:1px solid #ffffff;
}

.tbl td, th
{
	border:1px solid #ffffff;
	padding:5px 10px;
	font-size:12px;
}

.tbl td
{
	font-size:10px;
}

input[type=text], input[type=password]
{
	width:304px;
}

textarea
{
	width: 304px;
	height: 214px;
}

            Level Peringatan:
            – Siaga
            – Waspada
            – Awas

            Pesan:

            	$(function () {
		$("#c_all").change(function() {
			if(this.checked) {
				$(".c_pilih").prop('checked', true);
			}else
			{
				$(".c_pilih").prop('checked', false);
			}
		});
	});

            “Pertanyaannya pak.. Ketika saya pilih waspada di combobox, maka otomatis textarea terisi pesan ” status waspada,blablablabla”. tapi tidak usah menggunakan database pak..langsung dari formnya aja… trima kash sebelum dan sesudahnya pak… mohon sangat bantuannya… jika ada biaya.. pun saya bersedia pak…trims. GBUs

            Balas

  5. Selamat sore pak masino
    Saya kesulitan menyembunyikan salah satu field MASTER/DETIL di serverevents
    mohon bantuanya pak untuk scripnya contohnya…trims

    Balas

    • Kalau table orders dan orderdetails memiliki relasi sebagai Master/Detail, maka ketika akses ke table orders tidak Anda berikan kepada user dengan tujuan supaya di-hide, maka table orderdetails juga otomatis tidak dapat diakses oleh user tersebut.

      Balas

  8. Siang Pa Masino,
    saya ada error menggunakan feature auto fill,
    contoh :
    ada field : | No Po | Inv Desc | Harga | Tipe |
    Input No Po (Lookup table) Ok.
    Inv Desc (Lookup Table)(Combo box), [parent filter:No PO],
    Auto Fill [ Harga (text), Tipe (text)].
    Jika pada Inv Desc isinya ada tanda kutip “”, cth (besin 3″), auto fill nya error
    sedangkan jika tidak ada tanda kutip “, itu auto fill pada (Harga, Tipe) tidak ada masalah,
    apakah pa masino mengalami error seperti ini ?
    saya menggunakan php maker 12.0.7.
    mhb bantuaanya, terima kasih.

    Balas

  10. Salam, pak masino. Saya mau tanya tentang fitur master/detail. Saya mempunyai relasi dari parent table ke child table yang dihubungkan (linked) sebanyak foreign key field pada child table (ada 7 foreign key). Pada halaman dimana saya ingin ADD record baru untuk child table tsb, ada beberapa isi field foreign key itu yang salah.
    Contoh kasus

    Table Parent:
    *parent_id = 1
    *inst_id = ABC
    *prog_id = TS021
    *plan_id = tes00
    descr = “AAAAAAA”

    *parent_id = 1
    *inst_id = ABC
    *prog_id = TF082
    *plan_id = tif00
    descr = “aaaaaaaaa”

    Table Child
    *parent_id = 1 <– "aaaaaaaaa"
    *child_id = 1
    *inst_id = ABC
    *prog_id = TF082
    *plan_id = tif00
    descr = null <— "mau diisi"

    Pada tampilan field parent_id yang sudah di look-up dari table parent, linked by: parent_id dan display field: descr. descr yang ditampilkan pada field parent_id adlah "AAAAAAA" bukan "aaaaaaaa". Apakah ini bisa di setting dalam PHPMaker agar dapat menampilkan descr yang benar, atau benar dugaan saya bahwa PHPMaker menampilkan field descr dari table parent hanya melihat parent_id saja tidak foreign key yang lainnya ?

    Mohon bantuannya Pak.
    Terima kasih

    Balas

  11. Pak saya , buat Filter untuk melakukan FIlter pada sebuah Auto Fill pada sebuah Tabel Transaksi agar Hanya memunuculkan data dengan Kriteria :
    Status = 0 dan Bagian = ‘Bagian dari User yang Login’.
    Kode nya seperti ini :
    (“`status`= ‘0’”) AND (“`bagian`= CurrentUserInfo(bagian)”)

    untuk Status nya sudah berhasil Ter Filter, namun untuk bagian kok belum ya ?
    apakah ada yang sallah dengan kode itu…
    jadi Bagian ada juga di Tabel ‘Users’ dimana yang diharapkan hanya user pada Bagian terkait yang bisa dimunculkan pada Auto Fill tersebut.
    (Bagian = Unit Kerja)

    oh iya.. Pak untuk Auto Fill ini secara Default Pengaturan dari Project memang ga bisa di cari/ ketik menggunakan kriteria % Like % ya.. ?
    jadi misal akan cari kode : TRX-1001-2017 maka harus di ketik awal kode dulu ‘TRX…” engga bisa langsung ketik ‘1001’ ?

    Balas

    • String Filter itu seharusnya seperti ini (dengan asumsi, tipe field bagian adalah string atau char atau varchar):

      "(`status` = '0') AND (`bagian` = '" . CurrentUserInfo("bagian") . "')"
      Balas

  12. Pak Masino kalau untuk Auto Fill di PHP Maker secara Default Pengaturan dari Project memang ga bisa di cari/ ketik menggunakan kriteria % Like % ya ?
    jadi misal akan cari kode : TRX-1001-2017 maka harus di ketik awal kode dulu ‘TRX…” engga bisa langsung ketik ‘1001’ untuk memunculkan kata yang mirip ?

    Balas

  13. Pak masino saya mau tanya, saya memiliki tabel siswa(Id,NoInduk,Nama), tabel bayar(id_siswa),id_siswa lookup tabel ke tabel siswa.Bagaimana cara insert ke tabel bayar, bisa menggunakan NoInduk atau Nama?
    karena yang saya tau tabel lookup hanya 1 field saj

    Balas

  14. selamat malam pak masino, saya tertarik membaca bnyak artikel bapak di website ini. Ada yang ingin saya tanyakan:

    saya mencoba fitur autofill yang dibahas diatas, pak masino.
    tetapi ada kendala ketika saya uji kasus yang lain:

    kasus
    tabel : t_data
    field : kode,nama,propinsi,kabupaten,kecamatan,desa , (filed yang saya tulis adalah yang berhubungan dengan autofill saja)

    saya menggunakn fitur autofill untuk mengisi field : nama,propinsi,kabupaten,kecamatan,desa berdasarkan kode

    field propinsi,kabupaten,kecamatan,desa menggunakan dinamik selection list (saya belajar dari : http://www.masinosinaga.com/phpmaker/dua-cara-menerapkan-dynamic-selection-list-di-aplikasi-web-dari-phpmaker/ )

    problem: ketika saya menggunakan autofill pada kolom kode, yang terisi otomatis adalah field nama dan propinsi saja, sedangkan field kabupaten,kecamatan,desa tidak terisi otomatis

    dimana kesalahan saya pak masino? Mohon pencerahannya, saya masih belajar php maker. Terimakasih

    Balas

  16. siang pak masino, saya punya filed dengan nama kode pegawai yang terdiri dari 18 digit angka bagaimana caranya jika saya hanya ingin mengambil 4 angka saja dari kode pegawai tersebut dan terisi secara otomatis pada saat saya menambah data di fiel tahun pegawai.
    contoh kode pegawai 197701012009011001
    tahun pegawai = 2000 (terisi otomotasi dari kode pegawai yang diatas)

    mohon bantuannya

    Balas

  17. Pak Masino mohon bantuanya..
    Di Editpage :

    1. Saya ingin menambahkan satuan setelah textbox contoh : Panjang ………. Cm (titik-Titik adalah text box )
    Menambahkan “Cm” di belakang Textbox bagaimana caranya ?

    2. Text pada textbox sebelum di isi adalah text caption nya. text yang berwarna grey di dalam textbox.
    agar bisa saya ganti textnya menjadi “mohon di isi nama sesuwai KTP” caranya bagaimana ?

    Terimakasih Pak Masino – Sukses selalu

    Balas

  18. Bang Masino, apakah ‘satu’ Field Tujuan pada Auto Fill hanya boleh di tuju untuk ‘satu’ Field asal saja ?
    saya coba Auto Fill dari dua Field Asal kok ga bisa, Field Tujuan tersebut hanya muncul sekejap lalu menghilang lagi (Text kosong)

    Field Asal 1 : Radio (NIP Pegawai)
    Field Asal 2 : Combo (NIK KTP)

    Field Tujuan : Textbox (Nama)

    saya coba Auto Fill tersebut dalam satu Form belum bisa ?

    Balas

  19. selamat malam bang…
    jika saya memiliki 2 table:
    1. table sektor dengan field ( sektor_id, nama_sektor, jml_pemuda, jml_dewasa )
    2. table anggota dengan Field ( sektor_id, anggota_id, kategori (enum ‘pemuda’, ‘dewasa’)

    bagaimana caranya mengisi secara otomatis jlm_pemuda, dan jml_dewasa dari table anggota tersebut?
    table sektor sebagi master..

    terimakasih.

    Balas

  20. pak saya mau bertanya, saya membuat databasse menggunakan hotel, didalam database terdapat tabel pemesanan makanan, menggunakan triger, setelah itu bagaimana caranya total bayar terisi secara
    otomatis

    terimaksih.

    Balas

    • Anda bisa menggunakan kode jQuery atau Javascript yang bisa di taruh di bagian Startup Script pada halaman Add atau Edit, untuk mengisi field lain saat data sedang diinput di field sebelumnya.

      Balas

Trackbacks

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

Situs ini menggunakan Akismet untuk mengurangi spam. Pelajari bagaimana data komentar Anda diproses