[AJAX] 基礎JSON PHP -> 回傳處理後訊息

AJAX的方法很多很多，今天我就教大家最基本的方法，當然網路也很多教學，爬了很多文發現對AJAX得了解資深了許多，當我在自己編寫網頁時，最困擾的就是可以取得要求但卻取步到PHP的回應!

首先的基礎，才看得懂文章唷！

---

具備PHP基本基礎

具備JQUERY(JAVASCRIPT)基礎

開始囉

---

WHAT IS JSON?

進入正題，我知道大家都比我資深但是我還是要說一下，因為腦力記憶力不好的我時常忘東忘西的，好！什麼是JSON呢?JSON是一種可以跨平台的語言，我們今天將由這位厲害的傢伙，從php中的語言轉換給JQUERY必續靠給他才能運行!(其實方法很多種沒錯!但這是最廣泛的一種唷!)

JSON EXAMPLE

{
       "網站名稱":"不知為毛",
       "今天日期":"2016/8/13"
}

嘿,沒錯有如以上這幾段小代碼就是JSON的格式,外面由{}包覆住,裡面由"xxx":"ooo"格式寫入(xxx有如引數,ooo有如裡面的資料),當然不只有一個,所以我們會用","號將他隔開

重點來囉!JQUERY如何讀取JSON資料呢

其實沒有想像中的困難，這代碼已經告訴我們答案囉！

<script type="text/javascript" language="javascript">
var web = {                                  //這行是剛剛講過的建立JSON資料
       "webName":"不知為毛",
       "todayDate":"2016/8/13"
}

//開始讀取資料囉 我們用最基本的ALERT方法

alert(web.webName);
</script>

這樣輸出就是"不知為毛"囉!只要透過建立的JSON變數資料,再由"."取得裡面的相關引數就可以囉

重點二來囉!PHP如何傳出JSON資料呢

其實真的沒有想像中的困難，我們的困難，程式設計師已經都幫我們想好了！

利用json_encode的方法，我們可以將PHP的陣列轉成JSON

利用json_decode的方法，我們可以將JSON轉成PHP的陣列

<?php
      $json = array(
            "webName" => "不知為毛",
            "todayDate" =>  "2016/8/13"
      );
     echo json_encode($json);
?>

這樣我們就完美的把它輸出成JSON囉!

---

現在我們正式進入課題囉，先申明小弟不才有錯誤請邊小力一點！以下的課題我們用最簡單傳參方式進行，並非使用表單進行喔！

JQUERY AJAX

$.ajax({
                url: 'request.php',
                type:"POST",
                data: {  webName:"不知為毛",todayDate:"2016/8/13"  },
                     //我們也是利用JSON傳給PHP
                dataType: "json",
                    //這裡其實蠻重要的,這是SERVER回傳後的格式記得設定JSON
                success: function(data){
                    //成功後,我們再由php回傳給JQUERY資料
                    console.log("資料傳輸狀態:"+data.status);
                    console.log("資料傳輸回應:"+data.msg);
                }
});

其實很多方法可以傳值給PHP,如果利用FORM表單,您可以將DATA欄位改成
$('form').serialize() 3WSCHOOL教學
serialize()其實就是把FORM表單裡的資料改成AJAX可以閱覽的格式但這部是JSON唷!

PHP GET VALUE AND AJAX

<?php
          echo print_r($_POST);//
?>

當然啦,傳過來我們用的是POST方法,現在我們一樣用POST方法接回來看看是什麼呢?

好的，相信圖片告訴我們非常清楚，在這個陣列裡果真傳了兩個引數，現在我們將它讀取並將它傳送回給jquery好了!!

<?php
            $webName = $_POST['webName'];  //兩行讀取POST裡面的ARRAY資料
            $todayDate = $_POST['todayDate'];
           //接下來開始寫我們要回傳的東西囉!
           //剛剛在JQUERY裡寫入了兩個引數(status,msg) 所以我們現在要用上他們了
            $json = array(
                  'status'  =>  $webName.'恭喜傳輸成功!',
                  'msg'   =>   '今天'.$todayDate.'傳輸了一筆資料!'
            );
           echo json_encode($json);
?>

重新瀏覽後我們將發現

他已經自動轉成JSON囉!瀏覽器也自行將他分析好了!

此時我們回控制台,就已經大功告成囉!