Masino Sinaga

Web Development and PHPMaker

Anda di sini: Beranda / PHPMaker / Supaya Modal Dialog Edit Tetap Terbuka Setelah Proses Edit Record di PHPMaker
Mengetahui Tanggal Akhir dari Tanggal Awal Ditambah Sekian Hari di PHPMaker
Begini Mudahnya Mengamankan Halaman Eksternal di Aplikasi Web dari PHPMaker

Supaya Modal Dialog Edit Tetap Terbuka Setelah Proses Edit Record di PHPMaker

Kam, 22 Desember 2016 oleh Masino Sinaga 15 Komentar

Seperti yang kita ketahui, fitur Modal dialog pada pengaturan level Table mulai ada sejak PHPMaker versi 2017. Halaman Add, Edit, dan View sekarang sudah bisa ditampilkan secara popup dalam kotak dialog Modal Bootstrap. Sebelumnya pada versi 12, baru halaman Advanced Search saja yang bisa ditampilkan menggunakan Modal Bootstrap.

Khusus untuk halaman Add dan Edit, kotak dialog Modal Bootstrap tersebut ternyata masih memiliki keterbatasan. Seperti apa itu? Begini. Jika misalnya kita ingin setelah Pengguna Akhir Aplikasi Web berhasil mengubah data dan ingin kembali lagi ke form Edit tadi, maka sistem akan menampilkan halaman Edit secara normal, dan tidak ditampilkan dalam kotak dialog Modal Edit.

Tentu saja kondisi ini tidak kita harapkan. Karena di samping tidak konsisten, Aplikasi Web kelihatan menjadi kurang begitu profesional. Sudah jelas di awal kita memutuskan untuk menggunakan kotak dialog Modal untuk form Edit tadi, lalu mengapa ketika sistem mengarahkan kembali ke form Edit tadi tapi sistem tidak menampilkannya dalam kotak dialog Modal?

Kondisi ketidakkonsistenan ini sebenarnya hampir mirip dengan kotak dialog Modal Bootstrap yang tidak bisa ditampilkan dari area Preview Row, seperti yang sudah saya tulis pada artikel yang berjudul Supaya Modal Dialog Bisa Dibuka dari Bagian Preview Row di PHPMaker.

Bedanya, kalau di artikel tadi solusinya bisa diatasi melalui extension MasinoPreviewRow13, maka solusi yang sedang kita bahas di artikel ini bisa diatasi melalui fitur Server Events dan Client Scripts. Artinya, bukan PHPMaker namanya jika kita tidak bisa mencari solusi di balik keterbatasan yang masih terjadi di PHPMaker.

Katakanlah di table kantor pada project PHPMaker, nama field yang berperan sebagai Primary Key adalah Kode_Kantor, kita ingin saat Pengguna mengklik link Edit di halaman List, maka sistem menampilkan dalam kotak dialog Modal Bootstrap, dan setelah Pengguna menyimpan data pada form Edit tadi, maka sistem tetap menampilkan form Edit tersebut, masih dalam kotak dialog Modal Bootstrap.

Bagaimana solusinya? Silahkan ikuti petunjuk berikut dengan teliti.

Pertama, pastikan kita sudah mengaktifkan pilihan Modal dialog dari Table setup -> Edit Page.

Kedua, salin kode berikut ke dalam server event Row_Updated yang terdapat di bawah lokasi Server Events -> Table-Specific -> Common, sehingga kode selengkapnya seperti ini:

// Row Updated event
function Row_Updated($rsold, &$rsnew) {
	//echo "Row Updated";
	$_SESSION["Redirect_Edit"] = "Yes";
	$_SESSION["Field_Kode"] = $rsold["Kode_Kantor"];
}

Artinya, kita ingin ada penanda yang memastikan setelah proses Edit data, maka kita akan menampilkan kembali kotak dialog Modal Bootstrap tadi, yaitu melalui variabel session yang bernama Redirect_Edit. Kita juga harus menyimpan data kunci dari field yang telah diubah tadi ke dalam variabel session yang bernama Field_Kode.

Ketiga, salin kode berikut ke dalam Startup Script yang terdapat di bawah lokasi Client Scripts -> Table-Specific -> List Page:

$(document).ready(function() {
	<?php if (isset($_SESSION["Redirect_Edit"]) && $_SESSION["Redirect_Edit"] == "Yes") { ?>
	<?php $_SESSION["Redirect_Edit"] = ""; ?>
	ew_ModalDialogShow({lnk:this, url:'kantoredit.php?Kode_Kantor=<?php echo $_SESSION["Field_Kode"] ?>', caption:'Edit'});
	<?php } ?>
});

Perhatikan kode yang terakhir ini. Kita dapat menyisipkan kode PHP di dalam kode jQuery pada bagian Client Scripts. Tujuannya, kita memeriksa apakah nilai variabel session Redirect_Edit tadi adalah Yes, dan jika ya, maka jangan lupa untuk mengosongkan nilai variabel session tadi terlebih dulu.

Mengapa harus dikosongkan? Tujuannya supaya kita tidak terjebak dengan logic yang terus-menerus menampilkan kotak dialog Modal Bootstrap tadi saat halaman List tadi diakses oleh Pengguna. Itulah makanya kita perlu memastikan bahwa penanda tadi sudah ditugaskan dari server event Row_Updated.

Setelah itu, panggil fungsi Javascript bawaan PHPMaker yang bernama ew_ModalDialogShow(), di mana parameter di dalamnya kita mengacu kepada URL dari Edit Page table kantor tadi. Pastikan juga kita sudah menyertakan parameter Kode_Kantor pada URL tersebut, yang nilainya kita ambil dari variabel session yang bernama Field_Kode.

Keempat, untuk mencegah sistem menampilkan halaman Edit yang normal (tanpa menggunakan kotak dialog Modal Bootstrap), maka pastikan kita mengosongkan pilihan pada Table setup -> Return Pages -> After edit.

Kelima atau yang terakhir, pastikan kita sudah men-generate ulang semua file script menggunakan PHPMaker, seperti biasa.

Setelah proses generate selesai, jalankan Aplikasi Web melalui browser favorit Anda. Klik link Edit pada salah satu record yang Anda inginkan di table kantor tadi, maka sistem akan menampilkan kotak dialog Modal Bootstrap. Sekarang ubahlah data di form tadi, lalu klik tombol Edit, maka sistem akan menampilkan kembali form Edit tadi masih dalam kotak dialog Modal Bootstrap.

Harus diakui memang, bahwa masih ada keterbatasan dari teknik ini. Apa itu? Pesan Update succeeded setelah proses Edit tadi, ditampilkan duluan atau berada di bawah kotak dialog Modal Bootstrap yang ditampilkan kemudian.

Meskipun demikian, trik yang kita gunakan ini paling tidak sudah mengatasi permasalahan utama dari halaman Edit normal yang ditampilkan jika menggunakan fitur redirect bawaan PHPMaker setelah proses Edit data dilakukan melalui kotak dialog Modal Bootstrap.

Betapa mudah, cepat, dan menyenangkan sekali menggunakan PHPMaker, bukan? 😉

Ditempatkan di bawah: PHPMaker Ditag dengan:Belajar PHPMaker, Bootstrap Modal, Modal Dialog, Page_Load, PHPMaker Indonesia, Server Events and Client Scripts, Tutorial PHPMaker

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 dan ilovephpmaker.com.

Mengetahui Tanggal Akhir dari Tanggal Awal Ditambah Sekian Hari di PHPMaker
Begini Mudahnya Mengamankan Halaman Eksternal di Aplikasi Web dari PHPMaker

Komentar

  1. Egi mengatakan

    Kam, 22 Desember 2016 pada 9:10 pm

    Malam pak….bila ingin membuat pesan peringatan oneclik di gridadd gimana ya….maksud saya di gridadd ada beberapa row dan di row pertama sudah terisi kode… di row kedua dan seterusnya tidak boleh diisi kode yang sama dengan kode pertama….pada waktu diisi kode yg sama muncul pesan peringatan….itu kodenya seperti apa ya pak…trima kasih banyak sebelumnya

    Balas
    • Masino Sinaga mengatakan

      Jum, 23 Desember 2016 pada 9:59 am

      Jika field tersebut adalah Primary Key, maka PHPMaker akan otomatis memeriksa nilai kode tersebut sebelum data disimpan. Jika ada nilai yang sama, maka PHPMaker akan menampilkan pesan bahwa ada nilai duplikat untuk Primary Key tadi.

      Balas
      • Egi mengatakan

        Jum, 23 Desember 2016 pada 11:25 am

        Trimakasih pak….akan sy coba

        Balas
        • Masino Sinaga mengatakan

          Jum, 23 Desember 2016 pada 11:34 am

          Sama-sama.

          Balas
      • Egi mengatakan

        Jum, 23 Desember 2016 pada 2:01 pm

        Di field primary key phpmaker sudah sy aktifkan pak tp tetap aja masih bisa tersimpan…. klu didatabase memang nggk sy primery key pak…karena memang sy buat sengaja seperti itu

        Balas
        • Masino Sinaga mengatakan

          Jum, 23 Desember 2016 pada 2:13 pm

          Seharusnya tidak bisa tersimpan, meskipun di Database tidak Anda set Primary Key-nya, tapi Primary Key hanya diset di project PHPMaker saja. Barusan saya coba di sini, data Kode yang sudah ada tidak bisa masuk, muncul pesan “Duplicate primary key”.

          Balas
          • Egi mengatakan

            Jum, 23 Desember 2016 pada 2:40 pm

            Sy coba sekali lg pak

            Balas
            • Masino Sinaga mengatakan

              Jum, 23 Desember 2016 pada 3:56 pm

              Dua kali juga gak papa. 🙂

              Balas
              • Egi mengatakan

                Jum, 23 Desember 2016 pada 4:36 pm

                Tetap mash sama pak….blm tau ni apa masalahnya….klu dngn cara lain ada nggk pak

                Balas
                • Masino Sinaga mengatakan

                  Sen, 26 Desember 2016 pada 10:54 am

                  Kok aneh ya, di tempat saya bisa tuh.

  2. Lukas mengatakan

    Kam, 26 Januari 2017 pada 10:02 pm

    Pak saya mau tanya
    untuk supaya si modal popup itu mengembalikan return hanya kode itu seperti apa ya
    soalny di modal saya tampilkan 3 field dan 3 3 nya ke isi di field saat insert tersebut
    misal saya mau isi di kolom supplier, kemudian saya keluarkan modal lookup table tadi
    lalu saya pilih ABC1 – PABRIK 1 – SUB
    lalu 3 tadi itu masuk ke field sup, yang seharusnya hanya abc1
    mohon dibantu

    Balas
    • Masino Sinaga mengatakan

      Jum, 27 Januari 2017 pada 9:34 am

      Tidak ada fitur seperti yang Anda tanyakan itu. Meskipun di form kelihatan seolah-olah 3 nilai tadi masuk ke dalam form, tapi yang tersimpan ke Database sebenarnya adalah nilai kode-nya saja.

      Menampilkan hanya kode saja itu adalah cara yang sudah sangat kuno. Mengapa? Karena di samping tidak informatif, juga tidak kelihatan profesional.

      Balas
  3. Alex mengatakan

    Jum, 28 April 2017 pada 12:38 am

    Kasus sy sma dengan sodara egi diatas pak….
    SAya jg coba primary key di phpmaker tetap tersimpan.
    Itu setingan apa yg belum sy aktifkan pak

    Balas
    • Masino Sinaga mengatakan

      Jum, 28 April 2017 pada 8:51 am

      Jawaban saya juga sama seperti di atas.

      Balas

Trackbacks

  1. Modal Dialog Edit Sekarang Bisa Tetap Terbuka Setelah Edit Data di PHPMaker 2021 – Masino Sinaga berkata:
    Ming, 2 Mei 2021 pukul 12:47 pm

    […] Untuk mengatasi keterbatasan ini, sekitar 5 tahun yang lalu, kita sudah pernah mengatasinya melalui bantuan session, lalu memunculkan kembali Modal Dialog tadi. Anda bisa membaca artikel yang khusus membahas trik tadi melalui Supaya Modal Dialog Edit Tetap Terbuka Setelah Proses Edit Record di PHPMaker. […]

    Balas

Tinggalkan Balasan Batalkan balasan

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

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

Pos-pos Terbaru

  • Begini Mudahnya Mengubah Lebar Modal Dialog di PHPMaker 2022
  • Item Menu Tetap Aktif Meskipun Sedang Menampilkan Halaman Tambah, Ubah, Tampilkan, Cari di PHPMaker 2022
  • Hati-Hati Memilih Versi PHP Sebelum Generate Code di PHPMaker 2022
  • Alasan AlwaysUseEnglishUSLocale Sebaiknya Aktif di Masino Extensions untuk PHPMaker 2022
  • MasinoInputMask18 Extension, Autoformat Angka dengan Fitur Lebih Kaya di PHPMaker 2022

Menu

  • Siapa Saya?
  • Web Development
  • PHPMaker
  • Umum
  • Syarat dan Ketentuan
  • Sitemap (Peta Situs)
  • Komentar

Komentar Terbaru

  • Masino Sinaga pada Project Stock Inventory untuk PHPMaker 2022 Sekarang Sudah Bisa Didownload
  • Stanislaus Ariyanto pada Project Stock Inventory untuk PHPMaker 2022 Sekarang Sudah Bisa Didownload
  • Masino Sinaga pada Mudahnya Mendapatkan Info Pengguna Setelah Login di Aplikasi Web dari PHPMaker
  • irwan pada Mudahnya Mendapatkan Info Pengguna Setelah Login di Aplikasi Web dari PHPMaker
  • Masino Sinaga pada Ini Dia Fitur-Fitur yang Terdapat di Masino Extensions untuk PHPMaker 2022

Situs Terkait

  1. I Love PHPMaker
  2. Situs Resmi PHPMaker
  3. Forum Diskusi PHPMaker
  4. PHPMaker di IlmuKomputer.com
  5. PHPMaker Learning

Baru di PHPMaker?

Baca ini terlebih dulu ...

  1. Ayo Menjadi Web Developer yang Cerdas!
  2. PHPMaker: PHP Code Generator + PHP Framework
  3. Pertanyaan-Pertanyaan yang Paling Sering Diajukan Seputar PHPMaker
  4. Tips buat Anda Pemula yang Baru Mengenal dan Menggunakan PHPMaker
  5. Bacalah Help, Bacalah Help, dan Bacalah Help di PHPMaker!

(c) Masino Sinaga 2009 - 2021 | WordPress | Catat masuk | Kembali ke atas