JSON with Php, javascript and ajax ~ Codingslover Programming Blog, Tutorials, jQuery, Ajax, PHP, MySQL

Wednesday 13 May 2015

JSON with Php, javascript and ajax

Published on: Wednesday, May 13, 2015 by Unknown - 17 comments

What is JSON?

JavaScript Object Notation (JSON) is a lightweight data-interchange format inspired by the object literals of JavaScript.

JSON values can consist of:

objects (collections of name-value pairs)
arrays (ordered lists of values)
strings (in double quotes)
numbers
true, false, or null

JSON is language independent.

JSON with PHP?

After PHP Version 5.2.0, JSON extension is decodes and encodes functionalities as default.

Json_encode - returns the JSON representation of values
Json_decode - Decodes the JSON String
Json_last_error - Returns the last error occured.

JSON Syntax and Rules?

JSON syntax is derived from JavaScript object notation syntax:

Data is in name/value pairs
Data is separated by commas
Curly braces hold objects
Square brackets hold arrays

JSON Example

This example is simple phone number validation and once phone number has validated , it will be sent this php page, there we are using the json format related encode data.

Html Page:

<html>
<head>
<title>JSON Example in Php</title>
<script src="js/jquery-1.11.0.min.js"></script>
</head>
<body>
<h1>Json Basic Example</h1>
<form name="phone-form" method="post" onsubmit="return validation();">
 <input type="text" name="phone" id="phone" value="" >
 <input type="submit" value="submit" >
</form>
<div id="outputDisplay"></div>

Javascript Function

<script>
function validation(value){ 
 //Phone Number Validations
 var phone   = $('#phone').val();
 var specialDigitPattern  = /[~`!@#\$%\^&\*()\-_\+=|\\{}\[\]:;"'<>,\?\/\.0123456789]/;
 //var mailvalidateregex  = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/;  email validation
 if(phone == ""){
  alert("Please enter the phone ");
  return false;
 }else if(isNaN(phone)){
  alert('Please Enter Valid Phone Number');
  return false;
 }
 
 var postdata  = 'phone='+phone;
 var url   = 'testphone.php?phone='+phone;
 
 $.ajax({
  type  : "POST",
  url   : url, 
  data  : postdata,
  dataType : "json",
  success  : phonestatus_check,
 });
 return false;
}

function phonestatus_check(response){
 if(response.status == 1){
  alert('success');
  $("#outputDisplay").css("color","green");
  $("#outputDisplay").html(response.message);
 }else{
  alert('failure');
  return false;
 }
}
//ends
</script>

Php Page:

<?php
 if(isset($_POST['phone'])){
  $phonenumber = $_POST['phone'];
  $responsearray = array();$responsestatus = '1';
  if($responsestatus == 1){
      $responsearray = array('status' => 1,'message'=> 'Thanks for submitting the Phone Number');
  }else{
   $responsearray = array('status' => 0,'message'=> 'failure');
  }
  echo json_encode($responsearray);
  /* $json = json_encode($responsearray);
  if($_GET['jsoncallback'])
   exit("{$_GET['jsoncallback']}($json)"); */
 }
?>