Database Changes Don't Reflect in Frontend

Question

I have a module that allows the user (so far) to add and remove a bike from their garage.

I built my controllers (triggered via an AJAX call) and they seem to work alright. The only problem is, although the data enters the database perfectly fine, I have to run these just to display them on the frontend:

$ php bin/magento setup:upgrade
$ php bin/magento setup:di:compile
$ php bin/magento setup:static-content:deploy -f
$ php bin/magento cache:flush

Note: all of the above is done with an alias I created - hence it's one mega compile and deploy

Here are my execute() functions for each controller:

Insert.php

public function execute()
{
    $result = $this->resultJsonFactory->create();

    $customerId = (int) $this->getRequest()->getParam('customer');
    $makeId = (int) $this->getRequest()->getParam('make');
    $modelId = (int) $this->getRequest()->getParam('model');
    $yearId = (int) $this->getRequest()->getParam('year');

    $item = $this->_objectManager->create('Vendor\Module\Model\Garage');

    $item->setCustomerId($customerId);
    $item->setMakeId($makeId);
    $item->setModelId($modelId);
    $item->setYearId($yearId);

    if ($item->save()) {
        $response = array(
            'customer' => $customerId,
            'make' => $makeId,
            'model' => $modelId,
            'year' => $yearId
        );
    }

    $resultJson = $this->resultFactory->create(\Magento\Framework\Controller\ResultFactory::TYPE_JSON);
    $resultJson->setData($response);

    return $resultJson;
}

Delete.php

public function execute()
{
    $result = $this->resultJsonFactory->create();
    $customerId = (int) $this->getRequest()->getParam('id');

    $model = $this->garageFactory->create();
    $model->load($customerId);
    $model->delete();

    $resultJson = $this->resultFactory->create(\Magento\Framework\Controller\ResultFactory::TYPE_JSON);
    $resultJson->setData($customerId);

    return $resultJson;
}

After triggering the function I check my Database table:

SELECT * FROM `vendor_module_data`;

Which returns

+--------+---------+----------+---------+-------------+
| row_id | make_id | model_id | year_id | customer_id |
+--------+---------+----------+---------+-------------+
|      1 |      15 |      376 |    4559 |           3 |
+--------+---------+----------+---------+-------------+

on insert and

Empty set (0.00 sec)

on delete.

However hitting CTRL + F5 shows no change in the frontend. Insert (if nothing is already found) doesn't show the newly added bike on refresh. I run the commands, it's there. I delete the bike. Check the database, it's gone, refresh my browser and the bike is still there. Run the above commands and it disappears.

I'm currently in Magento 2 Default Mode with cache enabled. Ideally, we'd have cache enabled in production, so how do I either force cache flush on each action or make it display what's expected without having to run the commands?

Answer 1

As per the comment, I am adding my answer please try with cacheable="false in your custom block.