Mencari Solusi Pencarian Data By Kolom pada DataTables ServerSide

 Pada penerapan DataTables ServerSide biasanya menemui beberapa kendala diantaranya : 

1. Jumlah kolom yang berbentuk array, disini kita harus memahami jumlah kolom yang akan ditampilkan. Kemudian disesuaikan dengan ajax untuk menampilkan dataTables.

  $('#example1').DataTable( {

            "processing": true,

            "serverSide": true,

            "ajax": "./modul/aset-tetap-lain/load-data.php?d="+as+"&a="+ad+"&b="+ak,

            "columnDefs": [    

                { className: "UniqCenter", "targets": [ 15 ] },

                { className: "UniqRupiah", "targets": [ 16 ] },

                {

                "searchable"    : false,

                "orderable"     : false,

                "targets"       : 17,

                "render"        : function(data,type,row){  

                    // if(row["3"].length=='4'){

                    //  row["3"]='4';

                    // }  

                    // var btn="";

                    // return btn;

                    return data;

                            }

                }

            ]

        } );

$columns = array(    //disesuaikan dena SELECT di baris 45

            'NAMA_BARANG_BARU',

            'Nomor_Register',

            'Tahun_Pengadaan',

            'CMBMERK6',

            'TUKURAN7',

            'CMBBAHAN7',

            // 'no_pabrik',

            'TRANGKA6',

            'TMESIN6',//

            'TPOLISI6',

            'TNOMOR6',

            'TJUMLAH7',

            'Harga_Perolehan',

            'CMBASAL6'

           );

1. 
   
2. Proses pencarian pada semua kolom biasanya tidak berhasil dan akan mengakibatkan error pada tampilan. hal ini dikarenakan kolom yang akan ditampilkan merupakan gabungan (CONCAT) dari dua atau lebih kolom (field). maka disini kita harus menyesuaikan alias pada select tabel nya, harus sesuai dengan nama kolom (field) yang ada di tabel.

$sql = "SELECT a.kode,

CONCAT(a.KODE_BARU,'<br><b>',c.URAIAN ,'</b>') AS NAMA_BARANG_BARU,

FORMAT(a.Nomor_Register, 0) as Nomor_Register,  a.Tahun_Pengadaan as Tahun_Pengadaan,

CONCAT(IF(a.CMBMERK6<>'', a.CMBMERK6,  a.CMBMERK7) ,'<br>', IF(a.CMBTYPE7<>'',

a.CMBTYPE7, a.CMBTYPE6)) as CMBMERK6, TUKURAN7 AS TUKURAN7,  a.CMBBAHAN7 as CMBBAHAN7,

a.TRANGKA6 as TRANGKA6, a.TMESIN6 as TMESIN6, a.TPOLISI6 as TPOLISI6,

CONCAT(a.TNOMOR6, '<br>',a.DTPBPKB6) as TNOMOR6,  a.TJUMLAH7 as TJUMLAH7,

FORMAT(a.Harga_Perolehan, 0) Harga_Perolehan,

IF(substr(a.KODE_BARU,7,2)<='02', a.CMBASAL6, a.CMBASAL7) AS CMBASAL6 from  

tabel_transaksi as a  left join tbbarang as b on a.Kode_Barang=b.KODE_BARANG

left join tabel_barang_baru as c on a.KODE_BARU=c.KODE_BARU ";

 $where  = " a.KODE_KIB='2' AND a.KODE_BARU!=''";

Silahkan bandingkan dengan array Kolom pada point 1. 

Dengan begitu insya allah pencarian akan berjalan dengan baik.

text align for DataTables 1.10.10

 Membuat tampilan tabel dengan menggunakan dataTables serverside membutuhkan ketelitian dan kecermatan. Karena proses untuk membuat query select dan menampilkan pada modul lebih sulit dari dataTables maupun script native. 

Sebagai contoh salah satu untuk mengatur tampilan kolom rata kanan/kiri/center saja tidak bisa di tempatkan pada html td atau th pada tabel.

Contoh kasus saya membuat tampilan data aset menggunakan dataTables Serverside.

<script>

    $(document).ready(function() {

        var as = $('#a1').val();

        var ad=  $('#a2').val();

        var ak=  $('#a3').val();

       $('#example1').DataTable( {

            "processing": true,

            "serverSide": true,

            "ajax": "load-data.php?d="+as+"&a="+ad+"&b="+ak,

            "columnDefs": [    

                { className: "UniqRupiah", "targets": [ 12 ] //Menyisipkan class untuk text-align pada array 12

                },

                {

                "searchable"    : false,

                "orderable"     : false,

                "targets"       : 14,

                "render"        : function(data,type,row){  

                    var btn="<center> <a href=\"javascript:LoadEditData('"+btoa(row["14"])+"')\"

                    class=\"btn btn-sm btn-info\"><i class=\"fa fa-edit\"></i></a> <br> <br>

                    <a href=\"javascript:LoadDeleteData('"+btoa(row["14"])+"')\" class=\"btn btn-sm btn-danger\">

                    <i class=\"fa fa-trash\"></i> </a> ";

                    return btn;

                            }

                }

            ]

        } );

    } );

    </script>

Dengan menyisipkan kode :

{ className: "UniqRupiah", "targets": [ 12 ] },

kemudian kita menambahkan css sebagai berikut :

<style>

        .UniqRupiah {

            text-align: right;

        }

    </style>

Alhamdulillah tampilan text-align bisa di sesuaikan.

Mengatur Tombol Simpan Dengan Menggunakan Javascript "serialize"

Untuk kasus ini adalah saya membuat CRUD untuk SIMBADA versi.3. Dengan menggunakan tamplate dan tampilan form yang baru. Ada perubahan struktur program pada semua tampilan (modul). Sehingga proses penyesuaian koding membutuhkan waktu yang lumayan lama.

Mengawali dari merancang menu dan merancang halaman beranda dari SIMBADA. menyesuaikan struktur baru agar terlihat lebih enak di lihat. Modul beranda menampilkan rekap masing-masing KIB. Dengan data yang sangat banyak mengakibatkan load database lumayan lama.

Kemudian proses selanjutnya membuat CRUD dari beberapa menu master. Disini saya menggunakan method simpan dengan menggunakan javascript. Sehingga ada beberapa komponen yang perlu di sesuaikan. Sebagai contoh adalah tombol SIMPAN, yang tadi nya saya menggunakan komponen "button"

 

<button onClick="getSave()" type="submit" class="btn btn-sm btn-success">SIMPAN </button>

dan di sertakan method onClick pada prosesnya ternyata tidak bisa melakukan penyimpanan data. Dan proses aksi nya menjadikan refresh pada semua halaman. Saya pun mencari permasalahan tersebut dengan beberapa referensi. Dan akhirnya saya menemukan solusi untuk masalah tersebut, yaitu dengan menggunakan komponen "input" bukan dengan "button" 

<input onClick="getSave()" name="ubah" value="SIMPAN" class="btn btn-sm btn-success">

Kemudian dengan proses diatas bisa berjalan dengan baik dan proses simpan berhasil.

Saya kemudian menjumpai permasalahan lain, yaitu komponen select2 pada selectbox. Pada form ubah tidak bisa ngeload file select2.min.css dan select2.min.js yang saya letakan pada file index. Saya kemudian menuliskan link css dan js select2.min pada formulir ubah. Namun setelah di buka menjadikan tampilan formulir yang menggunakan select2 menjadi double form. 

Solusi yang yang saya terapkan adalah dengan merubah nama class pada formulir ubah, yaitu yang biasa menggunakan class select2 saya ubah menjadi select3 .

    $(function () {

        //Initialize Select2 Elements

        $(".select3").select2();  

      });

Berarti ada inisialisasi class form select2 sebanyak dua , yaitu :

    $(function () {

        //Initialize Select2 Elements

        $(".select2").select2();  

      });

Demikian sedikit pengalaman saya dalam melakukan proses peremajaan modul SIMBADA.

Terimakasih semoga bermanfaat.

CURL tidak berfungsi pada web HTTPS

Saya ingin membuat fungsi untuk menampilkan halaman getToken dengan url dari BKN dengan memasukkan beberapa parameter. Saya menggunakan library dari cURL. Saat di jalankan hasilnya error dikarenakan masalah certificate pada web HTTPS. 

Beberapa kali di coba untuk dijalankan, namun tetap saja tidak berhasil. Kemudian saya mencoba browsing untuk mencari solusi dari permasalahan yang saya alami. Dan alhamdulillah solusi ditemukan, yaitu dengan mematikan (disable/false) Verifikasi SSL nya.

Sebagai contoh :

$options = array(
      CURLOPT_RETURNTRANSFER => true, // to return web page
      CURLOPT_FOLLOWLOCATION => TRUE ,
      CURLOPT_URL            => $url,
      CURLOPT_USERAGENT      => $_SERVER['HTTP_USER_AGENT'],
      CURLOPT_TIMEOUT        => 40,
      CURLOPT_COOKIEJAR      => $tmpfname,
      CURLOPT_COOKIEFILE     => $tmpfname,

      ##Disable verify SSL##
      CURLOPT_SSL_VERIFYHOST => 0, // or false
      CURLOPT_SSL_VERIFYPEER => 0, // or false
  );

Jika merujuk pada fungsi yang saya buat, maka akan tampak kode program sebagai berikut :

       <?php

         $username ='??????';

        $password ='??????';

        $curl = curl_init();

        curl_setopt_array($curl, array(

          CURLOPT_URL => 'https://url......',

          CURLOPT_RETURNTRANSFER => true,

          CURLOPT_ENCODING => '',

          CURLOPT_MAXREDIRS => 10,

          CURLOPT_TIMEOUT => 0,

          CURLOPT_FOLLOWLOCATION => true,

          CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,

          CURLOPT_CUSTOMREQUEST => 'POST',

          CURLOPT_POSTFIELDS => 'grant_type=client_credentials',

          ##Disable verify SSL##

          CURLOPT_SSL_VERIFYHOST => 0, // or false

          CURLOPT_SSL_VERIFYPEER => 0, // or false

          CURLOPT_HTTPHEADER => array(

            'Content-Type: application/x-www-form-urlencoded',

            'Authorization: Basic ??????',

            'Cookie: pdns=1091068938.58148.0000'

          ),

        ));

       

        $response = curl_exec($curl);

       

        curl_close($curl);

        // echo $response;

        $jsonp= json_decode($response,1);

        $token  =$jsonp["access_token"];// kode Provider peserta, bukan kdPPK

        echo $token;

        ?>

Alhamdulillah token bisa tampil...

sumber : https://app.sko.dev/post/curl-tidak-berfungsi-pada-web-https