Bismillaahirrohmaanirrohiim…
Membuat array multidimensi menggunakan PHP adalah cara yang sangat mudah, dimana variabelnya dapat dinyatakan langsung, seperti:
$arr_multi['satu'] = array('produk_id'=>'1','produk_nama'=>'Sabun','harga'=>5000);
$arr_multi['dua'] = array('produk_id'=>'2','produk_nama'=>'Sampo','harga'=>7000);
<?php
$arr_multi = array();
$arr_multi['satu'] = array('produk_id'=>'1','produk_nama'=>'Sabun','harga'=>5000);
$arr_multi['dua'] = array('produk_id'=>'2','produk_nama'=>'Sampo','harga'=>7000);
//dst
<?php
$arr_multi = array();
$arr_multi['satu'] = array('produk_id'=>'1','produk_nama'=>'Sabun','harga'=>5000);
$arr_multi['dua'] = array('produk_id'=>'2','produk_nama'=>'Sampo','harga'=>7000);
//dst
Nah, masalahnya dalam javascript tidak semudah itu ferguso…
Umumnya pendefinisian array di javascript bisa seperti berikut:
const mobils = ["Avanza", "Xenia", "Xpander"];
//untuk akses array, pake cara ini
let mobil_toyota = mobils[0];
const mobils = ["Avanza", "Xenia", "Xpander"];
//untuk akses array, pake cara ini
let mobil_toyota = mobils[0];
const mobils = ["Avanza", "Xenia", "Xpander"];
//untuk akses array, pake cara ini
let mobil_toyota = mobils[0];
Bisa juga seperti ini:
const mobils = [];
mobils[0]= "Avanza";
mobils[1]= "Xenia";
mobils[2]= "Xpander";
const mobils = [];
mobils[0]= "Avanza";
mobils[1]= "Xenia";
mobils[2]= "Xpander";
Array Key pada javascript berupa index angka, tidak bisa diisi string, misalnya mobils[‘toyota’] = ‘Avanza’;. Aturannya Key javascript harus berupa index angka, namun array valuenya bisa berupa apa saja, bisa number, string, array, object, dll, misal:
arrayobj[0] = Date.now;
arrayobj[1] = fungsijs;
arrayobj[2] = mobils;
arrayobj[0] = Date.now;
arrayobj[1] = fungsijs;
arrayobj[2] = mobils;
Untuk membuat multidimensional array di javascript tidak bisa dengan cara biasa, namun bisa menggunakan salah satu fitur yang umum dipakai, yaitu: json.
Ya, jadikan array multidimensi menjadi format JSON. Kemudian akses dengan javascript.
"streetAddress": "Jl Gajayana",
"number": "0341-123123123"
{
"name": "Andre",
"age": 32,
"address": {
"streetAddress": "Jl Gajayana",
"city": "Malang"
},
"phoneNumber": [
{
"type": "home",
"number": "0341-123123123"
},
{
"type": "mobile",
"number": "08123123123"
}
]
}
{
"name": "Andre",
"age": 32,
"address": {
"streetAddress": "Jl Gajayana",
"city": "Malang"
},
"phoneNumber": [
{
"type": "home",
"number": "0341-123123123"
},
{
"type": "mobile",
"number": "08123123123"
}
]
}
Untuk mengaksesnya, seperti di bawah ini:
<script type="text/javascript">
var data = '{"name": "Andre","age": 32,"address": {"streetAddress": "Jl Gajayana","city": "Malang"},"phoneNumber": [{"type": "home","number": "0341-123123123"},{"type": "mobile","number": "08123123123"}]}';
var json = JSON.parse(data);
alert(json["name"]); //Andre
alert(json.name); //Andre
alert(json.address.streetAddress); //Jl Gajayana
alert(json["address"].city); //Malang
alert(json.phoneNumber[0].number); //"0341-123123123
alert(json.phoneNumber[1].type); //mobile
alert(json.phoneNumber.number); //undefined
<script type="text/javascript">
var data = '{"name": "Andre","age": 32,"address": {"streetAddress": "Jl Gajayana","city": "Malang"},"phoneNumber": [{"type": "home","number": "0341-123123123"},{"type": "mobile","number": "08123123123"}]}';
var json = JSON.parse(data);
alert(json["name"]); //Andre
alert(json.name); //Andre
alert(json.address.streetAddress); //Jl Gajayana
alert(json["address"].city); //Malang
alert(json.phoneNumber[0].number); //"0341-123123123
alert(json.phoneNumber[1].type); //mobile
alert(json.phoneNumber.number); //undefined
</script>
<script type="text/javascript">
var data = '{"name": "Andre","age": 32,"address": {"streetAddress": "Jl Gajayana","city": "Malang"},"phoneNumber": [{"type": "home","number": "0341-123123123"},{"type": "mobile","number": "08123123123"}]}';
var json = JSON.parse(data);
alert(json["name"]); //Andre
alert(json.name); //Andre
alert(json.address.streetAddress); //Jl Gajayana
alert(json["address"].city); //Malang
alert(json.phoneNumber[0].number); //"0341-123123123
alert(json.phoneNumber[1].type); //mobile
alert(json.phoneNumber.number); //undefined
</script>
Contoh lain, misalnya json dari database yang bisa dibuat dengan PHP:
"produk_id": "1111111111",
"produk_nama": "Galon Isi Ulang - 2500",
"masuk_tanggal": "2022-07-26 13:21:38",
"edit_oleh": "1111111111111111111111111",
"edit_tanggal": "2022-07-27 11:41:48"
"produk_nama": "Galon Isi Ulang - 3000",
"masuk_tanggal": "2022-07-26 14:10:45",
{
"1111111111": {
"produk_id": "1111111111",
"produk_nama": "Galon Isi Ulang - 2500",
"harga": 2500,
"status": 1,
"masuk_tanggal": "2022-07-26 13:21:38",
"masuk_oleh": "1",
"edit_oleh": "1111111111111111111111111",
"edit_tanggal": "2022-07-27 11:41:48"
},
"222222": {
"produk_id": "222222",
"produk_nama": "Galon Isi Ulang - 3000",
"harga": 3000,
"status": 1,
"masuk_tanggal": "2022-07-26 14:10:45",
"masuk_oleh": "1",
"edit_oleh": null,
"edit_tanggal": null
}
}
{
"1111111111": {
"produk_id": "1111111111",
"produk_nama": "Galon Isi Ulang - 2500",
"harga": 2500,
"status": 1,
"masuk_tanggal": "2022-07-26 13:21:38",
"masuk_oleh": "1",
"edit_oleh": "1111111111111111111111111",
"edit_tanggal": "2022-07-27 11:41:48"
},
"222222": {
"produk_id": "222222",
"produk_nama": "Galon Isi Ulang - 3000",
"harga": 3000,
"status": 1,
"masuk_tanggal": "2022-07-26 14:10:45",
"masuk_oleh": "1",
"edit_oleh": null,
"edit_tanggal": null
}
}
Cara buatnya di PHP:
$produks = $db->query('select * from t_produk where status=1 order by produk_nama');
foreach ($produks as $arr) {
$pids[$arr['produk_id']] = $arr;
$js_embed = 'var pids = \''.str_replace("'", "\'", json_encode($pids)).'\'; ';
//Tanda petik perlu direplace menjadi \' agar tidak terjadi error karena petik satu digunakan untuk buka tutup variabel.
$produks = $db->query('select * from t_produk where status=1 order by produk_nama');
$pids = array();
foreach ($produks as $arr) {
$pids[$arr['produk_id']] = $arr;
}
$js_embed = 'var pids = \''.str_replace("'", "\'", json_encode($pids)).'\'; ';
//Tanda petik perlu direplace menjadi \' agar tidak terjadi error karena petik satu digunakan untuk buka tutup variabel.
$produks = $db->query('select * from t_produk where status=1 order by produk_nama');
$pids = array();
foreach ($produks as $arr) {
$pids[$arr['produk_id']] = $arr;
}
$js_embed = 'var pids = \''.str_replace("'", "\'", json_encode($pids)).'\'; ';
//Tanda petik perlu direplace menjadi \' agar tidak terjadi error karena petik satu digunakan untuk buka tutup variabel.
Jadinya javascript dan implementasinya untuk akses array multidimensi, adalah sebagai berikut:
<script type="text/javascript">
var pids = '{"1111111111":{"produk_id":"1111111111","produk_nama":"Galon Isi Ulang - 2500","harga":2500,"status":1,"masuk_tanggal":"2022-07-26 13:21:38","masuk_oleh":"1","edit_oleh":"1111111111111111111111111","edit_tanggal":"2022-07-27 11:41:48"},"222222":{"produk_id":"222222","produk_nama":"Galon Isi Ulang - 3000","harga":3000,"status":1,"masuk_tanggal":"2022-07-26 14:10:45","masuk_oleh":"1","edit_oleh":null,"edit_tanggal":null}}';
$(document).ready(function() {
$("#produk_id").change(function() {
var produk_id = $(this).val();
if (produk_id=="" || produk_id==0 || produk_id=="0") {
var json = JSON.parse(pids);
// alert(json[produk_id].produk_nama);
var hargax = json[produk_id].harga;
var totalx = hargax * $("#jumlah").val();
<script type="text/javascript">
var pids = '{"1111111111":{"produk_id":"1111111111","produk_nama":"Galon Isi Ulang - 2500","harga":2500,"status":1,"masuk_tanggal":"2022-07-26 13:21:38","masuk_oleh":"1","edit_oleh":"1111111111111111111111111","edit_tanggal":"2022-07-27 11:41:48"},"222222":{"produk_id":"222222","produk_nama":"Galon Isi Ulang - 3000","harga":3000,"status":1,"masuk_tanggal":"2022-07-26 14:10:45","masuk_oleh":"1","edit_oleh":null,"edit_tanggal":null}}';
$(document).ready(function() {
$("#produk_id").change(function() {
var produk_id = $(this).val();
if (produk_id=="" || produk_id==0 || produk_id=="0") {
//reset
//resetForm();
return;
}
var json = JSON.parse(pids);
// alert(json[produk_id].produk_nama);
var hargax = json[produk_id].harga;
$("#harga").val(hargax);
var totalx = hargax * $("#jumlah").val();
$("#total").val(totalx);
});
});
</script>
<script type="text/javascript">
var pids = '{"1111111111":{"produk_id":"1111111111","produk_nama":"Galon Isi Ulang - 2500","harga":2500,"status":1,"masuk_tanggal":"2022-07-26 13:21:38","masuk_oleh":"1","edit_oleh":"1111111111111111111111111","edit_tanggal":"2022-07-27 11:41:48"},"222222":{"produk_id":"222222","produk_nama":"Galon Isi Ulang - 3000","harga":3000,"status":1,"masuk_tanggal":"2022-07-26 14:10:45","masuk_oleh":"1","edit_oleh":null,"edit_tanggal":null}}';
$(document).ready(function() {
$("#produk_id").change(function() {
var produk_id = $(this).val();
if (produk_id=="" || produk_id==0 || produk_id=="0") {
//reset
//resetForm();
return;
}
var json = JSON.parse(pids);
// alert(json[produk_id].produk_nama);
var hargax = json[produk_id].harga;
$("#harga").val(hargax);
var totalx = hargax * $("#jumlah").val();
$("#total").val(totalx);
});
});
</script>
Akses data JSON berdasarkan produk_id jadi sangat mudah.
Tambahan info, berikut cara loop iterasi array key value dari json di javascript:
var jsonx = '{"data1":1,"data2":1,"data3":1,"data4":1,"data5":1,"data6":1}';
var arr = $.parseJSON(jsonx);
$("#debug").append(k+" = "+arr[k]);
//k adalah key, dalam hal ini bernilai data1, data2, dst, sedang arr[k] adalah nilainya
var jsonx = '{"data1":1,"data2":1,"data3":1,"data4":1,"data5":1,"data6":1}';
try {
var arr = $.parseJSON(jsonx);
for(var k in arr) {
$("#debug").append(k+" = "+arr[k]);
//k adalah key, dalam hal ini bernilai data1, data2, dst, sedang arr[k] adalah nilainya
}
} catch (s) {
alert(e);
}
var jsonx = '{"data1":1,"data2":1,"data3":1,"data4":1,"data5":1,"data6":1}';
try {
var arr = $.parseJSON(jsonx);
for(var k in arr) {
$("#debug").append(k+" = "+arr[k]);
//k adalah key, dalam hal ini bernilai data1, data2, dst, sedang arr[k] adalah nilainya
}
} catch (s) {
alert(e);
}
Demikian semoga bermanfaat.