list.pt 4.88 KB
<html metal:use-macro="load: ../base.pt">

<div metal:fill-slot="content">
  <link href="/static/datatables/extensions/TableTools/css/dataTables.tableTools.min.css" rel="stylesheet">
  <link href="/static/datatables/media/css/dataTables.bootstrap.css" rel="stylesheet">

<h4>Daftar Penerimaan</h4>
<hr>
<div class="container">
<!--form class="form-inline" role="form" id="frm_upload" name="frm_upload">
    <label for="upload" class="control-label">Upload:</label>
    <input type="text" class="form-control" id="upload">
    <button type="submit" class="btn btn-default">Upload</button>
</form-->
</div>
<p>
<table id="table1" name="table1" class="table table-bordered table-hover table-condensed" >
    <thead>
        <tr>
            <th>ID</th>
            <th>Kode</th>
            <th>Subjek</th>
            <th>Objek</th>
            <th>Uraian</th>
            <th>Rekening</th>
            <!--th>Pokok</th>
            <th>Denda</th>
            <th>Bunga</th-->
            <th>Jumlah</th>
            <th>Tgl. Bayar</th>
        </tr>
    </thead>
    <tbody>
    </tbody>
</table>
<script src="/static/datatables/media/js/jquery.dataTables.min.js"></script>
<!--script src="/static/datatables/media/js/jquery.jeditable.js')}"></script-->
<script src="/static/datatables/media/js/jquery.dataTables.ext.js"></script>
<script src="/static/datatables/extensions/TableTools/media/js/ZeroClipboard.js"></script>
<script src="/static/datatables/media/js/dataTables.bootstrap.js"></script>
<script>
  var mID;  
  var oTable;
  var iPos;
  var oFormUrl  = "/arsspd/";
  var oTableUrl = oFormUrl+"grid/act";
  
  $(document).ready(function () {
      oTable = $('#table1').dataTable({
          "sAjaxSource"    : oTableUrl,
          "bStateSave"      : true,
          "bServerSide"    : true,
          "bProcessing"    : true,
          "sDom"           : '<"toolbar">lfrtip',
          "bScrollCollapse": true,
          "bSort"          : true,
          "bInfo"          : false,
          "bFilter"        : true,
          "bAutoWidth"     : false,
          "bPaginate"      : true,
          "sPaginationType": "full_numbers",
          
          "lengthMenu": [
              [10, 25, 50, -1],
              [10, 25, 50, "All"]
          ],
          
          "aoColumnDefs": [
              {"bSearchable": false, "bVisible": false, "aTargets": [0]}
          ],

          "aoColumns": [
              null, 
               {"sWidth": "100px", "sClass": "left"},
               {"sWidth": "30px", "sClass": "center"},
              {"sWidth": "30px", "sClass": "center"},
              null, 
              null,
              {"sWidth": "75px", "sClass": "right"},
              //{"sWidth": "75px", "sClass": "center"},
              //{"sWidth": "40px", "sClass": "center"},
              //{"sWidth": "40px", "sClass": "center"},
               {"sWidth": "60px", "sClass": "center"},
             
          ],
      });

      var tb_array = [
          '<div class="btn-group pull-left">',
          '	<button id="btn_tambah" class="btn btn btn-primary pull-left" type="button">Bayar</button>',
          '	<button id="btn_edit" class="btn btn btn-danger pull-left" type="button">Reversal</button>',
          '	<!--button id="btn_delete" class="btn btn btn-danger pull-left" type="button">Hapus</button-->',
          '	<button id="btn_print" class="btn btn btn-primary pull-left" type="button">Cetak</button>',
          '	<button id="btn_close" class="btn btn btn-warning" type="button">Tutup</button>',
          '	&nbsp;',
          '</div>',
      ];

      var tb = tb_array.join(' ');
      $("div.toolbar").html(tb);

      $('#table1 tbody').on('click', 'tr', function () {
          if ($(this).hasClass('selected')) {
              mID = '';
              $(this).removeClass('selected');
          } else {
              iPos = oTable.fnGetPosition(this);
              var aData = oTable.fnGetData(iPos);
              mID = aData[0];
              oTable.$('tr.selected').removeClass('selected');
              $(this).addClass('selected');
          }
      });

      $('#btn_tambah').click(function () {
          window.location = oFormUrl+'add';
      });

      $('#btn_edit').click(function () {
          if (mID) {
              window.location = oFormUrl+mID+'/edit';
          } else {
              alert('Silahkan pilih data yang akan diedit');
          }
      });

      $('#btn_close').click(function () {
          window.location = "/"
      });

      $('#btn_print').click(function () {
          url = "/reports/act/r200"
          window.open(url);
      });

      $('#btn_delete').click(function () {
          if (mID) {
              var hapus = confirm('Hapus data ini?');
              if (hapus == true) {
                  window.location = oFormUrl+mID+'/delete';
              };
          } else {
              alert('Silahkan pilih data yang akan dihapus');
          }
      });
  });
</script>
</div>
</html>