Cara Menampilkan Tombol Close di Footer Modal buat Custom File yang SkipHeaderFooter-nya Bernilai True

Sambil menunggu dirilisnya PHPMaker 2026 dalam beberapa hari ke depan, kita akan membahas bagaimana trik sederhana tapi cukup ampuh, untuk menampilkan tombol Close di bagian Footer dari Bootstrap Modal Dialog yang memuat Custom File yang Header dan Footer-nya diskip pada PHPMaker 2025.

Seperti yang sudah kita ketahui bersama, PHPMaker menyediakan kemudahan bagi Web Developer yang ingin menampilkan konten halaman web dalam jendela Modal Dialog, cukup dengan mengatur beberapa properties dari sebuah HyperLink.

Buat yang belum tahu apa itu HyperLink, ini merupakan tautan pada halaman web yang memungkinkan pengguna untuk membuka suatu halaman tertentu. Syntax-nya dimulai dari tag pembuka <a ... > dan diakhiri dengan tag penutup </a>.

Supaya tidak bingung, mari kita implementasikan pada project demo2025 yang disediakan oleh PHPMaker 2025.

Langkah Pertama, silahkan buka file project tersebut dengan aplikasi PHPMaker 2025, lalu klik Custom File yang bernama news.php, dan tambahkan kode untuk menampilkan HyperLink ini dari bagian Content:

<a href="javascript:void(0);" data-caption='My Data' data-ew-action='modal' data-action='view' data-ajax='false' data-url='mydata' data-btn='null' data-bs-original-title='My Data'>Open My Data</a>

Kode ini artinya kita akan membuka halaman dengan URL mydata yang ditampilkan ke dalam jendela Bootstrap Modal Dialog, lewat sebuah link dengan tulisan Open My Data.

Langkah Kedua, silahkan buat sebuah Custom File baru, dengan informasi sebagai berikut:

• File Name: mydata.php
• Caption: My Data
• Include common files: (pastikan aktif, atau beri tanda centang)
• Path: (biarkan saja, alias dikosongkan)
• Di bagian Content, masukkan kode berikut:
  

<?php

echo "<h3>Custom File with Include common files option</h3>";

$sql = "SELECT `Model` FROM `models`"; // define your SQL
$stmt = ExecuteQuery($sql); // execute the query
$value = ""; // initial value
if ($stmt->rowCount() > 0) { // check condition: if record count is greater than 0
    while ($row = $stmt->fetchAssociative()) { // loop
        $value .= $row["Model"] . "<br>"; // in case the result returns more than one record, display it and separated by line break
    } // end loop
    echo "Here is the Models list: <br>" . $value; // display the result
} else { // if there are no result
    echo "No record found."; // display the message
} // end of check condition

?>

Langkah Keempat, generate ulang semua file script seperti biasa menggunakan PHPMaker 2025, lalu dari aplikasi web yang ditampilkan di browser, buka halaman News, kemudian klik link Open My Data di halaman tersebut. Selanjutnya, kalian akan melihat list data Models ditampilkan pada jendela Modal Dialog, dan di bagian Footer dari jendela Modal Dialog tersebut, kalian bisa melihat ada tombol Close di sana.

Sampai di sini segalanya berjalan dengan lancar dan seperti yang diharapkan. Kita dapat menampilkan konten sebuah halaman Custom File lewat jendela Modal Dialog.

Suatu ketika, kita ingin men-skip Header dan Footer saat menampilkan halaman Custom File yang bernama mydata.php tadi. Untuk itu, ada dua cara untuk melakukannya.

Cara pertama cukup dengan memberi tanda centang pada kolom No header/footer dari Custom File tadi, lewat jendela Generate si PHPMaker 2025.

Cara kedua, cukup dengan menambahkan kode PHP berikut ke dalam server event Page_Load dari Custom File mydata.php tadi:

global $SkipHeaderFooter;
$SkipHeaderFooter = true;

Nah, jika ini kita lakukan, maka saat konten halaman mydata tadi ditampilkan lewat jendela Modal Dialog, kita tidak akan melihat tombol Close di bagian Footer Modal Dialog tersebut. Lalu solusinya bagaimana untuk menampilkan tombol Close di bagian Footer dari jendela Modal Dialog tadi?

Gampang sekali Saudara-saudara… kita cukup hanya menambahkan sedikit kode PHP ini ke bagian bawah dari Content Custom File mydata.php tadi:

<?= (IsModal()) ? '<template class="ew-modal-buttons">' : '<div class="row ew-buttons">' ?><!-- buttons .row -->

<?= (IsModal()) ?
'<div class="ew-modal-buttons">
	<button type="button" class="btn btn-default ew-btn" data-bs-dismiss="modal">Close</button>
</div>' : '' ?>

<?= (IsModal()) ? "</template>" : "</div>" ?><!-- /buttons .row -->

Jadi, konten selengkapnya dari Custom File mydata.php di atas menjadi seperti ini:

<?php

echo "<h3>Custom File with Include common files option</h3>";

$sql = "SELECT `Model` FROM `models`"; // define your SQL
$stmt = ExecuteQuery($sql); // execute the query
$value = ""; // initial value
if ($stmt->rowCount() > 0) { // check condition: if record count is greater than 0
    while ($row = $stmt->fetchAssociative()) { // loop
        $value .= $row["Model"] . "<br>"; // in case the result returns more than one record, display it and separated by line break
    } // end loop
    echo "Here is the Models list: <br>" . $value; // display the result
} else { // if there are no result
    echo "No record found."; // display the message
} // end of check condition

?>

<?= (IsModal()) ? '<template class="ew-modal-buttons">' : '<div class="row ew-buttons">' ?><!-- buttons .row -->

<?= (IsModal()) ?
'<div class="ew-modal-buttons">
	<button type="button" class="btn btn-default ew-btn" data-bs-dismiss="modal">Close</button>
</div>' : '' ?>

<?= (IsModal()) ? "</template>" : "</div>" ?><!-- /buttons .row -->

Terakhir, generate ulang semua file script seperti biasa, lalu cobalah buka kembali halaman My Data tadi dari halaman News, maka sekarang kalian akan melihat tombol Close di bagian Footer dari jendela Modal Dialog.

Betapa mudahnya bukan? Dan betapa rapinya framework aplikasi yang digunakan oleh PHPMaker ini.