Halo Dumenity, selamat datang kembali di website tips dan trik Dumet School. Berjumpa kembali dengan saya pada pembahasan tips seputar dunia website,pada kesempatan kali ini saya akan melanjutkan artikel sebelumnya tentang CRUD Codeigniter dan Ajax di mana pada tips sebelumnya kita sudah menampilkan data dengan ajax. Dan kali ini kita akan belajar tentang CRUD Codeigniter dan Ajax, Insert Data yaitu kita akan memasukkan data kedalam database dengan ajax.

Sebelum mulai tentu kita buat terlebih dahulu untuk insert datanya, tambahkan buttonnya untuk modal bootstrapnya

<button type="button" class="btn btn-success btn-sm" data-toggle="modal" data-target="#myModal">Insert Data</button>

Dan buat form di dalam modal bootstrapnya

<!-- insert data -->
  <div class="modal fade save" id="myModal" role="dialog">
    <div class="modal-dialog modal-lg">
      <div class="modal-content">
        <div class="modal-header">
          <h3>Masukkan Data Customer</h3>
        </div>
        <div class="modal-body">
          <form>
            <div class="form-group">
              <label for="nama">Nama</label>
              <input type="text" class="form-control" id="nama" placeholder="Masukkan Nama" required autofocus>
            </div>
            <div class="form-group">
              <label for="tlp">Telepon</label>
              <input type="text" class="form-control" id="tlp" placeholder="Masukkan Nomor Telepon" required autofocus>
            </div>
            <div class="form-group">
              <label for="alamat">Alamat</label>
              <input type="text" class="form-control" id="alamat" placeholder="Masukkan Alamat" required autofocus>
            </div>
            <div class="form-group">
              <label for="kota">Kota</label>
              <input type="text" class="form-control" id="kota" placeholder="Masukkan Kota" required autofocus>
            </div>
            <div class="form-group">
              <label for="total">Total Belanja</label>
              <input type="text" class="form-control" id="total" placeholder="Masukkan Total Belanja" required autofocus>
            </div>
            <button type="submit" class="btn btn-primary" id="save">save</button>
          </form>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>
    </div>
  </div>
</div>
<!-- end insert data -->

Kemudian buat fungsi jQuery nya untuk insert datanya dan masukkan url sesuai pada controllernya

//insert data
    $('#save').on('click',function(e){
            e.preventDefault()
            var nama=$('#nama').val();
            var tlp=$('#tlp').val();
            var alamat=$('#alamat').val();
            var kota=$('#kota').val();
            var total=$('#total').val();
            $.ajax({
                type : "POST",
                url  : "<?php echo base_url()?>index.php/data_customer/save",
                data : {nama:nama , tlp:tlp, alamat:alamat,kota:kota,total:total},
                success: function(data){
                    $('#nama').val('');
                    $('#tlp').val('');
                    $('#alamat').val('');
                    $('#kota').val('');
                    $('#total').val('');
                    $('.modal').modal('hide');
                    data_customer();
                }
            });
        });

Kemudian pada controllernya Controller/Data_customer.php kita buat fungsi insert nya lalu lakukan query pada model nya

function save(){
		$data = array(
	        'nama_customer' => $this->input->post('nama'),
	        'telepon' 		=> $this->input->post('tlp'),
	        'alamat' 		=> $this->input->post('total'),
	        'kota' 			=> $this->input->post('alamat'),
	        'total_belanja'	=>$this->input->post('kota')
		);
        $this->main_model->save_data('data_customer', $data);
    }

Dan berikan perintah query nya di file models/Main_model.php

function save_data($table,$data){
    $this->db->insert($table, $data);
}

Jika sudah save dan jalankan pada browsernya

Maka data langsung dikirm ke database dan otomatis tampil dengan kita menambahkan fungsi data_customer() ketika data ajaxnya selesai di jalankan

Nah itulah tips tentang CRUD Codeigniter dan Ajax, Insert Data tentu kita jumpa kembali pada artikel yang akan datang yaitu membuat fungsi delete data dengan ajax. Terimakasih dan sampai jumpa, semoga bermanfaat.