Aplikasi GIS Geographic Information system berbasis web (codeigniter) – bagian VI

Halo, sekarang kita akan membuat CRUD data jembatan. Sama seperti pada CRUD data jalan, CRUD data jembatan juga berada dalam folder admin. Baik itu file controller maupun file viewsnya. CRUD Jembatan disini hanya dibutuhkan file controller Jembatan.php dan file views formjembatan.php.

Jembatan.php

<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Jembatan extends CI_Controller{

    public function __construct()
    {
        parent::__construct();
        //kita load model yang dibutuhkan, yaitu model jembatan
        $this->load->model(array('model_jembatan'));
        $this->load->helper('url');
        $this->load->library('form_validation');
    }

    function index()
    {
        $data = array('content' => 'admin/formjembatan',//kita buat file formjembatan di dalam folder views/admin
        'itemjembatan'=>$this->model_jembatan->getAll());
        $this->load->view('templates/template-admin', $data);
    }
}

Buat juga folder admin di folder views dan tambahkan file formjembatan.php di dalam folder admin tadi.

formjalan.php

<div class="container-fluid">
    <div class="row">
        <div class="col-md-4 col-sm-4">
            <div class="panel panel-default">
              <div class="panel-heading">
                <h3 class="panel-title"><span class="glyphicon glyphicon-list-alt"></span> Form Jembatan</h3>
              </div>
              <div class="panel-body">
                  <form action="#">
                      <div class="form-group">
                        <label for="namajembatan">Nama Jembatan</label>
                        <input type="text" class="form-control" id="namajembatan" placeholder="">
                        <input type="hidden" name="id_jembatan" id="id_jembatan" value="">
                      </div>
                      <div class="form-group">
                        <label for="keterangan">Keterangan</label>
                        <textarea name="keterangan" class="form-control" id="keterangan"></textarea>
                      </div>
                      <div class="form-group">
                        <button type="button" name="simpanjembatan" id="simpanjembatan" class="btn btn-primary">Simpan</button>
                        <button type="button" name="resetjembatan"  id="resetjembatan" class="btn btn-warning">Reset</button>
                        <button type="button" name="updatejembatan" id="updatejembatan" class="btn btn-info" disabled="true">Update</button>
                      </div>
                  </form>
              </div>
            </div>
        </div>
        <div class="col-md-8 col-sm-8">
            <div class="panel panel-default">
              <div class="panel-heading">
                <h3 class="panel-title"><span class="glyphicon glyphicon-list"></span> Daftar Jembatan</h3>
              </div>
              <div class="panel-body">
                  <table class="table table-bordered">
                      <th>No</th>
                      <th>Nama Jembatan</th>
                      <th>Keterangan</th>
                      <th></th>
                      <tbody id="daftarjembatan">
                          <?php
                          $no = 1;
                          foreach ($itemjembatan->result() as $jembatan) {
                              ?>
                              <tr>
                                  <td><?php echo $no;?></td>
                                  <td><?php echo $jembatan->namajembatan;?></td>
                                  <td><?php echo $jembatan->keterangan;?></td>
                                  <td>
                                      <button type="button" class="btn btn-sm btn-info" data-idjembatan="<?php echo $jembatan->id_jembatan;?>" name="editjembatan<?php echo $jembatan->id_jembatan;?>" id="editjembatan"><span class="glyphicon glyphicon-edit"></span></button>
                                      <button type="button" class="btn btn-sm btn-danger" data-idjembatan="<?php echo $jembatan->id_jembatan;?>" name="deletejembatan<?php echo $jembatan->id_jembatan;?>" id="deletejembatan"><span class="glyphicon glyphicon-trash"></span></button>
                                  </td>
                              </tr>
                              <?php
                              $no++;
                          }
                           ?>
                      </tbody>
                  </table>
              </div>
            </div>
        </div>
    </div>
</div>

Kemudian akses dengan alamat : localhost/simplegis/index.php/admin/jembatan

Sehingga tampak halaman seperti berikut :

crud jembatan

Untuk memproses CRUD kita buat function untuk create, read, update, dan delete.

Pada bagian paling bawah file formjembatan.php tambahkan script seperti berikut :

function simpan dan reset

<script>
    $(document).on('click','#simpanjembatan',simpanjembatan)
    .on('click','#resetjembatan',resetjembatan)
    .on('click','#updatejembatan',updatejembatan)
    .on('click','#editjembatan',editjembatan)
    .on('click','#deletejembatan',deletejembatan);
    function simpanjembatan() {//simpan jembatan
        var datajembatan = {'namajembatan':$('#namajembatan').val(),
        'keterangan':$('#keterangan').val()};console.log(datajembatan);
        $.ajax({
            url : '<?php echo site_url("admin/jembatan/create");?>',
            data : datajembatan,
            dataType : 'json',
            type : 'POST',
            success : function(data,status){
                if (data.status!='error') {
                    $('#daftarjembatan').load('<?php echo current_url()." #daftarjembatan > *";?>');
                    resetjembatan();//form langsung dikosongkan pas selesai input data
                }else{
                    alert(data.msg);
                }
            },
            error : function(x,t,m){
                alert(x.responseText);
            }
        })
    }
    function resetjembatan() {//reset form jembatan
        $('#namajembatan').val('');
        $('#keterangan').val('');
        $('#id_jembatan').val('');
        $('#simpanjembatan').attr('disabled',false);
        $('#updatejembatan').attr('disabled',true);
    }
</script>

Buka kembali file Jembatan.php dan tambahkan function create();

function create()

function create(){
        if (!$this->input->is_ajax_request()) {
            show_404();
        }else{
            //kita validasi inputnya dulu
            $this->form_validation->set_rules('namajembatan', 'Nama Jembatan', 'trim|required');
            $this->form_validation->set_rules('keterangan', 'Keterangan', 'trim|required');
            if ($this->form_validation->run()==false) {
                $status = 'error';
                $msg = validation_errors();
            }else{
                if ($this->model_jembatan->create()) {
                    $status = 'success';
                    $msg = "Data jembatan berhasil disimpan";
                }else{
                    $status = 'error';
                    $msg = "terjadi kesalahan saat menyimpan data jembatan";
                }
            }
            $this->output->set_content_type('application/json')->set_output(json_encode(array('status'=>$status,'msg'=>$msg)));
        }
    }

function editjembatan()

function editjembatan() {//edit jembatan
        var id = $(this).data('idjembatan');
        var datajembatan = {'id_jembatan':id};console.log(datajembatan);
        $('input[name=editjembatan'+id+']').attr('disabled',true);//biar ga di klik dua kali, maka di disabled
        $.ajax({
            url : '<?php echo site_url("admin/jembatan/edit");?>',
            data : datajembatan,
            dataType : 'json',
            type : 'POST',
            success : function(data,status){
                if (data.status!='error') {
                    $('input[name=editjembatan'+id+']').attr('disabled',false);//disabled di set false, karena transaksi berhasil
                    $('#simpanjembatan').attr('disabled',true);
                    $('#updatejembatan').attr('disabled',false);
                    $.each(data.msg,function(k,v){
                        $('#id_jembatan').val(v['id_jembatan']);
                        $('#namajembatan').val(v['namajembatan']);
                        $('#keterangan').val(v['keterangan']);
                    })
                }else{
                    alert(data.msg);
                    $('input[name=editjembatan'+id+']').attr('disabled',false);//disabled di set false, karena transaksi berhasil
                }
            },
            error : function(x,t,m){
                alert(x.responseText);
                $('input[name=editjembatan'+id+']').attr('disabled',false);//disabled di set false, karena transaksi berhasil
            }
        })
    }

Tambahkan juga function edit() pada file controller Jembatan.php

function edit()

function edit(){
        if (!$this->input->is_ajax_request()) {
            show_404();
        }else{
            //kita validasi inputnya dulu
            $this->form_validation->set_rules('id_jembatan', 'ID Jembatan', 'trim|required');
            if ($this->form_validation->run()==false) {
                $status = 'error';
                $msg = validation_errors();
            }else{
                $id = $this->input->post('id_jembatan');
                if ($this->model_jembatan->read($id)->num_rows()!=null) {
                    $status = 'success';
                    $msg = $this->model_jembatan->read($id)->result();
                }else{
                    $status = 'error';
                    $msg = "Data jembatan tidak ditemukan";
                }
            }
            $this->output->set_content_type('application/json')->set_output(json_encode(array('status'=>$status,'msg'=>$msg)));
        }
    }

function updatejembatan()

function updatejembatan() {//update jembatan
        var datajembatan = {'namajembatan':$('#namajembatan').val(),
        'keterangan':$('#keterangan').val(),
        'id_jembatan':$('#id_jembatan').val()};console.log(datajembatan);
        $.ajax({
            url : '<?php echo site_url("admin/jembatan/update");?>',
            data : datajembatan,
            dataType : 'json',
            type : 'POST',
            success : function(data,status){
                if (data.status!='error') {
                    $('#daftarjembatan').load('<?php echo current_url()." #daftarjembatan > *";?>');
                    resetjembatan();//form langsung dikosongkan pas selesai input data
                }else{
                    alert(data.msg);
                }
            },
            error : function(x,t,m){
                alert(x.responseText);
            }
        })
    }

Tambahkan juga function update() pada file controller Jembatan.php

function update()

function update(){
        if (!$this->input->is_ajax_request()) {
            show_404();
        }else{
            //kita validasi inputnya dulu
            $this->form_validation->set_rules('namajembatan', 'Nama Jembatan', 'trim|required');
            $this->form_validation->set_rules('keterangan', 'Keterangan', 'trim|required');
            $this->form_validation->set_rules('id_jembatan', 'ID Jembatan', 'trim|required');
            if ($this->form_validation->run()==false) {
                $status = 'error';
                $msg = validation_errors();
            }else{
                $id = $this->input->post('id_jembatan');
                if ($this->model_jembatan->update($id)) {
                    $status = 'success';
                    $msg = "Data jembatan berhasil diupdate";
                }else{
                    $status = 'error';
                    $msg = "terjadi kesalahan saat mengupdate data jembatan";
                }
            }
            $this->output->set_content_type('application/json')->set_output(json_encode(array('status'=>$status,'msg'=>$msg)));
        }
    }

terakhir tambahkan function deletejembatan pada formjembatan.php

function deletejembatan()

function deletejembatan() {//delete jembatan
        if (confirm("Anda yakin akan menghapus data jembatan ini?")) {
            var id = $(this).data('idjembatan');
            var datajembatan = {'id_jembatan':id};console.log(datajembatan);
            $.ajax({
                url : '<?php echo site_url("admin/jembatan/delete");?>',
                data : datajembatan,
                dataType : 'json',
                type : 'POST',
                success : function(data,status){
                    if (data.status!='error') {
                        $('#daftarjembatan').load('<?php echo current_url()." #daftarjembatan > *";?>');
                        resetjembatan();//form langsung dikosongkan pas selesai input data
                    }else{
                        alert(data.msg);
                    }
                },
                error : function(x,t,m){
                    alert(x.responseText);
                }
            })
        }
    }

Begitu juga file Jembatan.php tambahkan function delete()

function delete()

function delete(){
        if (!$this->input->is_ajax_request()) {
            show_404();
        }else{
            //kita validasi inputnya dulu
            $this->form_validation->set_rules('id_jembatan', 'ID Jembatan', 'trim|required');
            if ($this->form_validation->run()==false) {
                $status = 'error';
                $msg = validation_errors();
            }else{
                $id = $this->input->post('id_jembatan');
                if ($this->model_jembatan->delete($id)) {
                    $status = 'success';
                    $msg = "Data jembatan berhasil dihapus";
                }else{
                    $status = 'error';
                    $msg = "terjadi kesalahan saat menghapus data jembatan";
                }
            }
            $this->output->set_content_type('application/json')->set_output(json_encode(array('status'=>$status,'msg'=>$msg)));
        }
    }

Setelah selesai menambahkan function tersebut maka file formjembatan.php akan menjadi seperti berikut :

formjembatan.php

<div class="container-fluid">
    <div class="row">
        <div class="col-md-4 col-sm-4">
            <div class="panel panel-default">
              <div class="panel-heading">
                <h3 class="panel-title"><span class="glyphicon glyphicon-list-alt"></span> Form Jembatan</h3>
              </div>
              <div class="panel-body">
                  <form action="#">
                      <div class="form-group">
                        <label for="namajembatan">Nama Jembatan</label>
                        <input type="text" class="form-control" id="namajembatan" placeholder="">
                        <input type="hidden" name="id_jembatan" id="id_jembatan" value="">
                      </div>
                      <div class="form-group">
                        <label for="keterangan">Keterangan</label>
                        <textarea name="keterangan" class="form-control" id="keterangan"></textarea>
                      </div>
                      <div class="form-group">
                        <button type="button" name="simpanjembatan" id="simpanjembatan" class="btn btn-primary">Simpan</button>
                        <button type="button" name="resetjembatan"  id="resetjembatan" class="btn btn-warning">Reset</button>
                        <button type="button" name="updatejembatan" id="updatejembatan" class="btn btn-info" disabled="true">Update</button>
                      </div>
                  </form>
              </div>
            </div>
        </div>
        <div class="col-md-8 col-sm-8">
            <div class="panel panel-default">
              <div class="panel-heading">
                <h3 class="panel-title"><span class="glyphicon glyphicon-list"></span> Daftar Jembatan</h3>
              </div>
              <div class="panel-body">
                  <table class="table table-bordered">
                      <th>No</th>
                      <th>Nama Jembatan</th>
                      <th>Keterangan</th>
                      <th></th>
                      <tbody id="daftarjembatan">
                          <?php
                          $no = 1;
                          foreach ($itemjembatan->result() as $jembatan) {
                              ?>
                              <tr>
                                  <td><?php echo $no;?></td>
                                  <td><?php echo $jembatan->namajembatan;?></td>
                                  <td><?php echo $jembatan->keterangan;?></td>
                                  <td>
                                      <button type="button" class="btn btn-sm btn-info" data-idjembatan="<?php echo $jembatan->id_jembatan;?>" name="editjembatan<?php echo $jembatan->id_jembatan;?>" id="editjembatan"><span class="glyphicon glyphicon-edit"></span></button>
                                      <button type="button" class="btn btn-sm btn-danger" data-idjembatan="<?php echo $jembatan->id_jembatan;?>" name="deletejembatan<?php echo $jembatan->id_jembatan;?>" id="deletejembatan"><span class="glyphicon glyphicon-trash"></span></button>
                                  </td>
                              </tr>
                              <?php
                              $no++;
                          }
                           ?>
                      </tbody>
                  </table>
              </div>
            </div>
        </div>
    </div>
</div>
<script>
    $(document).on('click','#simpanjembatan',simpanjembatan)
    .on('click','#resetjembatan',resetjembatan)
    .on('click','#updatejembatan',updatejembatan)
    .on('click','#editjembatan',editjembatan)
    .on('click','#deletejembatan',deletejembatan);
    function simpanjembatan() {//simpan jembatan
        var datajembatan = {'namajembatan':$('#namajembatan').val(),
        'keterangan':$('#keterangan').val()};console.log(datajembatan);
        $.ajax({
            url : '<?php echo site_url("admin/jembatan/create");?>',
            data : datajembatan,
            dataType : 'json',
            type : 'POST',
            success : function(data,status){
                if (data.status!='error') {
                    $('#daftarjembatan').load('<?php echo current_url()." #daftarjembatan > *";?>');
                    resetjembatan();//form langsung dikosongkan pas selesai input data
                }else{
                    alert(data.msg);
                }
            },
            error : function(x,t,m){
                alert(x.responseText);
            }
        })
    }
    function resetjembatan() {//reset form jembatan
        $('#namajembatan').val('');
        $('#keterangan').val('');
        $('#id_jembatan').val('');
        $('#simpanjembatan').attr('disabled',false);
        $('#updatejembatan').attr('disabled',true);
    }
    function updatejembatan() {//update jembatan
        var datajembatan = {'namajembatan':$('#namajembatan').val(),
        'keterangan':$('#keterangan').val(),
        'id_jembatan':$('#id_jembatan').val()};console.log(datajembatan);
        $.ajax({
            url : '<?php echo site_url("admin/jembatan/update");?>',
            data : datajembatan,
            dataType : 'json',
            type : 'POST',
            success : function(data,status){
                if (data.status!='error') {
                    $('#daftarjembatan').load('<?php echo current_url()." #daftarjembatan > *";?>');
                    resetjembatan();//form langsung dikosongkan pas selesai input data
                }else{
                    alert(data.msg);
                }
            },
            error : function(x,t,m){
                alert(x.responseText);
            }
        })
    }
    function editjembatan() {//edit jembatan
        var id = $(this).data('idjembatan');
        var datajembatan = {'id_jembatan':id};console.log(datajembatan);
        $('input[name=editjembatan'+id+']').attr('disabled',true);//biar ga di klik dua kali, maka di disabled
        $.ajax({
            url : '<?php echo site_url("admin/jembatan/edit");?>',
            data : datajembatan,
            dataType : 'json',
            type : 'POST',
            success : function(data,status){
                if (data.status!='error') {
                    $('input[name=editjembatan'+id+']').attr('disabled',false);//disabled di set false, karena transaksi berhasil
                    $('#simpanjembatan').attr('disabled',true);
                    $('#updatejembatan').attr('disabled',false);
                    $.each(data.msg,function(k,v){
                        $('#id_jembatan').val(v['id_jembatan']);
                        $('#namajembatan').val(v['namajembatan']);
                        $('#keterangan').val(v['keterangan']);
                    })
                }else{
                    alert(data.msg);
                    $('input[name=editjembatan'+id+']').attr('disabled',false);//disabled di set false, karena transaksi berhasil
                }
            },
            error : function(x,t,m){
                alert(x.responseText);
                $('input[name=editjembatan'+id+']').attr('disabled',false);//disabled di set false, karena transaksi berhasil
            }
        })
    }
    function deletejembatan() {//delete jembatan
        if (confirm("Anda yakin akan menghapus data jembatan ini?")) {
            var id = $(this).data('idjembatan');
            var datajembatan = {'id_jembatan':id};console.log(datajembatan);
            $.ajax({
                url : '<?php echo site_url("admin/jembatan/delete");?>',
                data : datajembatan,
                dataType : 'json',
                type : 'POST',
                success : function(data,status){
                    if (data.status!='error') {
                        $('#daftarjembatan').load('<?php echo current_url()." #daftarjembatan > *";?>');
                        resetjembatan();//form langsung dikosongkan pas selesai input data
                    }else{
                        alert(data.msg);
                    }
                },
                error : function(x,t,m){
                    alert(x.responseText);
                }
            })
        }
    }
</script>

Dan file Jembatan.php akan menjadi seperti berikut :

Jembatan.php

<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Jembatan extends CI_Controller{

    public function __construct()
    {
        parent::__construct();
        //kita load model yang dibutuhkan, yaitu model jembatan
        $this->load->model(array('model_jembatan'));
        $this->load->helper('url');
        $this->load->library('form_validation');
    }

    function index()
    {
        $data = array('content' => 'admin/formjembatan',//kita buat file formjembatan di dalam folder views/admin
        'itemjembatan'=>$this->model_jembatan->getAll());
        $this->load->view('templates/template-admin', $data);
    }
    function create(){
        if (!$this->input->is_ajax_request()) {
            show_404();
        }else{
            //kita validasi inputnya dulu
            $this->form_validation->set_rules('namajembatan', 'Nama Jembatan', 'trim|required');
            $this->form_validation->set_rules('keterangan', 'Keterangan', 'trim|required');
            if ($this->form_validation->run()==false) {
                $status = 'error';
                $msg = validation_errors();
            }else{
                if ($this->model_jembatan->create()) {
                    $status = 'success';
                    $msg = "Data jembatan berhasil disimpan";
                }else{
                    $status = 'error';
                    $msg = "terjadi kesalahan saat menyimpan data jembatan";
                }
            }
            $this->output->set_content_type('application/json')->set_output(json_encode(array('status'=>$status,'msg'=>$msg)));
        }
    }
    function edit(){
        if (!$this->input->is_ajax_request()) {
            show_404();
        }else{
            //kita validasi inputnya dulu
            $this->form_validation->set_rules('id_jembatan', 'ID Jembatan', 'trim|required');
            if ($this->form_validation->run()==false) {
                $status = 'error';
                $msg = validation_errors();
            }else{
                $id = $this->input->post('id_jembatan');
                if ($this->model_jembatan->read($id)->num_rows()!=null) {
                    $status = 'success';
                    $msg = $this->model_jembatan->read($id)->result();
                }else{
                    $status = 'error';
                    $msg = "Data jembatan tidak ditemukan";
                }
            }
            $this->output->set_content_type('application/json')->set_output(json_encode(array('status'=>$status,'msg'=>$msg)));
        }
    }
    function update(){
        if (!$this->input->is_ajax_request()) {
            show_404();
        }else{
            //kita validasi inputnya dulu
            $this->form_validation->set_rules('namajembatan', 'Nama Jembatan', 'trim|required');
            $this->form_validation->set_rules('keterangan', 'Keterangan', 'trim|required');
            $this->form_validation->set_rules('id_jembatan', 'ID Jembatan', 'trim|required');
            if ($this->form_validation->run()==false) {
                $status = 'error';
                $msg = validation_errors();
            }else{
                $id = $this->input->post('id_jembatan');
                if ($this->model_jembatan->update($id)) {
                    $status = 'success';
                    $msg = "Data jembatan berhasil diupdate";
                }else{
                    $status = 'error';
                    $msg = "terjadi kesalahan saat mengupdate data jembatan";
                }
            }
            $this->output->set_content_type('application/json')->set_output(json_encode(array('status'=>$status,'msg'=>$msg)));
        }
    }
    function delete(){
        if (!$this->input->is_ajax_request()) {
            show_404();
        }else{
            //kita validasi inputnya dulu
            $this->form_validation->set_rules('id_jembatan', 'ID Jembatan', 'trim|required');
            if ($this->form_validation->run()==false) {
                $status = 'error';
                $msg = validation_errors();
            }else{
                $id = $this->input->post('id_jembatan');
                if ($this->model_jembatan->delete($id)) {
                    $status = 'success';
                    $msg = "Data jembatan berhasil dihapus";
                }else{
                    $status = 'error';
                    $msg = "terjadi kesalahan saat menghapus data jembatan";
                }
            }
            $this->output->set_content_type('application/json')->set_output(json_encode(array('status'=>$status,'msg'=>$msg)));
        }
    }

}

Proses CRUD Jembatan telah selesai, selanjutnya kita akan membuat sistem login menggunakan ion_auth library.

Terima kasih.

5 thoughts on “Aplikasi GIS Geographic Information system berbasis web (codeigniter) – bagian VI

  1. abu fatih Balas

    Assalamualaikum.
    Bro bisa diupload source codenya? saya mengalami error

    A PHP Error was encountered

    Severity: Warning

    Message: Cannot modify header information – headers already sent by (output started at /var/www/html/web/gis/application/controllers/Admin.php:1)

    Filename: core/Common.php

    Line Number: 570

    Backtrace:

    File: /var/www/html/web/gis/index.php
    Line: 315
    Function: require_once

    pada saat tes localhost/…….admin/jalan
    terima kasih

Tinggalkan Balasan

This site uses Akismet to reduce spam. Learn how your comment data is processed.