Hitung Panjar Biaya Perkara

Hitung panjar digunakan untuk menghitung biaya pendaftaran perkara di Pengadilan Agama. Sebelum mulai membuat aplikasinya, saya jelaskan terlebih dahulu kenapa perlunya membuat aplikasi hitung panjar.

Saya bercerita pengalaman saya selama berada di Pengadilan Agama Tenggarong. Petugas pendaftaran menghitung biaya pendaftaran perkara menggunakan excel. Memang menggunakan excel sudah cepat, hanya perlu memasukkan biayanya untuk menghitung total biaya yang harus dibayar. Akan tetapi petugas harus memeriksa berapa radius biaya panggilan sidang para pihak. Untuk memeriksanya petugas membuka dokumen radius dan mencari berapa biayanya untuk daerah tersebut. Dan proses ini cukup memakan waktu bagi pihak yang ingin mendaftarkan perkaranya.

Agar mempermudah proses perhitungan tanpa harus melihat berapa radius untuk tiap daerah, maka dibuatlah aplikasi hitung panjar. Aplikasi ini sudah digunakan oleh Pengadilan Agama tenggarong hingga saat ini. Mari kita buat aplikasinya.

Membuat Database

Kita akan membuat database terlebih dahulu. Di sini saya menggunakan XAMPP v3.2.2 dengan PHP 5.6.36. Untuk cara pemasangan XAMPP bisa dicari di google ada banyak tutorial. Kita lanjut pembuatan databasenya.

Database panjar_biaya

Jalankan XAMPP terlebih dahulu dan jalankan juga service Apache dan MySQL. Kemudian buka browser dan masukkan alamat localhost pada browser. Akan muncul halaman welcome, setelah itu pilih menu phpMyAdmin.

Pada bagian atas pilih menu SQL dan masukkan kode berikut :

CREATE DATABASE `panjar_biaya`;

Membuat Tabel

Tabel Kecamatan

CREATE TABLE `kecamatan` (
  `id` int(11) NOT NULL,
  `kecamatan` varchar(255) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;

Tabel Perkara

CREATE TABLE `perkara` (
  `id` int(11) NOT NULL,
  `perkara` varchar(255) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;

Tabel Radius

CREATE TABLE `radius` (
  `id` int(11) NOT NULL,
  `kecamatan` int(11) NOT NULL,
  `kelurahan` varchar(255) NOT NULL,
  `biaya` int(11) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;

Memasukkan Data

Data Kecamatan

INSERT INTO `kecamatan` (`id`, `kecamatan`) VALUES
(1, 'Tenggarong'),
(2, 'Tenggarong Seberang'),
(3, 'Sebulu'),
(4, 'Loa Janan'),
(5, 'Loa Kulu'),
(6, 'Anggana'),
(7, 'Sanga Sanga'),
(8, 'Muara Jawa'),
(9, 'Samboja'),
(10, 'Muara Badak'),
(11, 'Marangkayu'),
(12, 'Muara Kaman'),
(13, 'Kota Bangun'),
(14, 'Muara WIS'),
(15, 'Muara Muntai'),
(16, 'Kenohan Kahala'),
(17, 'Kembang Janggut'),
(18, 'Tabang');

Data Perkara

INSERT INTO `perkara` (`id`, `perkara`) VALUES
(1, 'cerai gugat'),
(2, 'cerai gugat ghaib'),
(3, 'cerai talak'),
(4, 'cerai talak ghaib'),
(5, 'dispensasi nikah'),
(6, 'isbat nikah');

Data Radius

INSERT INTO `radius` (`id`, `kecamatan`, `kelurahan`, `biaya`) VALUES
(1, 1, 'Kelurahan Panji', 75000),
(2, 1, 'Kelurahan Mangkurawang', 75000),
(3, 1, 'Kelurahan Loa Ipuh', 75000),
(4, 1, 'Kelurahan Baru', 75000),
(5, 1, 'Kelurahan Timbau', 75000),
(6, 1, 'Kelurahan Melayu', 75000),
(7, 1, 'Kelurahan Bukit Biru', 75000),
(8, 1, 'Kelurahan Jahab', 150000),
(9, 1, 'Kelurahan Loa Tebu', 100000),
(10, 1, 'Kelurahan Loa Tebu - Batu Dinding', 150000),
(11, 1, 'Kelurahan Loa Tebu - Bengkinang', 150000),
(12, 1, 'Kelurahan Bangunrejo Bukit Biru', 150000),
(13, 1, 'Kelurahan Maluhu/Spontan', 100000),
(14, 1, 'Desa Rapak Lambur', 150000),
(15, 1, 'Kelurahan Loa Ipuh Darat Km.19', 150000),
(16, 1, 'Desa Spontan', 100000),
(17, 1, 'Datar Wanyi Mangkurawang', 150000),
(18, 1, 'Desa Sebendang Raya', 150000),
(19, 1, 'Kelurahan Sukarame', 75000),
(20, 2, 'Desa Loa Lepu', 150000),
(21, 2, 'Desa Teluk Dalam', 100000),
(22, 2, 'Desa Perjiwa', 100000),
(23, 2, 'Desa Loa Raya', 100000),
(24, 2, 'Desa Loa Ulung / Loa Pari', 150000),
(25, 2, 'Desa Embalut Kam Tran', 200000),
(26, 2, 'Desa Separi Kampung', 250000),
(27, 2, 'Desa Bukit Raya', 175000),
(28, 2, 'Desa Karang Tunggal', 200000),
(29, 2, 'Desa Manunggal Jaya', 200000),
(30, 2, 'Desa Bangun Rejo', 200000),
(31, 2, 'Desa Karta Buana', 250000),
(32, 2, 'Desa Separi I/Pariaman', 300000),
(33, 2, 'Desa Separi III/Buana Jaya', 300000),
(34, 2, 'Desa Separi IV/Mulawarman', 300000),
(35, 2, 'Separi Besar/Suka Maju', 300000),
(36, 2, 'Separi Embalut Kampung', 250000),
(37, 2, 'Desa Tanjung Batu', 250000),
(38, 3, 'Desa Selerong', 300000),
(39, 3, 'Desa Tanjung Harapan', 300000),
(40, 3, 'Desa Beloro', 300000),
(41, 3, 'Desa Sebulu Ulu', 200000),
(42, 3, 'Desa Sebulu Ilir', 200000),
(43, 3, 'Desa Segihan', 250000),
(44, 3, 'Desa Sumber Sari/Sebulu I/Mekar Jaya', 300000),
(45, 3, 'Desa Manunggal Daya', 300000),
(46, 3, 'Desa Giri Agung/Separi II', 250000),
(47, 3, 'Desa Senoni', 250000),
(48, 3, 'Desa Sebulu Modern', 200000),
(49, 3, 'Desa Antai', 250000),
(50, 3, 'Desa Sanggulan', 250000),
(51, 4, 'Desa Loa Janan Ulu', 200000),
(52, 4, 'Desa Bakungan', 150000),
(53, 4, 'Desa Loa Duri Ilir', 150000),
(54, 4, 'Desa Loa Duri Ulu', 150000),
(55, 4, 'Desa Loa Duri Ulu - Dusun Surya ( RT.14 )', 200000),
(56, 4, 'Desa Loa Duri Ulu - Dusun Merandai ( RT.15 )', 200000),
(57, 4, 'Desa Loa Duri Ulu - Dusun Kutai Baru ( RT.16 )', 200000),
(58, 4, 'Desa Loa Duri Ulu - Sungai Pimping ( RT.17 )', 200000),
(59, 4, 'Desa Purwajaya', 200000),
(60, 4, 'Desa Tani Bakti EX. UPT', 200000),
(61, 4, 'Desa Batuah', 250000),
(62, 4, 'Desa Tani Harapan', 250000),
(63, 5, 'Desa Margahayu (Jonggon A)', 200000),
(64, 5, 'Desa Jonggon Jaya (B)', 300000),
(65, 5, 'Desa Sei. Payan /Sei. Lais', 300000),
(66, 5, 'Desa Jembayan', 100000),
(67, 5, 'Desa Jembayan - Dusun Tanjung Laong (RT.13)', 200000),
(68, 5, 'Desa Jembayan Dalam', 300000),
(69, 5, 'Desa Loa Kulu Kota', 100000),
(70, 5, 'Dusun Loa Gagak', 200000),
(71, 5, 'Desa Lok Sumber/Sumber Sari', 100000),
(72, 5, 'Desa Ponoragan', 100000),
(73, 5, 'Desa Jonggon C', 400000),
(74, 5, 'Desa Jonggon Kampung', 400000),
(75, 5, 'Desa Rempanga', 100000),
(76, 5, 'Desa Jongkang Rempanga', 100000),
(77, 5, 'Desa Bangun Sari', 150000),
(78, 5, 'Desa Jembayan Tengah', 300000),
(79, 5, 'Desa Sepakat', 100000),
(80, 6, 'Desa Sepatin', 850000),
(81, 6, 'Desa Muara Patuan', 850000),
(82, 6, 'Desa Tani Baru', 700000),
(83, 6, 'Desa Kutai Lama', 300000),
(84, 6, 'Desa Sungai Meriam', 300000),
(85, 6, 'Desa Sidomulyo/Anggana I', 300000),
(86, 6, 'Handil Terusan/Anggana II', 450000),
(87, 6, 'Desa Anggana', 300000),
(88, 7, 'Kelurahan Jawa', 300000),
(89, 7, 'Kelurahan Pendingin', 350000),
(90, 7, 'Kelurahan Sanga-Sanga Dalam', 300000),
(91, 7, 'Kelurahan Sari Jaya', 300000),
(92, 7, 'Kelurahan Sanga-Sanga Luar/Muara', 300000),
(93, 8, 'Kelurahan Muara Jawa Ilir', 300000),
(94, 8, 'Kelurahan Muara jawa Tengah', 300000),
(95, 8, 'Kelurahan Muara Jawa Ulu', 300000),
(96, 8, 'Kelurahan Teluk Dalam', 400000),
(97, 8, 'Kelurahan Dondang', 300000),
(98, 8, 'Kelurahan Tama Pole', 400000),
(99, 8, 'Kelurahan Muara kembang', 400000),
(100, 9, 'Kelurahan Salok Api Darat', 300000),
(101, 9, 'Kelurahan Salok Api Laut', 400000),
(102, 9, 'Kelurahan Ambarawang Laut', 300000),
(103, 9, 'Kelurahan Ambarawang Darat', 300000),
(104, 9, 'Kelurahan Margo Mulyo', 300000),
(105, 9, 'Kelurahan Sungai Merdeka + Bukit Merdeka', 300000),
(106, 9, 'Kelurahan Sungai Seluang', 300000),
(107, 9, 'Kelurahan Wono Tirto / Samboja I', 300000),
(108, 9, 'Kelurahan Tanjung Harapan', 300000),
(109, 9, 'Kelurahan Samboja Kuala + Kampung Lama', 300000),
(110, 9, 'Kelurahan Senipah', 300000),
(111, 9, 'Kelurahan Handil Baru', 300000),
(112, 9, 'Kelurahan Muara Sembilang', 400000),
(113, 9, 'Desa Karya Jaya', 400000),
(114, 9, 'Desa Samboja II / Bukit Raya', 400000),
(115, 9, 'Desa Samboja III', 400000),
(116, 9, 'Desa Beringin Agung', 400000),
(117, 9, 'Desa Tani Bakti', 400000),
(118, 9, 'Desa Arga Sari', 400000),
(119, 10, 'Desa Seliki', 450000),
(120, 10, 'Desa Salak Palai', 400000),
(121, 10, 'Desa Muara Badak Ulu', 300000),
(122, 10, 'Desa Muara Badak Ilir', 300000),
(123, 10, 'Desa Tanjung Limau', 300000),
(124, 10, 'Desa Tanah Datar', 250000),
(125, 10, 'Desa Badak Baru', 300000),
(126, 10, 'Desa Suka Damai', 300000),
(127, 10, 'Desa Gas Alam', 300000),
(128, 10, 'Desa Batu-Batu', 300000),
(129, 10, 'Desa Cella/Bosan/Sei Bawang', 450000),
(130, 11, 'Desa Sebuntal', 400000),
(131, 11, 'Desa Tanjung Santan Ulu', 400000),
(132, 11, 'Desa Tanjung Santan Ilir', 450000),
(133, 11, 'Desa Tanjung Santan Tengah', 450000),
(134, 11, 'Desa Kersik', 400000),
(135, 11, 'Desa Perangat Baru', 400000),
(136, 11, 'Desa Perangat Selatan', 400000),
(137, 11, 'Desa Makarti', 400000),
(138, 11, 'Desa Bunga Putih', 450000),
(139, 11, 'Desa Semangko', 420000),
(140, 11, 'Desa Sembera, Bunga Putih', 450000),
(141, 12, 'Desa Muara Kaman Ilir', 400000),
(142, 12, 'Desa Rantau Hampang', 400000),
(143, 12, 'Desa Teratak', 350000),
(144, 12, 'Desa Benua Puhun', 350000),
(145, 12, 'Desa Muara Kaman Ulu', 400000),
(146, 12, 'Desa Sabintulung', 600000),
(147, 12, 'Desa Muara Siran', 500000),
(148, 12, 'Desa Tunjungan', 700000),
(149, 12, 'Desa Sedulang', 650000),
(150, 12, 'Desa Benamang Kiri', 950000),
(151, 12, 'Desa Benamang Kanan', 900000),
(152, 12, 'Desa Bukit Jering', 500000),
(153, 12, 'Desa Sido Mukti/Sebulu III', 300000),
(154, 12, 'Desa Panca Jaya/Sebulu IV', 350000),
(155, 12, 'Desa Bunga Jadi/Sebulu V', 380000),
(156, 12, 'Desa Kupang Baru', 800000),
(157, 12, 'Desa Loa Bahu Ulak', 300000),
(158, 13, 'Desa Kedang Ipil', 500000),
(159, 13, 'Desa Benua Baru', 500000),
(160, 13, 'Desa Sedulang', 350000),
(161, 13, 'Desa Loleng', 400000),
(162, 13, 'Desa Kota Bangun Ulu', 400000),
(163, 13, 'Desa Kota Bangun Ilir', 400000),
(164, 13, 'Desa Liang Ulu/Ilir', 500000),
(165, 13, 'Desa Muhuran', 500000),
(166, 13, 'Desa Pela', 500000),
(167, 13, 'Desa Kota bangun I', 500000),
(168, 13, 'Desa Kota Bangun II', 550000),
(169, 13, 'Desa Kota bangun III', 550000),
(170, 13, 'Desa Rimba Ayu IV/EX UPT', 500000),
(171, 13, 'Desa Rimba Ayu V', 500000),
(172, 13, 'Desa Rimba Ayu VI', 500000),
(173, 13, 'Desa Sumber Sari', 500000),
(174, 13, 'Desa Sari Nadi', 450000),
(175, 13, 'Desa Suka Bumi', 500000),
(176, 13, 'Desa Kota Bangun Seberang', 500000),
(177, 14, 'Desa Muara Wis', 500000),
(178, 14, 'Desa Sehemban', 600000),
(179, 14, 'Desa Melintang', 700000),
(180, 14, 'Desa Enggelan', 700000),
(181, 14, 'Desa Lebak Mantan', 600000),
(182, 14, 'Desa Lebak Cilong', 600000),
(183, 14, 'Desa Muara Enggelan', 600000),
(184, 15, 'Desa Perian', 600000),
(185, 15, 'Desa Muara Leka', 600000),
(186, 15, 'Desa Muara Aloh', 750000),
(187, 15, 'Desa Jantur/Jantur Baru', 800000),
(188, 15, 'Desa Batuq', 600000),
(189, 15, 'Desa Rebak Rinding', 500000),
(190, 15, 'Desa Muara Muntai Ulu', 500000),
(191, 15, 'Desa Muara Muntai Ilir', 500000),
(192, 15, 'Desa Kayu Batu', 500000),
(193, 15, 'Desa Jantur Selatan', 800000),
(194, 15, 'Desa Tanjung Batu Harapan', 800000),
(195, 16, 'Desa Lamin Telihan', 1000000),
(196, 16, 'Desa Lamin Palut', 1000000),
(197, 16, 'Desa Teluk Bingklai', 1000000),
(198, 16, 'Desa Kahala', 1000000),
(199, 16, 'Desa Tubuhan', 1000000),
(200, 16, 'Desa Semayang', 1000000),
(201, 16, 'Desa Teluk Muda', 1000000),
(202, 16, 'Desa Tuana Tuha', 1000000),
(203, 17, 'Desa Genting Tanah', 1000000),
(204, 17, 'Desa Loa Sako', 1000000),
(205, 17, 'Desa Hambau', 1000000),
(206, 17, 'Desa Kembang Janggut', 1100000),
(207, 17, 'Desa Kelekat', 1100000),
(208, 17, 'Desa Pulau Pinang', 1200000),
(209, 17, 'Desa Long Beleh Haloq', 1200000),
(210, 17, 'Desa Long Beleh Modang', 1200000),
(211, 18, 'Seluruh Desa Wilayah Tabang', 2000000),
(357, 5, 'Desa Loa Kulu Kota/Seberang', 200000),
(358, 8, 'Kelurahan Muara Jawa Pesisir', 300000),
(359, 9, 'Kelurahan Teluk Pemedas', 300000),
(360, 9, 'Kelurahan Handil Baru Darat', 300000),
(361, 9, 'Kelurahan Karya Merdeka', 300000),
(362, 10, 'Desa Badak Mekar', 350000),
(363, 12, 'Desa Puan Cepak', 600000),
(364, 12, 'Desa Liang Buaya', 500000),
(365, 13, 'Desa Kedang Murung', 500000),
(366, 13, 'Desa Wono Sari', 800000),
(367, 13, 'Desa Sebelimbingan', 600000),
(368, 15, 'Desa Pulau Harapan', 800000);

Index

ALTER TABLE `kecamatan`
  ADD PRIMARY KEY (`id`);
ALTER TABLE `perkara`
  ADD PRIMARY KEY (`id`);
ALTER TABLE `radius`
  ADD PRIMARY KEY (`id`),
  ADD KEY `kecamatan` (`kecamatan`);
ALTER TABLE `kecamatan`
  MODIFY `id` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=19;
ALTER TABLE `perkara`
  MODIFY `id` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=7;
ALTER TABLE `radius`
  MODIFY `id` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=369;
ALTER TABLE `radius`
  ADD CONSTRAINT `radius_ibfk_1` FOREIGN KEY (`kecamatan`) REFERENCES `kecamatan` (`id`) ON DELETE CASCADE ON UPDATE CASCADE;

Halaman Index

Pertama-tama kita buat terlebih dahulu folder di C:\xampp\htdocs dan beri nama foldernya panjar_perkara dan di dalam folder tersebut buat file dengan nama index.html dan juga folder dengan nama asset dan proses.

File index.html digunakan untuk menampilkan halaman website. Folder asset berisikan css dan javascript. Dan folder proses berisikan file php yang akan digunakan untuk mengambil data dari database.

Buka file index.html dengan text editor, kalo saya menggunakan VS Code untuk text editor. Dan isikan kode berikut :

<!DOCTYPE html>
  <html>
  <head>
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Taksiran Panjar Biaya Perkara</title>
      <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
      <link rel="stylesheet" type="text/css" href="asset/css/custom.css">
  </head>
  <body>
      <div class="container">
          <img src="asset/img/banner-pa-tenggarong.png" class="img-fluid bener">
  
          <h2 class="kapital text-tengah">Taksiran Panjar Biaya Perkara</h1>
  
          <form>
              <div class="form-group">
                  <label for="perkara">Perkara</label>
                  <select class="form-control kapital-each-word" id="perkara" required="">
                      <option value="">--Silahkan Pilih Perkara--</option>
                  </select>
              </div>
              
          </form>
          <div class="table-responsive">
              <table class="table table-bordered table-hover" id="tabel-perkara">
                  <thead>
                      <tr>
                          <th scope="col" colspan="6" id="judul-perkara" class="kapital text-tengah">Judul Perkara</th>
                      </tr>
                      <tr class="text-tengah">
                          <th scope="col">Pelapor</th>
                          <th scope="col">Kecamatan</th>
                          <th scope="col">Kelurahan</th>
                          <th scope="col">Jumlah Panggilan</th>
                          <th scope="col">Biaya Perkara</th>
                          <th scope="col">Total Biaya</th>
                      </tr>
                  </thead>
                  <tbody>
                      <tr>
                          <th scope="row" id="pelapor">Penggugat</th>
                          <td>
                              <select id="kecamatan-penggugat" required="">
                                  <option value="">--Pilih--</option>
                              </select>
                          </td>
                          <td>
                              <select id="kelurahan-penggugat" required="">
                                  <option value="">--Pilih Kecamatan Dahulu--</option>
                              </select>
                          </td>
                          <td id="panggilan-penggugat">0</td>
                          <td id="biaya-penggugat">0</td>
                          <td id="total-penggugat">0</td>
                      </tr>
                      <tr id="tr-ongkir-p" class="lainnya-p ilang">
                          <th scope="row" colspan="5" class="text-kanan">Ongkir</th>
                          <td id="biaya-ongkir-p">
                              <input type="number" step="1000" name="biaya-ongkir-p" class="text-kanan">
                          </td>
                      </tr>
                      <tr id="tr-pengembalian-p" class="lainnya-p ilang">
                          <th scope="row" colspan="5" class="text-kanan">Biaya Pengembalian</th>
                          <td id="biaya-pengembalian-p">
                              <input type="number" step="1000" name="biaya-pengembalian-p" class="text-kanan">
                          </td>
                      </tr>
                      <tr>
                          <th scope="row" id="terlapor">Tergugat</th>
                          <td>
                              <span class="gaib ilang">Mass Media</span>
                              <select id="kecamatan-tergugat" required="">
                                  <option value="">--Pilih--</option>
                              </select>
                          </td>
                          <td>
                              <span class="gaib ilang">Mass Media</span>
                              <select id="kelurahan-tergugat" required="">
                                  <option value="">--Pilih Kecamatan Dahulu--</option>
                              </select>
                          </td>
                          <td id="panggilan-tergugat">0</td>
                          <td id="biaya-tergugat">
                              <!-- <input type="number" step="1000" name="manual_biaya_tergugat" value="" style="text-align:right;"> -->
                          </td>
                          <td id="total-tergugat">0</td>
                      </tr>
                      <tr id="tr-ongkir-t" class="lainnya-t ilang">
                          <th scope="row" colspan="5" class="text-kanan">Ongkir</th>
                          <td id="biaya-ongkir">
                              <input type="number" step="1000" name="biaya-ongkir-t" class="text-kanan">
                          </td>
                      </tr>
                      <tr id="tr-pengembalian" class="lainnya-t ilang">
                          <th scope="row" colspan="5" class="text-kanan">Biaya Pengembalian</th>
                          <td id="biaya-pengembalian-t">
                              <input type="number" step="1000" name="biaya-pengembalian-t" class="text-kanan">
                          </td>
                      </tr>
                      <tr id="tr-pip">
                          <th scope="row" colspan="5" class="text-kanan">PIP</th>
                          <td id="biaya-pip">0</td>
                      </tr>
                      <tr id="tr-admin">
                          <th scope="row" colspan="5" class="text-kanan">ADMINISTRASI</th>
                          <td id="biaya-adm">0</td>
                      </tr>
                      <tr id="tr-pengumuman">
                          <th scope="row" colspan="5" class="text-kanan">PENGUMUMAN</th>
                          <td id="biaya-pengumuman">0</td>
                      </tr>
                      <tr id="tr-skum">
                          <th scope="row" colspan="5" class="text-kanan">SKUM</th>
                          <td id="total-biaya">0</td>
                      </tr>
                  </tbody>
              </table>
          </div>
      </div>
  
  <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
  
  <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
  <script src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
  <script src="asset/js/index.js"></script>
  
  </body>
  </html>

Kemudian pada folder asset buat folder baru, css, img, dan js. Tampilan foldernya seperti berikut :

Buka folder CSS dan buat file bernama custom.css dan isikan kode berikut :

.kapital{
      text-transform: uppercase;
  }
  
  .kapital-each-word {
      text-transform: capitalize;
  }
  
  .ilang {
      display: none;
  }
  
  .text-kanan {
      text-align: right;
  }
  
  .text-tengah {
      text-align: center;
  }
  
  .bener {
      margin-bottom: 2rem;
  }

Kemudian buka folder img, dan masukkan gambar di bawah ini ke folder tersebut.

Untuk folder js nanti kita akan isikan file js untuk mengambil data dari database, tapi sebelum itu kita buat koneksi terlebih dahulu menggunakan php.

Koneksi Database

Sekarang kita akan membuat file php untuk mengambil data dari database. Pertama-tama kita buka folder proses kemudian buat file dengan nama konfig.php. Dan masukkan kode berikut :

<?php 
  define('DB_USER', 'root');
  define('DB_PASSWORD', '');
  define('DB_DATABASE', 'panjar_biaya');
  define('DB_SERVER', 'localhost');
  ?>

Saya akan menjelaskan maskud dari kode di atas. Pada baris kedua kita mendeklarasikan variabel dengan nama DB_USER adalah root dan variabel lainnya. Kenapa harus repot-repot deklarasi di sini? Agar nantinya apabila ada perubahan database, kita hanya perlu mengubah variabel nya di sini.

Selanjutnya masih di folder proses kita buat file dengan nama koneksi.php dan masukkan kode berikut :

<?php 
  class DB_CONNECT
  {
      function __construct()
      {
          $this->connect();
      }
      function __destruct()
      {
          $this->close();
      }
  
      function connect()
      {
          require_once 'konfig.php';
          $con = mysql_connect(DB_SERVER, DB_USER, DB_PASSWORD) or die(mysql_error());
          $db = mysql_select_db(DB_DATABASE) or die(mysql_error());
          return $con;
      }
  
      function close()
      {
          mysql_close();
      }
  }
  
   ?>

Kode di atas untuk menghubungkan aplikasi kita dengan database.

Mengambil Data

Nah untuk mengambil data dari database, kita gunakan php dan juga javascript. Langkah pertama kita buat terlebih dahulu file php yang nanti akan dipanggil oleh javascript.

Data Perkara

Buka folder proses, buat file dengan nama perkara-read.php dan masukkan kode berikut :

<?php 
  $response = array();
  require_once 'koneksi.php';
  $db = new DB_CONNECT();
  $sql = "select * from perkara";
  $perkara_result = mysql_query($sql) or die(mysql_error());
  if (mysql_num_rows($perkara_result) > 0) {
      $response['perkara'] = array();
      while ($row = mysql_fetch_array($perkara_result)) {
          $perkara = array();
          $perkara['id'] = $row['id'];
          $perkara['perkara'] = $row['perkara'];
          array_push($response['perkara'], $perkara);
      }
      $response['success'] = 1;
      echo json_encode($response);
  }else{
      $response['success'] = 0;
      echo json_encode($response);
  }
  
   ?>

Kode di atas untuk mengambil semua data perkara yang ada di database. Perkara yang dimaksudkan di sini adalah jenis perkara yang sering diajukan di Pengadilan Agama. Saya jelaskan sedikit tentang apa saja jenis perkara yang pada umumnya sering diajukan oleh para pencari keadilan.

Cerai Gugat

Gugatan perceraian diajukan oleh istri atau kuasanya pada Pengadilan Agama, yang daerah hukumnya mewilayahi tempat tinggal penggugat kecuali istri meninggalkan tempat kediaman tanpa izin suami.

Cerai Gugat Ghaib

Sama seperti cerai gugat hanya saja jika sang suami tidak diketahui keberadaannya.

Cerai Talak

Seorang suami yang akan menjatuhkan talak kepada istrinya mengajukan permohonan baik lisan maupun tertulis kepada Pengadilan Agama yang mewilayahi tempat tinggal istri disertai dengan alasan serta meminta agar diadakan sidang untuk keperluan itu.

Cerai Talak Ghaib

Sama seperti cari talak hanya saja jika sang istri tidak diketahui keberadaannya.

Dispensasi Nikah

Dispensasi nikah adalah untuk perkawinan yang calon mempelai laki- laki ataupun perempuannya masih di bawah umur dan belum diperbolehkan untuk menikah sesuai dengan peraturan perundang-undangan yang berlaku.

Isbat Nikah

Isbat nikah adalah permohonan pengesahan nikah yang diajukan kepengadilan untuk dinyatakan sah-nya pernikahan dan memiliki kekuatan hukum.

Data Kecamatan

Kita lanjut untuk mengambil data kecamatan. Kenapa langsung data kecamatan, kenapa tidak data kota/kabupaten yang kita ambil. Aplikasi Hitung Panjar Biaya Perkara yang kita buat hanya mengambil data radius di wilayah yuridiksi Pengadilan Agama Tenggarong. Untuk penggunaan di Pengadilan Agama yang lain, tinggal di sesuaikan datanya di database.

Masih di folder proses, buatlah file dengan nama kecamatan-read.php dan masukkan kode berikut :

<?php 
  $response = array();
  require_once 'koneksi.php';
  $db = new DB_CONNECT();
  $sql = "select * from kecamatan order by kecamatan";
  $kecamatan_result = mysql_query($sql) or die(mysql_error());
  if (mysql_num_rows($kecamatan_result) > 0) {
      $response['kecamatan'] = array();
      while ($row = mysql_fetch_array($kecamatan_result)) {
          $kecamatan = array();
          $kecamatan['id'] = $row['id'];
          $kecamatan['kecamatan'] = $row['kecamatan'];
          array_push($response['kecamatan'], $kecamatan);
      }
      $response['success'] = 1;
      echo json_encode($response);
  }else{
      $response['success'] = 0;
      echo json_encode($response);
  }
  
   ?>

Data Kelurahan

Buatlah file dengan nama kelurahan-read.php dan masukkan kode berikut :

<?php 
  
  $response = array();
  require_once 'koneksi.php';
  $db = new DB_CONNECT();
  if(isset($_POST["id"])){
  $id_kecamatan = $_POST["id"];
  
  $sql = "select * from radius where kecamatan=".$id_kecamatan." order by kelurahan";
  $kelurahan_result = mysql_query($sql) or die(mysql_error());
  if (mysql_num_rows($kelurahan_result) > 0) {
      $response['kelurahan'] = array();
      while ($row = mysql_fetch_array($kelurahan_result)) {
          $kelurahan = array();
          $kelurahan['id'] = $row['id'];
          $kelurahan['kecamatan'] = $row['kecamatan'];
          $kelurahan['kelurahan'] = $row['kelurahan'];
          $kelurahan['biaya'] = $row['biaya'];
          array_push($response['kelurahan'], $kelurahan);
      }
      $response['success'] = 1;
      echo json_encode($response);
  }else{
      $response['success'] = 0;
      echo json_encode($response);
  }
  }else{
      echo "gak di set";
  }
  
   ?>

Data Radius

Buatlah file dengan nama detail-radius.php dan masukkan kode berikut :

<?php 
  $response = array();
  require_once 'koneksi.php';
  $db = new DB_CONNECT();
  if (isset($_POST['id'])) {
      $id_kelurahan = $_POST['id'];
      $sql = "select * from radius where id=".$id_kelurahan;
      $result = mysql_query($sql) or die(mysql_error());
      $response['radius'] = array();
      while ($row = mysql_fetch_array($result)) {
          $radius = array();
          $radius['id'] = $row['id'];
          $radius['kecamatan'] = $row['kecamatan'];
          $radius['kelurahan'] = $row['kelurahan'];
          $radius['biaya'] = $row['biaya'];
          array_push($response['radius'], $radius);
      }
      $response['success'] = 1;
      echo json_encode($response);
  }else{
      $response['success'] = 0;
      echo json_encode($response);
  }
  ?>

Nah sampai sini kita sudah membuat file php untuk mengambil data dari database. Untuk selanjutnya kita buat javascriptnya yang digunakan untuk memanggil fungsi dari file php yang sudah kita buat tadi dan menampilkan ke halaman website kita.

Menampilkan Data

Buka folder asset, kemudian folder js dan buat file dengan nama index.js dan masukkan kode berikut

Deklarasi Variabel

var svr = '/panjar_perkara/proses/';
  var tot_penggugat = 0;
  var tot_tergugat = 0;
  var adm = 0;
  var total_biaya = 0;
  var panggilan_penggugat = 0;
  var panggilan_tergugat = 0;
  var pip = 0;
  var pengumuman = 0;
  var ghaib = 0;
  var perkara = "";
  var ongkir_p = 0;
  var ongkir_t = 0;
  var pengembalian_p = 0;
  var pengembalian_t = 0;

Kode di atas adalah variabel yang akan kita gunakan.

Ambil Data Perkara

$.ajax({
      url: svr+"perkara-read.php",
      type: 'post',
      dataType: 'json',
      success: function(respon){
          if(respon.success==1){
              var data_perkara = respon.perkara;
              $.each(data_perkara, function(k, v){				
                  $("select#perkara").append("<option value='"+v.perkara+"'>"+v.perkara+"</option>");
              });
          }
      },
      error: function(err){
          alert("ada masalah, harap refresh halaman");
          console.log(err);		
      }
  });

Setelah website berhasil terbuka, fungsi di atas akan dijalankan dan memanggil data perkara. Sehingga pengguna bisa menghitung biaya perkara berdasarkan jenis perkaranya.

Ambil Data Kecamatan

$.ajax({
      url: svr+"kecamatan-read.php",
      type: 'post',
      dataType: 'json',
      success: function(respon){
          if(respon.success==1){
              var data_kecamatan =  respon.kecamatan;
              $.each(data_kecamatan, function(k,v){
                  $("select#kecamatan-penggugat").append("<option value="+v.id+">"+v.kecamatan+"</option>");
                  $("select#kecamatan-tergugat").append("<option value="+v.id+">"+v.kecamatan+"</option>");
              });
              console.log('data kecamatan ada');
          }
          else{
              console.log("data kecamatan kosong");
          }
      },
      error: function(err){
          alert("ada masalah, harap refresh halaman");
          console.log(err);
      }
  });

Oke, selanjutnya kita buat bagaimana agar pengguna bisa menghitung biaya perkara. Setelah data perkara dan data kecamatan tampil. Pengguna memilih jenis perkara terlebih dahulu. Kemudian terdapat baris para pihak. Baris para pihak ini menentukan biaya yang akan dibayar untuk berperkara di Pengadilan Agama. Terdapat beberapa jenis pihak :

Penggugat dan Tergugat
Pemohon dan Termohon
Pemohoon I dan Pemohon II

Untuk itu alamat para pihak harus diisi, mulai dari memilih kecamatan, kemudian memilih desa/kelurahan. Kita buat listener apabila pengguna sudah memilih jenis perkaranya. Tambahkan kode berikut di file yang sama yaitu index.js

$('select#perkara').on('change', function(){
      tot_penggugat = 0;
      tot_tergugat = 0;
      adm = 0;
      total_biaya = 0;
      panggilan_penggugat = 0;
      panggilan_tergugat = 0;
      pip = 0;
      pengumuman = 0;
      ghaib = 0;
      perkara = this.value;
      ongkir_p = 0;
      ongkir_t = 0;
      pengembalian_p = 0;
      pengembalian_t = 0;
      $("select#kecamatan-penggugat").val($("option:first", this).val());
      $("select#kecamatan-tergugat").val($("option:first", this).val());
      $("select#kelurahan-penggugat").empty();
      $("select#kelurahan-penggugat").append("<option value=>--Pilih Kecamatan Dahulu--</option>");
      $("select#kelurahan-tergugat").empty();
      $("select#kelurahan-tergugat").append("<option value=>--Pilih Kecamatan Dahulu--</option>");
      $("td#panggilan-penggugat").empty();
      $("td#panggilan-tergugat").empty();
      $("td#biaya-penggugat").empty();
      $("td#biaya-tergugat").empty();
      $("td#total-penggugat").empty();
      $("td#total-tergugat").empty();
      $("td#biaya-pip").empty();
      $("td#biaya-adm").empty();
      $("td#biaya-pengumuman").empty();
      $("td#total-biaya").empty();
      $('select#kecamatan-tergugat').show();
      $('select#kelurahan-tergugat').show();
      $('.gaib').hide();
      $("option[value='0']").remove();
      $("input[name='biaya-ongkir-p']").val('');
      $("input[name='biaya-ongkir-t']").val('');
      $("input[name='biaya-pengembalian-p']").val('');
      $("input[name='biaya-pengembalian-t']").val('');
      $('.lainnya-p').hide();
      $('.lainnya-t').hide();	
  
      switch(this.value){
          case "cerai gugat":
          $('#tr-pip').hide();
          $('#tr-admin').show();
          $('#tr-pengumuman').hide();
          $('#tr-skum').show();
          $('#pelapor').text("Penggugat");
          $('#terlapor').text("Tergugat");
          $('#judul-perkara').text(this.value);
          panggilan_penggugat = 2;
          panggilan_tergugat = 3;
          adm = 126000;
          $('#panggilan-penggugat').text(panggilan_penggugat);
          $('#panggilan-tergugat').text(panggilan_tergugat);
          $('#biaya-adm').text(format_duit(adm));
          $('select#kecamatan-penggugat').prop('disabled', false);
          $('select#kecamatan-tergugat').prop('disabled', false);
          $("select#kecamatan-penggugat").append("<option value='0'>Lainnya</option>");
          $("select#kecamatan-tergugat").append("<option value='0'>Lainnya</option>");
          break;
  
          case "cerai gugat ghaib":
          $('#tr-pip').show();
          $('#tr-admin').show();
          $('#tr-pengumuman').hide();
          $('#tr-skum').show();
          $('#pelapor').text("Penggugat");
          $('#terlapor').text("Tergugat");
          $('#judul-perkara').text(this.value);
          $('select#kecamatan-tergugat').hide();
          $('select#kelurahan-tergugat').hide();
          $('.gaib').show();
  
          panggilan_penggugat = 2;
          panggilan_tergugat = 2;
          adm = 126000;
          pip = 30000;
          tot_tergugat = panggilan_tergugat*60000;
          $('#panggilan-penggugat').text(panggilan_penggugat);
          $('#panggilan-tergugat').text(panggilan_tergugat);
          $('#biaya-adm').text(format_duit(adm));
          $('#biaya-pip').text(format_duit(pip));
          $("td#biaya-tergugat").text(format_duit(60000));
          $("td#total-tergugat").text(format_duit(tot_tergugat));
          $("select#kecamatan-penggugat").append("<option value='0'>Lainnya</option>");
          break;
  
          case "cerai talak":
          $('#tr-pip').hide();
          $('#tr-admin').show();
          $('#tr-pengumuman').hide();
          $('#tr-skum').show();
          $('#pelapor').text("Pemohon");
          $('#terlapor').text("Termohon");
          $('#judul-perkara').text(this.value);
          panggilan_penggugat = 3;
          panggilan_tergugat = 4;
          adm = 126000;
          $('#panggilan-penggugat').text(panggilan_penggugat);
          $('#panggilan-tergugat').text(panggilan_tergugat);
          $('#biaya-adm').text(format_duit(adm));
          $('select#kecamatan-penggugat').prop('disabled', false);
          $('select#kecamatan-tergugat').prop('disabled', false);
          $("select#kecamatan-penggugat").append("<option value='0'>Lainnya</option>");
          $("select#kecamatan-tergugat").append("<option value='0'>Lainnya</option>");
          break;
  
          case "cerai talak ghaib":
          $('#tr-pip').show();
          $('#tr-admin').show();
          $('#tr-pengumuman').hide();
          $('#tr-skum').show();
          $('#pelapor').text("Pemohon");
          $('#terlapor').text("Termohon");
          $('#judul-perkara').text(this.value);
          $('select#kecamatan-tergugat').hide();
          $('select#kelurahan-tergugat').hide();
          $('.gaib').show();
  
          panggilan_penggugat = 3;
          panggilan_tergugat = 2;
          adm = 126000;
          pip = 30000;
          tot_tergugat = panggilan_tergugat*60000;
          $('#panggilan-penggugat').text(panggilan_penggugat);
          $('#panggilan-tergugat').text(panggilan_tergugat);
          $('#biaya-adm').text(format_duit(adm));
          $('#biaya-pip').text(format_duit(pip));
          $("td#biaya-tergugat").text(format_duit(60000));
          $("td#total-tergugat").text(format_duit(tot_tergugat));
          $("select#kecamatan-penggugat").append("<option value='0'>Lainnya</option>");
          break;
  
          case "dispensasi nikah":
          $('#tr-pip').hide();
          $('#tr-admin').show();
          $('#tr-pengumuman').hide();
          $('#tr-skum').show();
          $('#pelapor').text("Pemohon I");
          $('#terlapor').text("Pemohon II");
          $('#judul-perkara').text(this.value);
          panggilan_penggugat = 2;
          panggilan_tergugat = 2;
          adm = 126000;
          $('#panggilan-penggugat').text(panggilan_penggugat);
          $('#panggilan-tergugat').text(panggilan_tergugat);
          $('#biaya-adm').text(format_duit(adm));
          $('select#kecamatan-penggugat').prop('disabled', false);
          $('select#kecamatan-tergugat').prop('disabled', false);
          break;
  
          case "isbat nikah":
          $('#tr-pip').hide();
          $('#tr-admin').show();
          $('#tr-pengumuman').show();
          $('#tr-skum').show();
          $('#pelapor').text("Pemohon I");
          $('#terlapor').text("Pemohon II");
          $('#judul-perkara').text(this.value);
          panggilan_penggugat = 2;
          panggilan_tergugat = 2;
          adm = 116000;
          pengumuman = 60000;
          $('#panggilan-penggugat').text(panggilan_penggugat);
          $('#panggilan-tergugat').text(panggilan_tergugat);
          $('#biaya-adm').text(format_duit(adm));
          $('#biaya-pengumuman').text(format_duit(pengumuman));
          $('select#kecamatan-penggugat').prop('disabled', false);
          $('select#kecamatan-tergugat').prop('disabled', false);
          break;
  
          default :
          $('select#kecamatan-penggugat').prop('disabled', 'disabled');
          $('select#kecamatan-tergugat').prop('disabled', 'disabled');
          break;
      }
  });

Ambil Data Kelurahan

$('select#kecamatan-penggugat').on('change', function(){
      var id_kecamatan_penggugat = this.value;
      if(this.value!="" && this.value!=0){
          $('.lainnya-p').hide();
          ongkir_p = 0;
          pengembalian_p = 0;
          $("td#total-biaya").empty();
          $.ajax({
              url: svr+"kelurahan-read.php",
              type: 'post',
              data: {
                  id: id_kecamatan_penggugat,
              },
              dataType: 'json',
              success: function(respon){
                  if (respon.success==1) {
                      $("select#kelurahan-penggugat").empty();
                      $("select#kelurahan-penggugat").append("<option value=>--Pilih kelurahan--</option>");
                      $("td#biaya-penggugat").empty();
                      $("td#total-penggugat").empty();
                      var data_kelurahan_penggugat = respon.kelurahan;
                      $.each(data_kelurahan_penggugat, function(k,v){
                          $("select#kelurahan-penggugat").append("<option value="+v.id+">"+v.kelurahan+"</option>");
                      });
                  }else{
                      console.log("data kelurahan penggugat kosong");
                  }
              },
              error: function(err){
                  alert("ada masalah, harap refresh halaman");
                  console.log(err);
              }
          });
      }
      else {
          $('.lainnya-p').show();
          $("td#total-biaya").empty();
          $("td#biaya-penggugat").empty();
          $("td#total-penggugat").empty();
          $("select#kelurahan-penggugat").empty();
          $("select#kelurahan-penggugat").append("<option>Masukkan biaya di kolom samping</option>");
          $("td#biaya-penggugat").append("<input type='number' step='1000' name='manual_biaya_p' required class='text-kanan'> ");
          $("input[name='manual_biaya_p']").on('input', function() {
              tot_penggugat = panggilan_penggugat*$(this).val();
              console.log("penggugat =" + $(this).val());
              console.log("total penggugat = " + tot_penggugat);
              $("td#total-penggugat").text(format_duit(tot_penggugat));
              SKUM();
          });
      }
  });
  
  $('select#kecamatan-tergugat').on('change', function(){
      if (this.value!="" && this.value!=0) {
          $('.lainnya-t').hide();
          $("td#total-biaya").empty();
          ongkir_t = 0;
          pengembalian_t = 0;
          $.ajax({
              url: svr+"kelurahan-read.php",
              type: 'post',
              data: {
                  id: this.value,
              },
              dataType: 'json',
              success: function(respon){
                  if (respon.success==1) {
                      $("select#kelurahan-tergugat").empty();
                      $("select#kelurahan-tergugat").append("<option value=>--Pilih kelurahan--</option>");
                      $("td#biaya-tergugat").empty();
                      $("td#total-tergugat").empty();
                      var data_kelurahan_tergugat = respon.kelurahan;
                      $.each(data_kelurahan_tergugat, function(k,v){
                          $("select#kelurahan-tergugat").append("<option value="+v.id+">"+v.kelurahan+"</option>");
                      });
                  }else{
                      console.log("data kelurahan tergugat kosong");
                  }
              },
              error: function(err){
                  alert("ada masalah, harap refresh halaman");
                  console.log(err);
              }
          });
      }
      else {
          $('.lainnya-t').show();
          $("td#total-biaya").empty();
          $("td#biaya-tergugat").empty();
          $("td#total-tergugat").empty();
          $("select#kelurahan-tergugat").empty();
          $("select#kelurahan-tergugat").append("<option>Masukkan biaya di kolom samping</option>");
          $("td#biaya-tergugat").append("<input type='number' step='1000' name='manual_biaya_t' required style='text-align:right;'> ");
          $("tr#tr-ongkir-t").show();
          $("tr#tr-pengembalian").show();
          $("input[name='manual_biaya_t']").on('input', function() {
              tot_tergugat = panggilan_tergugat*$(this).val();
              console.log("tergugat =" + $(this).val());
              console.log("total tergugat = " + tot_tergugat);
              $("td#total-tergugat").text(format_duit(tot_tergugat));
              SKUM();
          });
      }
  });

Memilih Kelurahan

$('select#kelurahan-penggugat').on('change', function(){
      if (this.value!="") {
          $.ajax({
              url: svr+"detail-radius.php",
              type: 'post',
              data: {
                  id: this.value,
              },
              dataType: 'json',
              success: function(respon){
                  if (respon.success==1) {
                      var data_radius_penggugat = respon.radius;					
                      tot_penggugat = panggilan_penggugat*data_radius_penggugat[0].biaya;					
                      $("td#biaya-penggugat").text(format_duit(data_radius_penggugat[0].biaya));
                      $("td#total-penggugat").text(format_duit(tot_penggugat));
                      SKUM();
                  }else{
                      console.log("gagal ambil detail radius penggugat");
                  }
              },
              error: function(err){
                  alert("ada masalah, harap refresh halaman");
                  console.log(err);
              }
          });
      }
  });
  
  $('select#kelurahan-tergugat').on('change', function(){
      if (this.value!="") {
          $.ajax({
              url: svr+"detail-radius.php",
              type: 'post',
              data: {
                  id: this.value,
              },
              dataType: 'json',
              success: function(respon){
                  if (respon.success==1) {
                      var data_radius_tergugat = respon.radius;
                      if (perkara == "cerai gugat ghaib" || perkara == "cerai talak ghaib") {						
                          tot_tergugat = 120000;					
                      }else{
                          tot_tergugat = panggilan_tergugat*data_radius_tergugat[0].biaya;
                      }					
                      if(perkara == "cerai gugat ghaib" || perkara == "cerai talak ghaib"){						
                          $("td#biaya-tergugat").text(format_duit(120000));
                      }
                      else{
                          $("td#biaya-tergugat").text(format_duit(data_radius_tergugat[0].biaya));
                      }
                      $("td#total-tergugat").text(format_duit(tot_tergugat));
                      SKUM();
                  }else{
                      console.log("gagal ambil detail radius tergugat");
                  }
              },
              error: function(err){
                  alert("ada masalah, harap refresh halaman");
                  console.log(err);
              }
          });
      }
  });

Sampai di sini data radius sudah kita dapat untuk tiap pihak. Selanjutnya kita buat untuk proses perhitungan berdasarkan data radius yang sudah didapat dari tiap pihak berdasarkan alamatnya.

Proses Perhitungan

function SKUM(){
      switch(perkara){
          case "cerai gugat":
          total_biaya = tot_penggugat+tot_tergugat+adm+ parseInt(ongkir_p*2) + parseInt(pengembalian_p*2) + parseInt(ongkir_t*3) + parseInt(pengembalian_t*3);
          $("td#total-biaya").text(format_duit(total_biaya));
          break;
  
          case "cerai gugat ghaib":
          total_biaya = parseInt(tot_penggugat) + parseInt(tot_tergugat) + parseInt(pip) + parseInt(adm) + parseInt(ongkir_p*2) + parseInt(pengembalian_p*2);		
          $("td#total-biaya").text(format_duit(total_biaya));
          break;
  
          case "cerai talak":
          total_biaya = tot_penggugat+tot_tergugat+adm+ parseInt(ongkir_p*3) + parseInt(pengembalian_p*3) + parseInt(ongkir_t*4) + parseInt(pengembalian_t*4);
          $("td#total-biaya").text(format_duit(total_biaya));
          break;
  
          case "cerai talak ghaib":
          total_biaya = parseInt(tot_penggugat) + parseInt(tot_tergugat) + parseInt(pip) + parseInt(adm) + parseInt(ongkir_p*3) + parseInt(pengembalian_p*3);
          $("td#total-biaya").text(format_duit(total_biaya));
          break;
  
          case "dispensasi nikah":
          total_biaya = tot_penggugat+tot_tergugat+adm;
          $("td#total-biaya").text(format_duit(total_biaya));
          break;
  
          case "isbat nikah":
          total_biaya = tot_penggugat+tot_tergugat+adm+pengumuman;
          $("td#total-biaya").text(format_duit(total_biaya));
          break;
      }
  }

Format Ke Rupiah

Agar mudah melihat nominal biaya yang harus dibayar, data perhitungan biaya kita buat menjadi seperti ini Rp. 1.326.000

function format_duit(bilangan){
      var	number_string = bilangan.toString(),
          sisa 	= number_string.length % 3,
          rupiah 	= number_string.substr(0, sisa),
          ribuan 	= number_string.substr(sisa).match(/\d{3}/g);
  
      if (ribuan) {
          separator = sisa ? '.' : '';
          rupiah += separator + ribuan.join('.');
      }
      return "Rp. " + rupiah;
  }

Berikan Peringatan

Apabila pengguna tidak memilih urutan yang tepat, berikan peringatan kepada pengguna untuk memilih sesuai urutan. Mulai dari memilih jenis perkara, kecamatan, hingga desa/kelurahan

$("select#kecamatan-penggugat").on('click', function(){
      if (perkara=="") {
          alert("Silahkan Pilih Perkara Terlebih Dahulu");
      }
  
  });
  
  $("select#kecamatan-tergugat").on('click', function(){
      if (perkara=="") {
          alert("Silahkan Pilih Perkara Terlebih Dahulu");
      }
  });
  
  $("input[name='biaya-ongkir-p']").on('input', function(){
      ongkir_p = $(this).val();
      SKUM();
  });
  
  $("input[name='biaya-ongkir-t']").on('input', function(){
      ongkir_t = $(this).val();
      SKUM();
  });
  
  $("input[name='biaya-pengembalian-p']").on('input', function(){
      pengembalian_p = $(this).val();
      SKUM();
  });
  
  $("input[name='biaya-pengembalian-t']").on('input', function(){
      pengembalian_t = $(this).val();
      SKUM();
  });

Sampai di sini aplikasi sudah bisa digunakan. Untuk cara penggunaannya bisa dilihat pada halaman selanjutnya.

Penggunaan

Untuk penggunaannya cukup mudah. Pengguna hanya perlu mengaksesnya melalui browser. Berikut petunjuknya

Buka browser dan masukkan alamatnya, contohnya http://localhost/panjar_biaya
Memilih jenis perkara yang akan diajukan

Cerai Gugat
Cerai Gugat Ghaib
Cerai Talak
Cerai Talak Ghaib
Dispensasi Nikah
Isbat Nikah

Memilih tempat kediaman para pihak

Untuk perkara ghaib pihak tergugat atau termohon dipanggil melalui mass media. Untuk perkara cerai gugat dan cerai talak ada kemungkinan pihak yang berada di luar daerah Pengadilan Agama Tenggarong sehingga perlu meminta bantuan Pengadilan Agama di daerah lain. Untuk itu perlu memasukkan data biaya panjar daerah tersebut dan biaya ongkos kirim dan pengembalian.

Setelah itu taksiran total biaya yang harus bayar dapat dilihat pada baris SKUM

Untuk melihat contoh yang sudah digunakan di Pengadilan Agama Tenggarong silahkan klik di sini

Hitung Panjar Biaya Perkara

Hitung Panjar Biaya Perkara

Membuat Database

Database panjar_biaya

Membuat Tabel

Tabel Kecamatan

Tabel Perkara

Tabel Radius

Memasukkan Data

Data Kecamatan

Data Perkara

Data Radius

Index

Halaman Index

Koneksi Database

Mengambil Data

Data Perkara

Data Kecamatan

Data Kelurahan

Data Radius

Menampilkan Data

Deklarasi Variabel

Ambil Data Perkara

Ambil Data Kecamatan

Ambil Data Kelurahan

Memilih Kelurahan

Proses Perhitungan

Format Ke Rupiah

Berikan Peringatan

Penggunaan

Posting Komentar

0 Komentar

Facebook

Popular Posts

Cari Blog Ini

Tags

Laporkan Penyalahgunaan

Popular

Pages

Hitung Panjar Biaya Perkara

Hitung Panjar Biaya Perkara

Membuat Database

Database panjar_biaya

Membuat Tabel

Tabel Kecamatan

Tabel Perkara

Tabel Radius

Memasukkan Data

Data Kecamatan

Data Perkara

Data Radius

Index

Halaman Index

Koneksi Database

Mengambil Data

Data Perkara

Data Kecamatan

Data Kelurahan

Data Radius

Menampilkan Data

Deklarasi Variabel

Ambil Data Perkara

Ambil Data Kecamatan

Ambil Data Kelurahan

Memilih Kelurahan

Proses Perhitungan

Format Ke Rupiah

Berikan Peringatan

Penggunaan

Anda mungkin menyukai postingan ini

Posting Komentar

0 Komentar

Social Plugin

Facebook

Popular Posts

Cari Blog Ini

Tags

Laporkan Penyalahgunaan

Popular

Pages