Cara Membaca echo json_encode() dari JQuery

Postingan AneIqbal kali ini akan menjelaskan bagaimana cara untuk membaca atau mendapatkan data hasil echo json_encode dari JQuery. Contoh kasusnya, kita memiliki sebuah array assosiatif yang disimpan dalam vairabel $data.

$data = array('id' => '10', 'pesan' => 'Halo..', 'status' => 'success');

Lalu, kita ingin array tersebut diubah menjadi data JSON dengan menggunakan json_encode(). Seperti ini codingnya.

echo json_encode($data);

Data sudah berubah bentuk menjadi data JSON. Data ini akan dibaca oleh JQuery dengan menggunakan $.parseJSON().

$(document).ready(function() {
    $("#youridform").submit(function(event){
      event.preventDefault();
      var url = $(this).attr("action");
      var method = $(this).attr("method");
      var data = $(this).serialize();

      $.ajax({
        url: url,
        type: method,
        data: data
      }).done(function(data){
        var d = $.parseJSON(data);
        alert(d.pesan);
      })
    });
});

Maka hasilnya akan menampilkan popup alert ‘Halo..’.

Dikutip dari https://api.jquery.com/jquery.parsejson/, $.parseJSON() sudah berstatus deprecated pada JQuery versi 3.0. Sebagai gantinya, kita bisa menggunakan JSON.parse().

English version

This post will show you how to read or get data from echo json_encode() from JQuery. For example, we have an associative array that stored in variable $data.

$data = array('id' => '10', 'message' => 'Halo..', 'status' => 'success');

We want to transform that array into JSON data. So, we use the json_encode().

echo json_encode($data);

Now, we have the JSON data and we want the JQuery get this data. We can use the $.parseJSON() to do that.

$(document).ready(function() {
    $("#youridform").submit(function(event){
      event.preventDefault();
      var url = $(this).attr("action");
      var method = $(this).attr("method");
      var data = $(this).serialize();

      $.ajax({
        url: url,
        type: method,
        data: data
      }).done(function(data){
        var d = $.parseJSON(data);
        alert(d.message);
      })
    });
  });

The popup alert ‘Halo..’ will show on your display.

As information from https://api.jquery.com/jquery.parsejson/, $.parseJSON() is deprecated in JQuery 3.0. As replacement, we can use the JSON.parse().