How to get json data on frontend in magento

Question

I have a custom module, which uses for email varification in frontend of magento. This module will appear as a popup in homepage while it loads. I want to do some other functionings such as display register form etc. in the same popup section, according to the output obtain from this email varification form...

Email varification happens in controller and it look like this

class Realuk_Login_IndexController extends Mage_Core_Controller_Front_Action
{
public function indexAction()
{

    $this->loadLayout();
    $this->renderLayout();
}
public function loginAction() 
{ 
    $session = Mage::getSingleton('customer/session'); 
    //check whether session exist or not
    if ($session->isLoggedIn()) 
    { 
        return;
    } 

    $result=array('error'=>'noError','success'=>false);
            /*
                email varification code comes here; according to this section
                $array will set;

            */
            //json encoding happens here
            $jsonData=$this->getResponse()->setBody(Mage::helper('core')->jsonEncode($result)); /
    $this->_redirect('home'); //this is my home page redirection
}
}  

my frontend file that render popup section contains this code..

<?php
       $array = Mage::helper('core')->jsonDecode($jsonData);
       if(!empty($array))
       {
            echo "<pre>";
            print_r($array);
            echo "</pre>";
       }
       else
       {
            echo "no json data exists";
       }
 ?>

It seems that $array is empty every time in frontend. However in controller $jsonData posses some values. My url look likes www.mydomain.com/home/ and no json value can see there

My question is..

1)Is this the proper way to get results from controller to frontend?

2)How to accomplish json decoding in frontend phtml file ?

Please share your thoughts.. It will help me and others also.

Thanks in advance

Answer 1

The proper way to send JSON data from the controller action is to do as such:

public function indexAction()
{
        $this->getResponse()->clearHeaders()->setHeader('Content-type','application/json',true);
        $this->getResponse()->setBody(json_encode($response));
}

...where $response is an object or an array.

However, the proper way to "consume" it or to use it depends on your application. The JSON 'decoding' is handled by your ajax method in the javascript. Here are a couple examples:

jQuery

$.ajax({
    dataType: 'json',
    data: /* your data serialized */
    url: '/route/controller/action'
}).done(function(response){
    console.log(response); // will return the json as an object
});

Prototype.js

new Ajax.Response({
    requestHeaders: {Accept: 'application/json'},
    onSuccess: function(response){
        var json = response.responseText.evalJSON(true);
        console.log(json);
    }
});

You can learn more about how to use Prototype's Ajax method in this screencast I produced: http://quick.as/7x6ska7 [end: shamelessplug]

Answer 2

In Realuk_Login_IndexController::loginAction() you're setting response body but response itself is never send to the client, instead you're redirecting to the home page. You can either send the response by using:

$this->getResonse()->sendResponse();

or pass json data to the home page:

$jsonData = array(
    'json' => Mage::helper('core')->urlEncode(
        Mage::helper('core')->jsonEncode($result)
));
$this->_redirect('home', $jsonData);