append, insert array dan dua tabel codeigniter

Kali ini saya akan membahas tentang bagaimana membuat from inputan meng-array dan menyimpan atau insert dua table dalam satu aksi . untuk phpnya saya menggunakan framework codeigniter .

Kali ini saya untuk tampilannya saya mengguanakan fungsi append dan untuk fungsi insertnya saya menggunakan insert array . sebagai contoh permasalahan kali ini saya menggunakan seperti form pembayaran atau kasir .

kenapa kasir ?? karena dalam form pembayaran pasti ada pencatatan apa saja yang dipesan seorang pembeli yang pastinya pesananya lebih dari satu item .

selanjutnya apa saja yang di butuhkan dalam tutorial kali ini , yaitu :

1. Sebagai tampilannya saya menggunakan bootstrap .

2. Select2 . //enggak begitu penting

3. Jquery mask money

4. jquery-1.10.2.min

5. jquery-ui-1.9.2.custom.min

untuk bahannya bisa browsing sendiri soal sudah banyak yang membahas 5 hal di atas tersebut !!

jika anda sudah selesai dengan bahan-bahan yang di butuh kan dalam tutorial kali ini , kita bahas tabel databasenya. Tabel yang kita butuhkan hanya dua tabel database, yaitu :

1. tabel pemesan

Field	Jenis	panjang
id_pemesan	Varchar	15
Nama	Varchar	25
Tgl	Date
Meja	Int	10
T_item	Int	20
T_bayar	decimal	20,0

2. tabel pesanan

Field	Jenis	panjang
Id_pemesan	varchar	15
Menu	Varchar	50
Qty	Int	15
Harga	Decimal	20,0
jumlah	decimal	20,0

selanjutnya kita langsung saja ke tutorialnya , sebagai gambaran tampilannya seperti berikut !!

Penjelasan gambar :

Pada bagain form yang di atasnya tabel merupakan yang nantinya di simpan kedalam tabel tb_pemesan dan yang ada di dalam tabel akan tersimpan dalam tabel tb_pesanan . button +baris berfungsi sebagai penambah row yang ada di dalam tabel tersebut .

Kita langsung saja ke condingnya. Pertama-tama kita ke tampilan terlebih dahulu , kita beri nama tampil.php saja. Berikut codingnya :

<!DOCTYPE html>

<head>

</head>

<body>

<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>

</div>

</nav>

<header class="panel-heading"> Data Pesanan </header>

<label class="col-lg-4">Tanggal </label>

<input type="text" name="tgl" class="form-control" value="<?php echo date('d-m-Y'); ?>" readonly>

</div>

<label class="col-lg-4">ID Pemesan</label>

<input type="text" name="id_pemesan" id="tr" class="form-control" value="<?= $aut; ?>" readonly>

</div>

<label class="col-lg-4">nama pemesan</label>

</div>

<option value="" >---Pilih meja---</option>

</select>

</div>

<thead>

<tr>

<th style="vertical-align: middle; text-align:center; width:23%;">Harga Satuan (Rp)</th>

<th style="vertical-align: middle; text-align:center; width:28%;">Jumlah (Rp)</th>

</tr>

</thead>

<?php for ($i = 1; $i <= 1; $i++) { ?>

<tr>

<option value="">---Pilih---</option>

<option value="makanan">makanan</option>

<option value="minuman">minuman</option>

</select></td>

</div></td>

</tr>

<?php } ?>

</tbody>

<tfoot>

<tr>

<th colspan="2" style="vertical-align: middle; text-align:center;" >Total Item</th>

<th colspan="1" style="vertical-align: middle; text-align:center;" >Total (Rp)</th>

</tr>

</tfoot>

</table>

</div>

<button type="button" class="btn btn-primary" id="btn-tambah" style="width:85px;"><i class="fa fa-plus"></i><span> Baris</span></button>

<button type="submit" class="btn btn-primary" style="width:85px;">Simpan</button>

<button type="button" class="btn btn-primary" style="width:85px;">Batal</button>

</a> </div>

</div>

</form>

</div>

</section>

</div>

</body>

</html>

Sehabis membuat tampilannya , bagaimana membuat fungsi penambah row yang ada dalam tabelnya. Sebenarnya pertama-tama logikanya kita harus menghitung row yang tabel tersebut terlebih dahulu dengan for. Contoh:

<?php for ($i = 1; $i <= 1; $i++) { ?>

<tr>

<option value="">---Pilih---</option>

<option value="makanan">makanan</option>

<option value="minuman">minuman</option>

</select></td>

</div></td>

</tr>

<?php } ?>

Baru kita membuat fungsi penambah rownya, berikut scriptnya letakan script tersebut sebelum </body> :

$(document).ready(function(){

$('#btn-tambah').click(function(ev){

//ev.preventDefault();

var tbl = $('#dynamic-table1 tbody');

var lastRow = tbl.find("tr").length +1;

var emptyrows = 0;

for (i=1; i<lastRow; i++) {

if ($("#qty").val() == '' || $("#hs").val() == '') {

emptyrows += 1;

}

if ($("#qty"+i).val() == '' || $("#hs"+i).val() == '') {

emptyrows += 1;

}

if (emptyrows == 0 ) {

var kode=$('#mm').html();

tbl.append(

'<tr class="baris">' +

'<td>'+lastRow+'</td>' +

'<td style="padding:5px 5px"><select id="mm'+lastRow+'" style="width:100%" name="menu[]" required>'+kode+'</select></td>' +

'<td style="padding:5px 5px"><input id="qty'+lastRow+'" class="form-control qty" style="text-align:right;" type="text" name="qty[]" required></td>' +

'<td style="padding:5px 5px"><input id="hs'+lastRow+'" class="form-control harga" style=" text-align:right;" type="text" name="harga[]" required></td>' +

'<td style="padding:5px 5px"><input id="jml'+lastRow+'" class="form-control jumlah" style=" text-align:right;" type="text" name="jumlah[]" readonly></td>' +

'<td style="padding:5px 5px"><button type="button" class="btn btn-default btn-xs btn-hapus"><i class="fa fa-times"></i></button></td>' +

'</tr>'

);

}else{

alert("Silahkan mengisi data pada baris yang tersedia terlebih dahulu, sebelum menambah baris.");

}

});

</script>

Dari sini kita sudah dapat menbahkan rownya , tetapi belum dapat menghitung antara qty dan harga yang menghasilkan jumlahdan total (Rp) dan total itemnya ataupun menghapus row yang telah ditambahkan. bagaimana caranya berikut codingnya :

$("#hs").keyup(function(){

var qty = $("#qty").val();

var hs = $("#hs").val();

qty = parseFloat(qty.replace(/\,/g,''));

hs = parseFloat(hs.replace(/\,/g,''));

var total=qty*hs;

if(!isNaN(hs) && hs.length!=0) {

$('#jml').val(formatMoney(total.toFixed(2)));

}

});

Letakan script tersebut tepat di bawah bagain “$(document).ready(function(){ ”. dan letakan script yang ada di bawah berikut tepat ada di atas atau sebelum “}else{”.

$("input[id=hs"+lastRow+"]").keyup(function(){

var qty = $("input[id=qty"+lastRow+"]").val();

var hs = $("input[id=hs"+lastRow+"]").val();

qty = parseFloat(qty.replace(/\,/g,''));

hs = parseFloat(hs.replace(/\,/g,''));

var total=qty*hs;

if(!isNaN(hs) && hs.length!=0) {

$("input[id=jml"+lastRow+"]").val(formatMoney(total.toFixed(2)));

}

subtotal()

});

Dari sini kita sudah dapat menambah row dan mendapatkan jumlah dari qty dan harga , tetapi kita belum mendapatkan fungsi untuk mentotal dari jumlah, mentotal qtynya dan menghapus row yang telah ditambahkan. Selanjut kita akan menbahkan fungsi total qtynya.

#letakan script dibawah tepat di atas atau sebelum “}else{”.

$("input[id=qty"+lastRow+"]").keyup(function(){

itemm()

});

# letakan script dibawah tepat di setelah atau di bawah “else{...} )};”.

$("input[id=qty]").keyup(function(){

itemm();

});

function itemm(){

var sum=0;

$('.qty').each(function(){

var a=this.value;

a=a.replace(/\,/g,'');

if(!isNaN(a) && a.length!=0) {

sum += parseFloat(a);

}

});

$('#t_item').val(sum);

};

Setelah kita dapatkan total qtynya , kita ke hapus rownya lalu baru ke total (Rp). Berikut script untuk menghapus rownya :

# letakan script dibawah tepat di setelah atau di bawah “else{...} ”.

$(".btn-hapus").bind("click", hapusRow);

# letakan script dibawah setelah ataupun sesudah “function itemm”.

function hapusRow() {

$(this).parents(".baris").remove();

subtotal();

itemm();

};

# letakan script dibawah setelah ataupun sesudah “function itemm”. Jika anda meletakan “function hapusRow” setelah sebelum “function itemm” maka letakan script dibawah setelah “function itemm”.

$("input[id=hs").keyup(function(){

subtotal();

});

function subtotal(){

var sum=0;

$('.jumlah').each(function(){

var a=this.value;

a=a.replace(/\,/g,'');

if(!isNaN(a) && a.length!=0) {

sum += parseFloat(a);

}

});

$('#total').val(formatMoney(sum.toFixed(2)));

};

Disini kita sudah dapat fungsi semuanya namun kita belum mendapatkan perhitungan yang fixed jadi tambahkan script di bawah ini tepat sebelum “});</script>”.

function formatMoney(number, places, symbol, thousand, decimal) {

number = number || 0;

places = !isNaN(places = Math.abs(places)) ? places : 2;

symbol = symbol !== undefined ? symbol : "$";

thousand = thousand || ",";

decimal = decimal || ".";

var negative = number < 0 ? "-" : "",

i = parseInt(number = Math.abs(+number || 0).toFixed(places), 10) + "",

j = (j = i.length) > 3 ? j % 3 : 0;

return negative + (j ? i.substr(0, j) + thousand : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + thousand) + (places ? decimal + Math.abs(number - i).toFixed(places).slice(2) : "");

}

Jika anda binggu dengan peletakan script-script diatas berikut merupakan kumpulan script-scriptnya , oh iya kita belum menjalankan script select2 dan jqurrey mask moneynya . kita langsung kescript lengkapnya saja:

$(document).ready(function(){

$('.select2').select2();

$('#qty').maskMoney({thousands:',', decimal:'.', precision:0});

$('#hs').maskMoney({thousands:',', decimal:'.', precision:2});

$("#hs").keyup(function(){

var qty = $("#qty").val();

var hs = $("#hs").val();

qty = parseFloat(qty.replace(/\,/g,''));

hs = parseFloat(hs.replace(/\,/g,''));

var total=qty*hs;

if(!isNaN(hs) && hs.length!=0) {

$('#jml').val(formatMoney(total.toFixed(2)));

}

});

$('#btn-tambah').click(function(ev){

//ev.preventDefault();

var tbl = $('#dynamic-table1 tbody');

var lastRow = tbl.find("tr").length +1;

var emptyrows = 0;

for (i=1; i<lastRow; i++) {

if ($("#qty").val() == '' || $("#hs").val() == '') {

emptyrows += 1;

}

if ($("#qty"+i).val() == '' || $("#hs"+i).val() == '') {

emptyrows += 1;

}

if (emptyrows == 0 ) {

var kode=$('#mm').html();

tbl.append(

'<tr class="baris">' +

'<td>'+lastRow+'</td>' +

'<td style="padding:5px 5px"><select id="mm'+lastRow+'" style="width:100%" name="menu[]" required>'+kode+'</select></td>' +

'<td style="padding:5px 5px"><input id="qty'+lastRow+'" class="form-control qty" style="text-align:right;" type="text" name="qty[]" required></td>' +

'<td style="padding:5px 5px"><input id="hs'+lastRow+'" class="form-control harga" style=" text-align:right;" type="text" name="harga[]" required></td>' +

'<td style="padding:5px 5px"><input id="jml'+lastRow+'" class="form-control jumlah" style=" text-align:right;" type="text" name="jumlah[]" readonly></td>' +

'<td style="padding:5px 5px"><button type="button" class="btn btn-default btn-xs btn-hapus"><i class="fa fa-times"></i></button></td>' +

'</tr>'

);

$('select[id=mm'+lastRow+']').select2();

$("input[id=qty"+lastRow+"]").maskMoney({thousands:',', decimal:'.', precision:0});

$("input[id=hs"+lastRow+"]").maskMoney({thousands:',', decimal:'.', precision:2});

$("input[id=hs"+lastRow+"]").keyup(function(){

var qty = $("input[id=qty"+lastRow+"]").val();

var hs = $("input[id=hs"+lastRow+"]").val();

qty = parseFloat(qty.replace(/\,/g,''));

hs = parseFloat(hs.replace(/\,/g,''));

var total=qty*hs;

if(!isNaN(hs) && hs.length!=0) {

$("input[id=jml"+lastRow+"]").val(formatMoney(total.toFixed(2)));

}

subtotal()

});

$("input[id=qty"+lastRow+"]").keyup(function(){

itemm()

});

}else{

alert("Silahkan mengisi data pada baris yang tersedia terlebih dahulu, sebelum menambah baris.");

}

$(".btn-hapus").bind("click", hapusRow);

});

$("input[id=hs").keyup(function(){

subtotal();

});

$("input[id=qty]").keyup(function(){

itemm();

});

function hapusRow() {

$(this).parents(".baris").remove();

subtotal();

itemm();

};

function subtotal(){

var sum=0;

$('.jumlah').each(function(){

var a=this.value;

a=a.replace(/\,/g,'');

if(!isNaN(a) && a.length!=0) {

sum += parseFloat(a);

}

});

$('#total').val(formatMoney(sum.toFixed(2)));

};

function itemm(){

var sum=0;

$('.qty').each(function(){

var a=this.value;

a=a.replace(/\,/g,'');

if(!isNaN(a) && a.length!=0) {

sum += parseFloat(a);

}

});

$('#t_item').val(sum);

};

function formatMoney(number, places, symbol, thousand, decimal) {

number = number || 0;

places = !isNaN(places = Math.abs(places)) ? places : 2;

symbol = symbol !== undefined ? symbol : "$";

thousand = thousand || ",";

decimal = decimal || ".";

var negative = number < 0 ? "-" : "",

i = parseInt(number = Math.abs(+number || 0).toFixed(places), 10) + "",

j = (j = i.length) > 3 ? j % 3 : 0;

return negative + (j ? i.substr(0, j) + thousand : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + thousand) + (places ? decimal + Math.abs(number - i).toFixed(places).slice(2) : "");

}

});

</script>

Dari view sudah selesai , selanjutnya kita ke controllernya beri nama controllernya append.php . langsung copy saja coding berikut !!

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

class Append extends CI_Controller{

function __construct(){

parent::__construct();

$this->load->model('m_append');

}

public function index(){

$data['aut']=$this->m_append->nootomatis();

$this->load->view('tampil', $data);

}

public function append_add(){

$tgl = date("Y-m-d",strtotime($this->input->post('tgl')));

$data=array(

"tgl"=>$tgl,

"id_pemesan"=>$this->input->post('id_pemesan'),

"nama"=>$this->input->post('nama'),

"meja"=>$this->input->post('meja'),

"t_item"=>str_replace(",","",$this->input->post('item')),

"t_bayar"=>str_replace(",","",$this->input->post('total'))

);

$this->db->insert('tb_pemesan',$data);

$data1 = array();

foreach($_POST['menu'] as $key => $val){

$data1=array(

"id_pemesan"=>$this->input->post('id_pemesan'),

"menu"=>$_POST['menu'][$key],

"qty"=>str_replace(",","",$_POST['qty'][$key]),

"harga"=>str_replace(",","",$_POST['harga'][$key]),

"jumlah"=>str_replace(",","",$_POST['jumlah'][$key])

);

$this->db->insert('tb_pesanan',$data1);

}

redirect('append/');

}

Catatan:

- model” m_append” sebenarnya tidak begitu penting karena hanya berfungsi sebagai id_pemesan automatis saja .

- “foreach($_POST['menu']as $key=> $val)” pada bagian ini harus di isi yang sebagai acuan array nya.

Kita langsung saja buat modelnya , berikut scriptnya :

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

class M_append extends CI_Model {

function nootomatis() {

$today1=date('ym');

$today2='HB-'.$today1;

$query=mysql_query("select max(id_pemesan) as last from tb_pemesan where id_pemesan like '%$today2%'");

$data=mysql_fetch_array($query);

$lastNoFaktur=$data['last'];

$lastNoUrut=substr($lastNoFaktur,7,12);

$nextNoUrut=$lastNoUrut+1;

$nextNoKunjungan='HB-'.$today1.sprintf('%05s',$nextNoUrut);

return $nextNoKunjungan;

}

silah kan mencoba !!

Atau anda binggung bisa langsung download saja tutorial ini!!

Download via dropbox

append, insert array dan dua tabel codeigniter

1 Response to "append, insert array dan dua tabel codeigniter"

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel