Hari ini, Kami ingin berbagi dengan Anda cara mendapatkan nilai variabel javascript di php di halaman yang sama. Dalam posting ini kami akan menunjukkan kepada Anda meneruskan variabel javascript ke php halaman yang sama ajax, dengar untuk meneruskan variabel javascript ke php di halaman yang sama kami akan memberi Anda demo dan contoh untuk diterapkan. Dalam posting ini, kita akan belajar tentang cara meneruskan nilai dari satu halaman ke halaman lain di php dengan sebuah contoh
bagaimana cara menyimpan nilai javascript dalam variabel php?
Isi
Baca Juga Ini 👉 Bagaimana cara meneruskan variabel dan data dari PHP ke JavaScript?
Anda tidak bisa mendapatkan variabel js secara langsung dalam kode server PHP, Anda harus membuat permintaan HTTP PHP dengan data (Seperti sebagai $ Anda. permintaan ajax() di atas) setelah itu gunakan $_POST atau $_GET di PHP untuk mengambil nilainya
Saat Anda memiliki variabel PHP pada halaman yang sama dengan kode JavaScript, Anda dapat menggunakan echo untuk meneruskan variabel dari PHP ke JavaScript secara langsung
Misalkan Anda memiliki file index.php dengan konten berikut
$name = "Nathan";
?>
<h1>Passing PHP variable to JavaScripth1>
<h2 id="result">h2>
<script>
const data = " echo $name; ?>";
const result = document.getElementById("result");
result.innerText = data;
script>
Saat Anda menjalankan kode di atas, nilai variabel
// 👇 sending a string
$name = "Nathan";
?>
<script>
const data = " echo $name; ?>";
script>
// 👇 sending an int
$age = 29;
?>
<script>
const data = echo $age; ?>;
script>
_0 akan diteruskan ke variabel
// 👇 sending a string
$name = "Nathan";
?>
<script>
const data = " echo $name; ?>";
script>
// 👇 sending an int
$age = 29;
?>
<script>
const data = echo $age; ?>;
script>
1 di JavaScript
Untuk menunjukkan bahwa berfungsi, nilai
// 👇 sending a string
$name = "Nathan";
?>
<script>
const data = " echo $name; ?>";
script>
// 👇 sending an int
$age = 29;
?>
<script>
const data = echo $age; ?>;
script>
_1 kemudian ditetapkan sebagai konten tag
// 👇 sending a string
$name = "Nathan";
?>
<script>
const data = " echo $name; ?>";
script>
// 👇 sending an int
$age = 29;
?>
<script>
const data = echo $age; ?>;
script>
3. Browser membuat output berikut
![PHP echo variable in JavaScript]()
Variabel gema PHP dalam JavaScript
Dengan fungsi echo, Anda dapat menampilkan string dengan menambahkan simbol kutipan (tunggal atau ganda) sebelum tag
// 👇 sending a string
$name = "Nathan";
?>
<script>
const data = " echo $name; ?>";
script>
// 👇 sending an int
$age = 29;
?>
<script>
const data = echo $age; ?>;
script>
5 di atas
Jika Anda mengirimkan nilai
// 👇 sending a string
$name = "Nathan";
?>
<script>
const data = " echo $name; ?>";
script>
// 👇 sending an int
$age = 29;
?>
<script>
const data = echo $age; ?>;
script>
_6, Anda tidak memerlukan simbol kutipan
// 👇 sending a string
$name = "Nathan";
?>
<script>
const data = " echo $name; ?>";
script>
// 👇 sending an int
$age = 29;
?>
<script>
const data = echo $age; ?>;
script>
_
Saat Anda mengirim array PHP, Anda perlu memanggil fungsi
// 👇 sending a string
$name = "Nathan";
?>
<script>
const data = " echo $name; ?>";
script>
// 👇 sending an int
$age = 29;
?>
<script>
const data = echo $age; ?>;
script>
7 sebelum meneruskannya ke JavaScript
$array = [1, 2, 3];
?>
<script>
const data = echo json_encode($array); ?>;
script>
_
Dan begitulah cara Anda meneruskan variabel PHP ke JavaScript dengan memanggil fungsi echo
Selanjutnya, mari kita lihat cara menggunakan DOM untuk meneruskan variabel PHP ke JavaScript
Menggunakan DOM untuk meneruskan variabel PHP ke JavaScript
Terkadang, Anda mungkin memerlukan variabel PHP setelah pengguna melakukan tindakan seperti mengklik tombol
Anda mungkin juga memiliki banyak variabel PHP yang ingin Anda berikan, dan sementara echo berfungsi untuk mengirim data PHP ke JavaScript, Anda mungkin menginginkan solusi yang lebih bersih
Selain memanggil fungsi echo_, Anda juga dapat menggunakan tag HTML DOM untuk menyimpan data PHP
Ini sebuah contoh
<div id="data-name" style="display: none;">
$name = "Nathan"; // this is where you get the data
echo htmlspecialchars($name); // put as the div content
?>
div>
<div id="data-age" style="display: none;">
$age = 29; // this is where you get the data
echo htmlspecialchars($age); // put as the div content
?>
div>
<div id="data-array" style="display: none;">
$array = [1, 2, 3]; // this is where you get the data
echo htmlspecialchars($array); // put as the div content
?>
div>
Dengan menyimpan data PHP Anda di tag DOM seperti yang ditunjukkan di atas, Anda kemudian dapat mengambil data menggunakan JavaScript sebagai berikut
<script>
const name = document.getElementById("data-name").textContent;
const age = document.getElementById("data-age").textContent;
const arr = document.getElementById("data-array").textContent;
script>
Metode ini mirip dengan menggunakan echo secara langsung, tetapi dianggap lebih bersih karena Anda echo ke DOM daripada variabel JavaScript
Anda juga dapat memilih kapan JavaScript harus mengambil data PHP. Ini tidak terjadi ketika Anda echo variabel JavaScript
Menggunakan pengambilan untuk mendapatkan data PHP dari JavaScript
Saat Anda ingin memisahkan template PHP dari kode JavaScript Anda, maka Anda dapat menggunakan JavaScript Fetch API
Ambil API digunakan untuk mengirim permintaan HTTP, mirip dengan AJAX dan XMLHTTPRequest. Ini memungkinkan Anda mengambil sumber daya dari mana saja di Internet
Ambil dapat digunakan untuk mengambil data PHP menggunakan JavaScript. Misalkan Anda memiliki file PHP bernama
$array = [1, 2, 3];
?>
<script>
const data = echo json_encode($array); ?>;
script>
4 dengan konten berikut
php
/* put your process here:
* query the database
* get session, etc.
*/
$arr = [
"name" => "Nathan",
"age" => 27
];
// 👇 when done, echo the data
echo json_encode($arr);
Setelah Anda menyiapkan file PHP, buat file index.php tempat Anda akan mengambil datanya
Tambahkan tag
$array = [1, 2, 3];
?>
<script>
const data = echo json_encode($array); ?>;
script>
_6 seperti yang ditunjukkan di bawah ini
<div id="result">div>
<script>
// 👇 URL to your data location
fetch("http://localhost:8080/data.php")
.then((res) => res.json())
.then((data) => {
const result = document.getElementById("result");
result.textContent = JSON.stringify(data);
});
script>
Fungsi
$array = [1, 2, 3];
?>
<script>
const data = echo json_encode($array); ?>;
script>
7 akan mengirim permintaan HTTP ke file
$array = [1, 2, 3];
?>
<script>
const data = echo json_encode($array); ?>;
script>
4
Kemudian, fungsi
$array = [1, 2, 3];
?>
<script>
const data = echo json_encode($array); ?>;
script>
_9 akan menguraikan respons sebagai objek JSON. Terakhir, objek JSON yang dikembalikan akan ditetapkan sebagai konten dari tag
<div id="data-name" style="display: none;">
$name = "Nathan"; // this is where you get the data
echo htmlspecialchars($name); // put as the div content
?>
div>
<div id="data-age" style="display: none;">
$age = 29; // this is where you get the data
echo htmlspecialchars($age); // put as the div content
?>
div>
<div id="data-array" style="display: none;">
$array = [1, 2, 3]; // this is where you get the data
echo htmlspecialchars($array); // put as the div content
?>
div>
0 di atas
Outputnya adalah sebagai berikut
![Retrieve PHP data with fetch]()
Ambil data PHP dengan mengambil
Dan begitulah cara Anda meneruskan variabel atau data PHP ke JavaScript menggunakan fungsi
$array = [1, 2, 3];
?>
<script>
const data = echo json_encode($array); ?>;
script>
7
Berbeda dengan dua metode lainnya, metode ini membuat permintaan HTTP, sehingga akan ada penundaan sebelum data diambil
Direkomendasikan untuk menggunakan Fetch API saat data PHP Anda memerlukan pemrosesan yang rumit sebelum meneruskannya ke JavaScript
Kesimpulan
Untuk meneruskan variabel dan data PHP ke JavaScript, Anda perlu membuat data dapat diakses oleh JavaScript
Anda dapat echo data langsung ke variabel JavaScript, atau Anda dapat menyimpan data di DOM sebelum mengambilnya menggunakan objek JavaScript
<div id="data-name" style="display: none;">
$name = "Nathan"; // this is where you get the data
echo htmlspecialchars($name); // put as the div content
?>
div>
<div id="data-age" style="display: none;">
$age = 29; // this is where you get the data
echo htmlspecialchars($age); // put as the div content
?>
div>
<div id="data-array" style="display: none;">
$array = [1, 2, 3]; // this is where you get the data
echo htmlspecialchars($array); // put as the div content
?>
div>
3
Untuk data dengan pemrosesan yang kompleks, Anda dapat membuat file terpisah yang memproses data PHP Anda. Setiap bagian dari aplikasi Anda yang membutuhkan data dapat mengirimkan permintaan HTTP untuk mengambil data
Bagaimana cara membaca variabel JavaScript di PHP?
Cara meneruskan variabel JavaScript ke PHP adalah melalui permintaan . Jenis URL ini hanya terlihat jika kita menggunakan tindakan GET, tindakan POST menyembunyikan informasi di dalam URL. Sisi Server (PHP). Di halaman PHP sisi server, kami meminta data yang dikirimkan oleh formulir dan menampilkan hasilnya. $result = $_GET [ 'data' ];
Bagaimana cara meneruskan nilai variabel JavaScript ke PHP?
Jika Anda ingin meneruskan nilai JavaScript ke skrip PHP, Anda harus melakukan XMLHttpRequest untuk mengirim data kembali ke server. Now if you just need to pass a form value to the server, you can also just do a normal form post, that does the same thing, but the whole page has to be refreshed.
