Thursday, 14 January 2016

Cara Menyimpan Nilai Variabel JavaScript ke Variabel PHP

Pernah dalam suatu waktu saya bingung dengan keadaan, bagaimana cara untuk menyimpan nilai dari variabel javascript yang merupakan pemrograman di tingkat client (client-side scripting) dan dimasukkan ke dalam variabel PHP (server-side scripting)? Hal ini sangat perlu jika kita mendapatkan input data yang dimasukkan ke dalam variabel javascript, kemudian inputan tersebut akan diolah, misalnya akan dimasukkan ke dalam suatu database. Maka isi variabel javascript tersebut harus dipindahkan dulu ke variabel PHP.


Ternyata ada beberapa macam cara untuk mengatasinya, ada yang menggunakan cara dengan mengirimnya sebagai method post, atau dengan memanfaatan DOM (data object model) atau juga dengan cookies, seperti yang ditunjukkan oleh Saudara Dody dihalamannya ini. Cukup panjang bukan? Sebenarnya ada cara lagi, yaitu dengan menggunakan konsep AJAX. Apa itu AJAX? Silakan dicari dan dipelajari sendiri hehee, untuk saat ini saya pun masih tingkat pemula untuk urusan AJAX. Namun, terdapat cara yang sangat simpel dan sederhana untuk mengakalinya, tidak perlu mengeryitkan dahi segala, yaitu dengan menyimpannnya ke dalam sebuah form input.

Form input dibuat sebagai mediator dari variabel javascript dan php, benar-benar tempat netral yang serba guna hahahaa [ngasal mode on]. Kalau ingin tidak terlihat form inputnya, maka typenya dapat dibuat hidden. Caranya adalah seperti yang ditunjukkan pada kode html dan script javascript & PHPnya berikut ini:

<html>
<head>
<title>passing javascript variable to php</title>

<script type="text/javascript">
function cek()
{
var varJS = "12345";
document.form1.media.value = varJS;
}

</script>
</head>

<body>

<form name="form1" id="form1" method="post" onsubmit="cek()">
<input type="hidden" id="media" name="media" value="">
<input type="submit" id="submit" name="submit" value="cek">
</form>

<?php
$varPHP = $_POST['media'];
echo "variabel javascript yang telah diisikan ke variabel php : $varPHP";
?>

</body>
</html>

Disana dimisalkan telah didapatkan nilai dari suatu variabel javascript. Kemudian langkah selanjutnya adalah mengisikan value ke form input di kode HTMLnya
document.form1.media.value = varJS;
- form1 -> nama form
- media -> nama input text

Baru kemudian nilainya diambil oleh sintaks phpnya dengan cara $varPHP = $_POST['media']; untuk dimasukkan ke dalam variabel PHP $varPHP.

BERHASIL Photobucket

Kemudian, bagaimana jika sebaliknya, MENYIMPAN NILAI VARIABEL PHP KE VARIABEL JAVASCRIPT? Caranya pun juga tidak terlalu sulit karena disini kita juga menggunakan kekuatan magic dari form, namun tidak memerlukan form input. Photobucket

Intinya adalah menggunakan suatu parameter, misalnya sebagai berikut:

<html>
<head>
<title>passing php variable to javascript</title>

<script type="text/javascript">
function cek(A)
{
alert (A);
}

</script>

</head>

<body>

<?php $s="ini adalah nilai variabel php"; ?>

<form name="form1" id="form1" method="post" onsubmit="cek('<?php echo $s ?>')">
<input type="submit" id="sub" name="sub" value="tes variabel php">
</form>

</body>
</html>

Disana, nilai dari variabel PHP akan disimpan sebagai variabel A (variabel javascript).

Atau bisa juga memakai form input dengan mengeset valuenya dengan nilai variabel PHP, kemudian fungsi cek (fungsi javacript) mengambil nilai dari form input tersebut dengan sintaks document.getElementByID('sub').value. Kalau disini kita tidak menggunakan parameter.

Namun, cara ini memiliki kelemahan, yaitu jika kita memakai tabel yang datanya diperoleh dari database, maka otomatis ID dari form input juga akan sama untuk tiap data (row) yang muncul. Sehingga nilai yang diambil pun pasti akan row tabel yang paling atas.

Kalau hanya ingin menampilkan variabel PHPnya saja di dalam javascript tanpa menyimpannya ke dalam variabel javascript, bisa langsung menggunakan sintaks berikut di dalam body HTML:

<?php $s="ini adalah nilai variabel php"; ?>

<?php echo "<script>alert('$s')</script>" ?>
<?php echo "<script>document.write('tes $s')</script>" ?>

Tetapi tidak bisa dibalik seperti ini:

<script>alert("<?php $s ?>")</script>
<script>document.write("tes <?php $s ?>")</script>

Hal ini karena PHP sebagai server-side scripting tidak bisa dimasukkan ke javascript (TIDAK BERLAKU --> PHP on JAVASCRIPT)

No comments:

Post a Comment