Magento 2 – Return PHTML File Content in AJAX Response

ajaxmagento2phtml

I am calling an controller function via Ajax and its calling and returning correct data. But how can I return Controller function respective phtml file content instead of some data from controller function.

Here is my current code that returning data –

public function execute()
{
    $result = $this->resultJsonFactory->create();
    $request = $this->getRequest();
    if ($request->isAjax()) {
        $method = $request->getParam('method');
        if($method != '')
            $regions = $this->getRegionByCountryId($request);
            $result->setData($regions);
        } else {
            $result->setData(['error' => 'method not found']);
        }
    }

    return $result;
}

Its running fine and retruning data to my ajax function.

But I want to return phtml file content instead of this data, So for that I have created an handler for this and respective phtml file.

Handler file is – booking_index_ajax.xml with below code –

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceContainer name="main" htmlClass="content-page">
            <block class="Mymodule\Booking\Block\BookingList"
                   name="test.booking.filtertable"
                   template="Mymodule_Booking::content/test.phtml"
                   after="-"/>
        </referenceContainer>
    </body>
</page>

And created an respective test.phtml file on specified location –

<?php 
echo "Hello"; 
?>

But my test.phtml file content is not retruning, Please let me know what I am doing wrong.

You answer worked #AMIT, But I am trying to use my execute function to get Json and phtml file both – Its returning phtml if I am not applying 'return' in Json If block, But If I am applying "return $result" statement in then returning nothing. here is mine code –

public function execute()
{
    $request = $this->getRequest();
    if ($request->isAjax()) {
        $method = $request->getParam('method');
        if ($method === 'getRegionByCountryId') {
            $result = $this->resultJsonFactory->create();
            $regions = $this->getRegionByCountryId($request);
            $result->setData($regions);
            //return $result;
        } elseif ($method === 'getAddressesByCountryId') {
            $resultLayout = $this->resultFactory->create(ResultFactory::TYPE_LAYOUT);
            return $resultLayout; 
        } else {
            $result = $this->resultJsonFactory->create();
            $result->setData(['error' => 'method not found']);
            return $result;
        }
    }
}

Regards

Best Answer

You need to do some modify at controller and layout file:

Action file look like:

namespace{YourClassNameSpace};


use Magento\Framework\App\ResponseInterface;
use Magento\Framework\Controller\ResultFactory;

class {YourClassname} extends \Magento\Framework\App\Action\Action
{

............
..............

    public function execute()
    {

        $resultLayout = $this->resultFactory->create(ResultFactory::TYPE_LAYOUT);
        return $resultLayout; 
    }
}

Now,you have add root container at your layout file booking_index_ajax.xml :

<?xml version="1.0"?>
<layout xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/layout_generic.xsd">
    <container name="root">
       <block class="Mymodule\Booking\Block\BookingList"
                   name="test.booking.filtertable"
                   template="Mymodule_Booking::content/test.phtml"
                   />
    </container>
</layout>
Related Topic