Perhitungan Matematika dengan Javascript

matematika

  • 2.5 jadi 3
<script>
function myFunction() {
    document.getElementById("demo").innerHTML = Math.round(2.5);
}
</script>

  • Replace character di javascript

var text = $(this).val();
var parseCTP = text.replace(',', '.');


  • Parsing
parseFloat(nilai_sebelumnyah);
parseInt(nilai_sebelumnyah);


  • Kondisi tidak input nilai
if (isNaN(inputNominal) === true){
....
}


  • Round untuk pembulatan ke atas
var x=sumNumber*100;
x=Math.round(x);
x=x/100; //or more compactly : 
var x= Math.round(someNumber*100)/100;


  • Fixed untuk memaksa angka di belakang koma


var n = 859.385;
console.log(n.fixed(2)); // 859.39

console.log(n.fixed(4)); // 859.3850


var twoPlacedFloat = parseFloat(n).toFixed(1); // 859.3


  • Mengambil karakter atau angka sebelum dan sesudah koma

var depan = nilai.substring(0, nilai.indexOf(".")); 

var belakang = nilai.substring(nilai.indexOf(".") + 1); 


  • Limit bilangan maksimal 4 angka di belakang koma
var limit = 4;
var angka = Math.floor(input_text * Math.pow(10, limit)) / Math.pow(10, limit);

  • to be continue....

Sekian, terimakasih atas kunjungannya.
Salam,
PHP Aku : Membangun web terorganisasi dan mudah dimengerti, contoh tutorial dengan menggunakan HTML, CSS, JavaScript, SQL, PHP, dan XML.

Cara Membuat Animasi Scroll ke Atas

scroll


Ketika sebuah halaman web memiliki artikel atau konten yang sangat panjang untuk dibaca, untuk mempermudah pembaca kembali ke posisi paling atas, kita sebaiknya menggunakan "Animated Scroll to Top". Berikut yang saya dapat contohkan:



<!doctype html>
<html lang="en" class="no-js">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Back To Top</title>
        <style type="text/css">
            /* Back to top button */
            .cd-top {
                display: inline-block;
                height: 40px;
                width: 40px;
                position: fixed;
                bottom: 40px;
                right: 10px;
                box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
                /* image replacement properties */
                overflow: hidden;
                text-indent: 100%;
                white-space: nowrap;
                background: rgba(232, 98, 86, 0.8) url(../images/cd-top-arrow.svg) no-repeat center 50%;
                visibility: hidden;
                opacity: 0;
                -webkit-transition: opacity .3s 0s, visibility 0s .3s;
                -moz-transition: opacity .3s 0s, visibility 0s .3s;
                transition: opacity .3s 0s, visibility 0s .3s;
            }
            .cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover {
                -webkit-transition: opacity .3s 0s, visibility 0s 0s;
                -moz-transition: opacity .3s 0s, visibility 0s 0s;
                transition: opacity .3s 0s, visibility 0s 0s;
            }
            .cd-top.cd-is-visible {
                /* the button becomes visible */
                visibility: visible;
                opacity: 1;
            }
            .cd-top.cd-fade-out {
                /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
                opacity: .5;
            }
            .no-touch .cd-top:hover {
                background-color: #e86256;
                opacity: 1;
            }
            @media only screen and (min-width: 768px) {
                .cd-top {
                    right: 20px;
                    bottom: 20px;
                }
            }
            @media only screen and (min-width: 1024px) {
                .cd-top {
                    height: 60px;
                    width: 60px;
                    right: 30px;
                    bottom: 30px;
                }
            }
        </style>
    </head>

    <body>
        ...content....
        <a href="#0" class="cd-top">Top</a>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

        <script type="text/javascript">
            jQuery(document).ready(function ($) {
                // browser window scroll (in pixels) after which the "back to top" link is shown
                var offset = 300,
                        //browser window scroll (in pixels) after which the "back to top" link opacity is reduced
                        offset_opacity = 1200,
                        //duration of the top scrolling animation (in ms)
                        scroll_top_duration = 700,
                        //grab the "back to top" link
                        $back_to_top = $('.cd-top');

                //hide or show the "back to top" link
                $(window).scroll(function () {
                    ($(this).scrollTop() > offset) ? $back_to_top.addClass('cd-is-visible') : $back_to_top.removeClass('cd-is-visible cd-fade-out');
                    if ($(this).scrollTop() > offset_opacity) {
                        $back_to_top.addClass('cd-fade-out');
                    }
                });

                //smooth scroll to top
                $back_to_top.on('click', function (event) {
                    event.preventDefault();
                    $('body,html').animate({
                        scrollTop: 0,
                    }, scroll_top_duration
                            );
                });
            });
        </script>

    </body>

</html>



Sumber: codyhouse[dot]co
Sekian, terimakasih atas kunjungannya.
Salam,
PHP Aku : Membangun web terorganisasi dan mudah dimengerti, contoh tutorial dengan menggunakan HTML, CSS, JavaScript, SQL, PHP, dan XML.

Syntax Extensible Markup Language (XML)

xml



Menulis kondisi XML di blogger

<b:if cond='data:blog.searchLabel == "Label Name">
  this will come up only on the label pages of 'Label Name'
</b:if>

to be continue....





Sekian, terimakasih atas kunjungannya.
Salam,
PHP Aku : Membangun web terorganisasi dan mudah dimengerti, contoh tutorial dengan menggunakan HTML, CSS, JavaScript, SQL, PHP, dan XML.

Membuat Daftar Data Menggunakan Data Table

dataTables



Berikut cara membuat listing menggunakan dataTables:

//css : jquery.dataTables.min.css

<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/s/dt/dt-1.10.10/datatables.min.css"/>

//js : jquery.dataTables.min.js

<script type="text/javascript" src="https://cdn.datatables.net/s/dt/dt-1.10.10/datatables.min.js"></script>

<form method="POST" action="<?php echo base_url('skpd/struktur_organisasi/proses_input_keg/' . $id_personil); ?>" enctype='multipart/form-data' class="formtambahpaket">
    <input type="hidden" name="id_personil" value="<?php echo $id_personil; ?>">

<table class="tabel table-bordered" width="100%" id="table">
    <thead>
        <tr>
             <th class="txt-c" width="70%">Kegiatan</th>
             <th class="txt-c" width="25%">Nama Staff</th>
             <th class="txt-c" width="5%" style="position: relative;"><input type="checkbox" id="flowcheckall" value="" title="Pilih Semua" /> <span style="">Pilih Semua</span></th>
        </tr>
    </thead>
    <?php foreach ($get_kegiatan as $row) { ?>
        <tr>
            <td>Text</td>
            <td>Text</td>
            <td align="center">
                <input class="cek" type="checkbox" name="keg[]" value="<?php echo $row->keg_key;?>"><label for=""></label>
            </td>
        </tr>
     <?php ?>
</table>
                    
<div class="form-group" style="padding-top: 20px; margin-bottom: -20px; text-align: center;">
                        
<div class="col-md-12  pull-right">
    <button class="btn btn-success" id="add" type="submit">Simpan</button>
    <button class="btn btn-danger" type="button" onclick="$.fancybox.close()">Batal</button>
</div>

</form>

<script type="text/javascript">
    $(document).ready(function () {
        var oTable = $('#table').DataTable({
            "paging": true,
            "ordering": false,
            "info": false,
            "bFilter": true,
            "bLengthChange": false,
            "iDisplayLength": 10, "responsive": true,
            "language": {
                "sSearch": "Cari",
                "zeroRecords": "Maaf data tidak ditemukan!",
                "infoEmpty": "Data yang dicari tidak ditemukan!"
            }
        });

        $('#flowcheckall').click(function (e) {
            var chk = $(this).prop('checked');
            $('input', oTable.$('tr', {"filter": "applied"})).prop('checked', chk);
        });

        $('input[name=cariiii]').on("keyup", function (e) {
            value = $(this).val();
            if (value.length > 3) { //
                oTable.columns(0).search(this.value).draw();
            } else if (value.length === 0) {
                oTable.columns(0).search(this.value).draw();
            }
            console.log(value);
        });

        $("form").submit(function (event) {
            var data = oTable.$(".cek:checked", {"page": "all"});
            var uniq_kode = [];
            data.each(function (index, elem) {
                uniq_kode [index] = $(elem).val();
            });
            //            alert(uniq_kode);
            //            return false;
            $("#add").text("menyimpan..");
            event.preventDefault();
            $.ajax({
                url: "<?php echo base_url($urlnya . '/proses_input_keg/' . $id_personil); ?>",
                type: 'POST',
                data: {keg: uniq_kode}, //$(this).serialize()
                success: function () {
                    setTimeout(function () {
                        //alert("Data berhasil ditambahkan!");
                        $.fancybox.close();
                        setTimeout(function () {
                            window.location.reload();
                        }, 500);
                    }, 500);
                }
            });
        });
    });
</script>




Sekian, terimakasih atas kunjungannya.
Salam,
PHP Aku : Membangun web terorganisasi dan mudah dimengerti, contoh tutorial dengan menggunakan HTML, CSS, JavaScript, SQL, PHP, dan XML.

Cara Redirect Halaman Menggunakan Meta

redirect


HTML redirects

C:/Users/harjuna88/Dropbox<meta http-equiv="refresh" content="0; URL='http://new-website.com'" />



Sekian, terimakasih atas kunjungannya.
Salam,
PHP Aku : Membangun web terorganisasi dan mudah dimengerti, contoh tutorial dengan menggunakan HTML, CSS, JavaScript, SQL, PHP, dan XML.

Cara Instal dan Konfigurasi XAMPP

xampp

XAMPP merupakan ..

Berikut cara menggunakannya untuk windows OS:
  1. Download xampp.zip disini
  2. Extrack di drive D atau keinginan kamu.
  3. Run setup_xampp.bat atau double click setup.exe jika xampp installer.
  4. Jalankan xampp_start.exe
  5. Buka php.ini di folder xampp/php/
  6. Hilangkan komen, ;extension=php_curl.dll --> hilangkan tanda ";" dan pgsql untuk postgreeSql
  7. Buka httpd.conf
  8. Cari kata "Listen 80" lalu ubah dengan port anda , disini saya mengubah dengan "Listen 8080"
  9. Cari lagi kata "ServerName Localhost:80" lalu ubah menjadi "ServerName Localhost:8080".
  10. Cari root dan ganti "DocumentRoot" ke Dropbox folder "C:/Users/userpc/Dropbox"
  11. Buka httpd-ssl.conf
  12. Cari kata "<VirtualHost _default_:443>" ganti dengan "<VirtualHost _default_:4499>"
  13. Cari lagi kata "ServerName localhost:443" ganti menjadi "ServerName localhost:4499"
  14. Restart XAMPP
  15. Run http://localhost:8080


Sekian, terimakasih atas kunjungannya.
Salam,
PHP Aku : Membangun web terorganisasi dan mudah dimengerti, contoh tutorial dengan menggunakan HTML, CSS, JavaScript, SQL, PHP, dan XML.

Hubungi Kami


kontak




Email: harjunacomsky@gmail.com [Subject: PhpAku]



Sekian, terimakasih atas kunjungannya.
Salam,
PHP Aku : Membangun web terorganisasi dan mudah dimengerti, contoh tutorial dengan menggunakan HTML, CSS, JavaScript, SQL, PHP, dan XML.

XAMPP - Port 80 in use by “Unable to open process”

xampp



Cara 1

  1. Open a CMD prompt and type in command: net stop was /y
  2. Run Dialog Box (press keys Win+R) .. then type: services.msc

Cara 2
So I have faced the same problem when trying to start apache service and I would like to share my solutions with you. Here is some notes about services or programs that may use port 80:

  1. Skype: skype uses port 80/443 by default. You can change this from tools->options-> advanced->connections and disable checkbox "use port 80 and 443 for addtional incoming connections".
  2. IIS: IIS uses port 80 be default so you need to shut down it. You can use the following two commands net stop w3svc net stop iisadmin
  3. SQL Server Reporting Service: You need to stop this service because it may take port 80 if IIS is not running. Go to local services and stop it.

Cara 3
In httpd.conf change:

Listen 80 to Listen 8080
ServerName localhost:80 to ServerName localhost:8080
In httpd-ssl.conf change:

Listen 443 to Listen 4433
<VirtualHost _default_:443> to <VirtualHost _default_:4433>
ServerName www.example.com:443 to ServerName www.example.com:4433



Sekian, terimakasih atas kunjungannya.
Salam,
PHP Aku : Membangun web terorganisasi dan mudah dimengerti, contoh tutorial dengan menggunakan HTML, CSS, JavaScript, SQL, PHP, dan XML.

Alternatif Libraries Untuk Membuat Laporan PDF

pdf

Berikut alternatif-alternatif yang dapat digunakan untuk membuat laporan dari PHP ke PDF:


Nanti jika saya sempatkan untuk mengupdate kelebihan dan kekurangan dari masing-masing serta cara menggunakannya.
See you next time.



Sekian, terimakasih atas kunjungannya.
Salam,
PHP Aku : Membangun web terorganisasi dan mudah dimengerti, contoh tutorial dengan menggunakan HTML, CSS, JavaScript, SQL, PHP, dan XML.

Problem Memory Limit Not Allowed di PHP

limit



  • Jika Anda bekerja di bawah apache webserver, Anda hanya dapat menulis berikut di file .htaccess

<IfModule mod_php5.c>
    php_value memory_limit 512M
</IfModule>


Atau


  • Buka php.inimemory_limit = 128M
  • httpd.confRLimitMEM 1073741824 2147483648
  • Restart apache

Sekian, terimakasih atas kunjungannya.
Salam,
PHP Aku : Membangun web terorganisasi dan mudah dimengerti, contoh tutorial dengan menggunakan HTML, CSS, JavaScript, SQL, PHP, dan XML.

Thead Fixed Position - 2

fixed


<style type="text/css">
    h1,h2,h3,h4,h5,h6{line-height: 1;}

    .clearHeader{
        display: none;
    }
    .darkHeader {
        height: 30px;
        background-color: #fff;
        position: fixed;
        top:50px;
        width: 94%;
        box-shadow: 0 8px 4px -2px #888888;
        -moz-box-shadow: 0 8px 4px -2px #888888;
        -webkit-box-shadow: 0 8px 4px -2px #888888;
    }
    .wrapper {
        height:auto;
    }
</style>
<script type="text/javascript">
    function printDiv(elementId) {
        var a = document.getElementById('printing-oop').value;
        var b = document.getElementById(elementId).innerHTML;
        window.frames["print_frame"].document.body.innerHTML = '<style>' + a + '</style>' + b;
        window.frames["print_frame"].window.focus();
        window.frames["print_frame"].window.print();
    }
</script>
<div id="print-area">

    <div class="table-responsive">
        <div class="clearHeader">
            <table id="maintable" width="100%" class="table table-hover table-bordered" border="1" style="font-size:11px;" cellpadding="2" cellspacing="0">
                <thead style="font-weight: bold; font-size: 11px">
                    <tr>
                        <th id="no" width="3%" style="text-align: center; vertical-align: middle;font-size:11px;">No</th>
                        <th id="prog" width="38%" style="text-align: center; vertical-align: middle;font-size:11px;">NAMA PROGRAM DAN KEGIATAN</th>
                        <th id="ang" width="17%" style="text-align: center; vertical-align: middle;font-size:11px;">ANGGARAN (Rp.)</th>
                        <th id="kel" width="25%" style="text-align: center; vertical-align: middle;font-size:11px;">KELUARAN KEGIATAN</th>
                        <th id="vol" width="10%" style="text-align: center; vertical-align: middle;font-size:11px;">VOLUME</th>
                        <th id="ket" width="7%" style="text-align: center; vertical-align: middle;font-size:11px;">KET</th>
                    </tr>
                </thead>
            </table>
        </div>
        <div class="wrapper">
            <p style="font-size:15px;"><b>IV. Program dan Kegiatan yang dilaksanakan Tahun Anggaran <?php echo $tahun ?> :</b></p>
            <table id="maintable" width="100%" class="" border="1" style="" cellpadding="2" cellspacing="0">
                <thead style="">
                    <tr>
                        <th id="no" width="3%" style="">No</th>
                        <th id="prog" width="38%" style="">NAMA PROGRAM DAN KEGIATAN</th>
                        <th id="ang" width="17%" style="">ANGGARAN (Rp.)</th>
                        <th id="kel" width="25%" style="">KELUARAN KEGIATAN</th>
                        <th id="vol" width="10%" style="">VOLUME</th>
                        <th id="ket" width="7%" style="">KET</th>
                    </tr>
                </thead>
                <tbody id="content">
                </tbody>
            </table>
        </div>
    </div>
    <textarea id="printing-oop" style="display:none;">
    @media print {
        @page {size: legal portrait; margin-left: 2.25cm; margin-bottom: 5cm; margin-top: 2cm; margin-right: 2cm}
        table{
            line-height: 20px;
        }
        .table {
            border-collapse: collapse !important;
        }
        .table td,
        .table th {
            background-color: #fff !important;
        }
        .table td,
        .table th {
            border: 1px solid #000 !important;
        }
        .clearHeader{
            display: none;
        }
    }
    </textarea>
    <iframe id="printing-frame" name="print_frame" src="about:blank" style="display:none;"></iframe>
    <script src="js/jquery-1.11.0.js"></script>
    <script type="text/javascript">
    $(function () {
        var header = $(".clearHeader");
        $(window).scroll(function () {
            var scroll = $(window).scrollTop();

            if (scroll >= 150) {
                header.removeClass('clearHeader').addClass("darkHeader");
            } else {
                header.removeClass("darkHeader").addClass('clearHeader');
            }
        });
    });
    </script>

</div>




Sekian, terimakasih atas kunjungannya.
Salam,
PHP Aku : Membangun web terorganisasi dan mudah dimengerti, contoh tutorial dengan menggunakan HTML, CSS, JavaScript, SQL, PHP, dan XML.

Cara Membuat Laporan PDF menggunakan TCPDF di CodeIgniter


tcpdf


TCPDF Library

  1. Download plugin di sini
  2. Extract dan paste di /web/application/libraries/tcpdf/
  3. Edit file pdf.php yang berada di /web/application/libraries/

    <?php
    if (!defined('BASEPATH'))
        exit('No direct script access allowed');
    require_once dirname(__FILE__) . '/tcpdf/tcpdf.php';
    class Pdf extends TCPDF {
        function __construct() {
            parent::__construct();
        }
          protected $processId = 0;
          protected $header = '';
          protected $footer = '';
          static $errorMsg = '';
          public $page_counter = 1;
          public $isLastPage = false;
          /**
           * This method is used to override the parent class method.
           * */
          public function Header() {
              // Position at 15 mm from bottom
              $this->SetY(-500);
              // Set font
              $this->SetFont('helvetica', 'B', 10);
              // Page number
              $halaman = $this->PageNo();
              if (isset($_POST["hal"]) && !empty($_POST["hal"]) && $this->isLastPage) {
                  $this->Cell(0, 12, ($halaman - 1) + $_POST["hal"], 0, 0, 'R', 0, '', 0, false, 'T', 'M');
              } else if (isset($_POST["hal"]) && !empty($_POST["hal"])) {
                  $this->Cell(0, 12, ($halaman - 1) + $_POST["hal"], 0, 0, 'R', 0, '', 0, false, 'T', 'M');
              } else if (!isset($_POST["hal"]) && empty($_POST["hal"]) && $this->isLastPage) {
                  $this->Cell(0, 12, ($halaman - 1) + 1, 0, 0, 'R', 0, '', 0, false, 'T', 'M');
              } else {
                  $this->Cell(0, 12, ($halaman - 1) + 1, 0, 0, 'R', 0, '', 0, false, 'T', 'M');
              }
          }

          public function lastPage($resetmargins = false) {
              $this->setPage($this->getNumPages(), $resetmargins);
              $this->isLastPage = true;
          }

          public function Footer() {
              // Position at 15 mm from bottom
              //$this->SetY(-15);
              // Set font
              $this->SetFont('helvetica', 'B', 8);
              // Page number
              $halaman = $this->PageNo();
              if (isset($_POST["hal"]) && !empty($_POST["hal"]) && $this->isLastPage) {
                  $this->Cell(0, 12, false, 0, 0, 'C', 0, '', 0, false, 'T', 'M');
              } else if (isset($_POST["hal"]) && !empty($_POST["hal"])) {
                  $this->Cell(0, 12, false, 'T', 0, 'C', 0, '', 0, false, 'T', 'M');
              } else if (!isset($_POST["hal"]) && empty($_POST["hal"]) && $this->isLastPage) {
                  $this->Cell(0, 12, false, 0, 0, 'C', 0, '', 0, false, 'T', 'M');
              } else {
                  $this->Cell(0, 12, false, 'T', 0, 'C', 0, '', 0, false, 'T', 'M');
              }
          }
      }

      /* End of file Pdf.php */
      /* Location: ./application/libraries/Pdf.php */
    • Controllers

      Buka file controller yang dipakai dan gunakan fungsi pemanggilan view saja.

      function pdf() {
      ini_set('memory_limit', '-1');
      $data['cetak'] = $this->rko_model->cetak_4($org_key, $tahap, $tahun);
      $this->load->view('pdf_view', $data);
      }
    • Sesuaikan Model
    • Custom View

      <?php
      $this->load->library('Pdf');$pdf = new Pdf(PDF_PAGE_ORIENTATION, PDF_UNIT, PDF_PAGE_FORMAT, true, 'UTF-8', false);$width = $pdf->pixelsToUnits(812.598425197); //width F4$height = $pdf->pixelsToUnits(1227.244094488); //heightF4$resolution = array($width, $height);
      $pdf->SetDisplayMode('fullpage', 'SinglePage', 'UseNone');
      $pdf->SetFont('times', '', 10); //font-family, 'color', 'size'$pdf->setFooterMargin(20); //sesuaikan SetAutoPageBreak$pdf->SetMargins(40, 30, 13, 20, true); //left, top, right, bottom$pdf->setPrintHeader(false);$pdf->setPrintFooter(true);$pdf->SetAutoPageBreak(true, 20); //sesuaikan setFooterMargin$pdf->SetAuthor('Titile');$pdf->AddPage('L', $resolution); //L, Pob_start();
      $html = '<table>
      <thead><tr><td></td></tr></thead><tbody>';
      //foreach(){}

      $html.='</tbody>
      </table>';
      // echo $html;
      ob_end_clean();$pdf->writeHTML($html, true, false, true, false, '');$pdf->Output('Bagian_5_RKO.pdf', 'D');
      ?>


      Jika ada error silakan komen atau hubungi saya.


    Sekian, terimakasih atas kunjungannya.
    Salam,
    PHP Aku : Membangun web terorganisasi dan mudah dimengerti, contoh tutorial dengan menggunakan HTML, CSS, JavaScript, SQL, PHP, dan XML.

    Mendapatkan Karakter di dalam String dengan PHP dan Javascript serta Menghapus Karakter Terakhir (Last Character) dari suatu String

    substring



    //PHP
    $string = 'Contoh_ini_saja';
    substr($string, -4) //Get 4 characters --> hasilnya 'saja'
    substr($string, -1) //Get 1 characters --> hasilnya 'saja'

    $kalimat = 'Ini adalah kalimat';
    echo substr($kalimat , 0, 3); //Get 4 karakter dari karakter pertama/index 0 --> hasilnya: Ini

    echo substr($kalimat , 4, 6); //Get 6 karakter dari karakter ke-lima/index 5 --> hasilnya: adalah


    Contoh menghapus karakter terakhir (last character) dari suatu string, misal: '1','2','19','23','24', => saya hapus "," yang terakhir maka bisa menggunakan rtrim($variabelitu)
    --> hasilnya: '1','2','19','23','24' (tidak ada koma merah di belakang)


    //JavaScript
    var testword = 'Contoh_ini_saja';
    var last4 = testword.substr(-4); //Get 4 characters --> hasilnya 'saja'
    var last1 = testword.substr(-1); //Get 1 character --> hasilnya 'a'





    Sekian, terimakasih atas kunjungannya.
    Salam,
    PHP Aku : Membangun web terorganisasi dan mudah dimengerti, contoh tutorial dengan menggunakan HTML, CSS, JavaScript, SQL, PHP, dan XML.