Postingan lainnya
Kelas Premium!
Belajar bikin website dari nol sekarang
Gunakan kupon "lebihcepat" untuk diskon 25%!
Kelas Premium!
Belajar Javascript untuk website
Gunakan kupon "mulaijs" untuk diskon 75 ribu!
data array(dari file php json encode) di panggil ke file .js tapi tidak bekerja
Semoga ada yang bersedia bantu :
saya buat buat 3 file(jsonEncode php, index.php dan file data,js)
File json php untuk menmpilakan array dari db :
<?php
include("connect.php");
$sql = mysqli_query($connect, "SELECT * FROM user");
while ($row = mysqli_fetch_array($sql)) {
$jsonData[] = $row['nama'];
}
json_encode($jsonData);
lalu di panggil/dimunculkan terlebih dahulu ke label index.php:
<label id="labeldata"> <?php include("backend/ajax.php"); $namaambil = json_encode($jsonData); echo ($namaambil); ?> </label>
dan dipanggil di file .js isi labelnya dengan tujuan tetap jadi array dan berfungsi sebagai array:
const labels = [document.getElementById("labeldata").innerHTML];
tp kalo di broser muncul tp arraynya ga berfungsi/ cuma tampil aja di innerhtml
6 Jawaban:
<div>Ga bisa kaya gitu mas...<br><br>Solusi dari saya adalah, loop json/arraynya di javascript.<br><br>Misal<br><br></div><pre>let json = JSONDARIAJAX; let array = []; for (i in json) { array.push(i); } console.log(array);</pre>
<div>jika ingin ambil data dari php, saran nya menggunakan fungsi XMLHttpRequest atau fetch yang ada di javascript<br><br>contoh :<br>XMLHttpRequest</div><pre>let xml = new XMLHttpRequest();
xml.onreadystatechange = function () {
if (xml.readyState === 4) {
if (xml.status === 200) {
console.log(xml.response); // sukses
} else {
console.log(xml.response); // error
}
}
}
xml.open("GET", "URL lokasi PHP nya");
xml.send();</pre><div><br>Fetch</div><pre>fetch("URL lokasi PHP nya")
.then(response => response.json())
.then(response => {
console.log(response);
})
.catch(error => console.log(error))</pre><div><br><br></div>
<div>Terima kasih banyak semua atas bantuannya. tp saya masih belum berhasil. mohon pencerahannya lagi.<br><br>Jadi kasusnya saya mau mengisi array di javascript, array tersebut di dapatkan dari database.<br>nah untuk dapat data arraynya saya membuat file json.php<br><br>script fetch yang dikasih diatas berhasil, tp sya masih bingung untuk menjadikannya variable array/ menjadikan array di js masih belum berhasil. sudah browsing sana sini masih mentok, terima kasih banyajk atas bantuannya. semoga jawaban pencerahan lagi.<br><br>note : kalo input manual arraynya di js berhasil muncul sesuai kemauan, seperti :</div><pre>const = ['A','B','C','D']</pre><div><br>pas di isi dengan data dari json ga bisa SEPERTI :</div><pre>fetch("json.php") .then(response => response.json()) .then(response => { console.log(response)<pre> const = ['A','B','C','D']</pre> <br> });</pre>
<div>baru saja saya test bisa, ini contoh code nya <br><br>Controller</div><pre>function data()
{
return json_encode(['A', 'B', 'C', 'D']);
}</pre><div><br>View / Javascript</div><pre><!DOCTYPE html>
<html lang="en">
<head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head>
<ul class="showData"></ul>
<body>
<script>
const _BASE_URL = "<?= base_url() ?>";
fetch(_BASE_URL + "/data")
.then(response => response.json())
.then(response => {
let li = '';
for (const res of response) {
li += &lt;li&gt;${res}&lt;/li&gt;
}
document.querySelector('.showData').innerHTML = li;
})
.catch(error => console.log(error))
</script>
</body>
</html></pre><div><br></div>
<div>Terima kasih banyak ka tera atas bantuannya. <br>Jadi sebetulnya intinya saya mau dapat data array dari php.json di simpan jadi variable array di .js untuk kemudian digunakan.<br><br>Saya gunakan script yang di kasih berhasil muncul tp saat dimasukan jd variabel array di .js tidak bisa digunakan sebagai array. Mohon maaf saya masih belajar. Terima kasih banyak</div>
<div>tipe data yang dihasilkan oleh fetch itu promise, dan promise bersifat asynchronous jadi kalau mau masukkan ke variabel harus menggunakan fungsi async await, nggk bisa langsung masuk saja<br><br></div><pre> function getData() { return fetch(_BASE_URL + "/data") .then(response => response.json()) .then(response => response) .catch(error => console.log(error)) }
const array = async () =&gt; {
let arr = await getData();
//proses
console.log(arr);
}
array();</pre><div><br>untuk pahami lebih lagi, mungkin bisa coba pelajari synchronous dan asynchronous</div>