Skip to Content
This question has been flagged
1 Reply
5292 Views
Avatar
Thanh Loyal

Hello,

I want to create a custom front-end page, and I want to reuse the website.layout template, which provides header and footer of the website page. 

Inside the body section, I want to have a button. When that button is clicked, I want to call some javascript and make some communication with the back-end server.

What I have done is to follow the Theme tutorial (https://www.odoo.com/documentation/9.0/howtos/themes.html), but that tutorial is kind of creating a static page, I mean it lacks of how to communicate with backend and how to include javascript correctly.

I also try this code:

<button id="create_new_db" class="mt16">Create</button>

And js: I place these lines globally in a js file, I don't know where else to place it.

var button = document.getElementById("create_new_db");
console.log("Button: ", button);

This console.log shows "null"

I think that i took a wrong step, so my js get called before the page is rendered.

I have tried to find document on Odoo document for developer but still lost. The "Building interface extension" is still for v8.

Could you please give me some hint ?

Thank you!


Avatar
Discard
Avatar
Thanh Loyal
Author Best Answer

I resolve this by putting my code after require('website.website')


odoo.define('tut_theme.main', function (require) {    
'use strict';    
var utils = require('web.utils');    
var Model = require('web.Model');    
var core = require('web.core');    
var website = require('website.website'); // The important line
 
var button = document.getElementById("create_new_db");    
console.log("Button: ", button);    // It works this time
$("#create_new_db").click(function () {
    console.log("Clicked");    
});    
});
Avatar
Discard