The data exchange method between PHP and JavaScript using Json is explained in detail
- 2020-06-15 07:57:12
- OfStack
JSON(JavaScript Object Notation) is a lightweight data exchange format.
In short, both xml and json are intended to be a convenient hub for interacting with data on the client side and the server side, especially for object-type data, such as the most common arrays.
The following are simple examples of passing arrays from php to javascript and from javascript to php, respectively. Whether transmitted from php to javascript or javascript to php, json flattens the object to one dimension as a string before transmitting.
PHP passes values to JavaScript
PHP file json php
Light execution of this file results in the following:
json. php flattens the array and sends it via the json_encode function, instead of the json_decode function.
So how do you call it in JavaScript? Very simply, define a variable to get the Json from PHP. This Json has the properties of objects. We can use array.name to get the properties of this Json.
The operation results are as follows:
JavaScript passes values to PHP
json_encode.html
Here javascript flattening need a plug-in: http: / / www json. org/json2 js, through JSON. stringify (str) to flatter the object and then transmitted to the php.
Note: another one http: / / www json. org/json js, corresponding is toJSONString method.
json_encode.php
This is where the function json_decode() is used and the data is called with $obj- > Properties.
In short, both xml and json are intended to be a convenient hub for interacting with data on the client side and the server side, especially for object-type data, such as the most common arrays.
The following are simple examples of passing arrays from php to javascript and from javascript to php, respectively. Whether transmitted from php to javascript or javascript to php, json flattens the object to one dimension as a string before transmitting.
PHP passes values to JavaScript
PHP file json php
<?php
$arr = array(
'name' => ' The home of the script ',
'nick' => 'Gonn',
'contact' => array(
'email' => 'xxxxxxx@163.com',
'website' => 'https://www.ofstack.com',
)
);
$json_string = json_encode($arr);
echo "getProfile($json_string)";
?>
Light execution of this file results in the following:
getProfile({"name":"u5e0cu4e9a","nick":"Gonn",
"contact":{"email":"xxxxxxx@163.com","website":"https://www.ofstack.com"}})
json. php flattens the array and sends it via the json_encode function, instead of the json_decode function.
So how do you call it in JavaScript? Very simply, define a variable to get the Json from PHP. This Json has the properties of objects. We can use array.name to get the properties of this Json.
<script type="text/javascript">
function getProfile(str) {
var arr = str;
document.getElementById('name').innerHTML = arr.name;
document.getElementById('nick').innerHTML = arr.nick;
document.getElementById('email').innerHTML = arr.contact.email;
document.getElementById('website').innerHTML = arr.contact.website;
}
</script>
<body>
<div id="name"></div>
<div id="nick"></div>
<div id="email"></div>
<div id="website"></div>
</body>
<script type="text/javascript" src="json.php"></script>
The operation results are as follows:
The home of the script
Gonn
xxxxxxx@163.com
https://www.ofstack.com
JavaScript passes values to PHP
json_encode.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>json:From javascript To php</title>
<script src="json2.js" type="text/javascript"></script>
<script type="text/javascript">
function JSON_test(o)
{
var user = {
name:document.getElementById('txt_name').value,
email:document.getElementById('txt_email').value,
password:document.getElementById('txt_password').value
}
var json_string = JSON.stringify(user);
document.getElementById('txt_json').value=json_string;
alert(" Click OK and the form will be submitted ");
o.submit();
}
</script>
</head>
<body>
<form id="form1" name="form1" method="post" action="json_encode.php"onsubmit="JSON_test(this);return flase;">
<label for="txt_name"> The name </label>
<p><input type="text" name="txt_name" id="txt_name" /></p>
<label for="txt_email"> email </label>
<p><input type="text" name="txt_email" id="txt_email" /></p>
<p><label for="txt_password"> password </label></p>
<p><input type="text" name="txt_password" id="txt_password" /></p>
<p><input type="text" name="txt_json" id="txt_json" />
<label for="button"></label>
<input type="submit" name="button" id="button" value="JSON" />
</p>
</form>
</body>
</html>
Here javascript flattening need a plug-in: http: / / www json. org/json2 js, through JSON. stringify (str) to flatter the object and then transmitted to the php.
Note: another one http: / / www json. org/json js, corresponding is toJSONString method.
var last=obj.toJSONString(); // for json.js
var last=JSON.stringify(obj); // for json2.js
json_encode.php
<?php
header('Content-Type: text/html; charset=utf-8');
$json_string = $_POST["txt_json"];
//echo $json_string;
if(ini_get("magic_quotes_gpc")=="1")
{
$json_string=stripslashes($json_string);
}
$user = json_decode($json_string);
echo var_dump($user);
echo '<br /><br /><br /><br />';
echo $user->name.'<br />';
echo $user->email.'<br />';
echo $user->password.'<br />';
?>
This is where the function json_decode() is used and the data is called with $obj- > Properties.