Can't get to add JS to front via $this->load->view

Question

I'm developing a module for OpenCart 3.x and I'm trying to insert some JavaScript code into website's front via $this->load->view() method but cannot get it to work, as the JS code doesn't appear in the DOM.

Here's an excerpt of my code:

/catalog/controller/extension/module/mymodule.php

class ControllerExtensionModuleMyModule extends Controller {

    public function index() {

        $this->load->language('extension/module/mymodule');

        $this->load->model('checkout/order');
        $this->load->model('setting/setting');
        $this->load->model('design/layout');
        $this->load->model('catalog/category');
        $this->load->model('catalog/manufacturer');
        $this->load->model('catalog/product');
        $this->load->model('catalog/information');

        $data['js_output'] = "Some JS output"; 

        return $this->load->view('extension/module/mymodule', $data);
    }
}

catalog/view/theme/default/template/extension/module/mymodule.twig

<script type="text/javascript">
console.log('This is working!");
</script>

Am I missing something?

DigitCart · Answer 1 · 2017-11-22T08:42:54.167

0

Add an external javascript file via controller like this:

$this->document->addScript('catalog/view/javascript/my-external-script.js');

But if it's a block of javascript code, you don't need to edit controller file, just add it to your view file (twig or tpl):

<script type="text/javascript">
    console.log("This is working!");
</script>

Finally you may need to clear caches (vqmod, ocmod, twig etc ...).

EDIT

If you want to prepare your javascript code in the controller, follow this:

controller

$data['js_output'] = 
'<script type="text/javascript">
    console.log("This is working!");
</script>';

Twig

{{ js_output }}

edited Nov 22 '17 at 08:42

answered Nov 22 '17 at 08:31

DigitCart

2,980
2
18
28

That is exactly what I've wrote in the post. I've added the JS to .twig file and it is not working. – Carol-Theodor Pelu Nov 22 '17 at 08:35
I can't see `addScript` in your code. also did you clear caches? – DigitCart Nov 22 '17 at 08:36
Yes, I have cleared all the cache. Also, the `addScript` method won't work in my case so that is not an option for me. – Carol-Theodor Pelu Nov 22 '17 at 08:39
I have tested your edited answer but sadly it is not working :(. – Carol-Theodor Pelu Nov 22 '17 at 08:52

score 0 · Answer 2 · answered Nov 22 '17 at 10:15

I have finally fixed the issue. It was a problem with the install() method not correctly inserting and loading the design/layout ($this->model_design_layout->getLayouts()).

If your module needs to insert a layout into the layout_module table, make sure you have the correct layout_id, code(which must be your module name), position (i.e: 'content_bottom') and sort_order(which often times is > 90).

Can't get to add JS to front via $this->load->view

2 Answers2