Development Book V18: Dynamic Routes

In Odoo, controllers serve as a bridge between frontend and backend modules. They allow you to display backend data on the website, such as sales order details, which cannot be accessed directly using the model in the frontend. Instead, controllers help fetch this data from the backend and make it available on the website. Modules like Website Sales, Website Blog, and Website Forum further extend the capabilities of controllers. Controllers also enable you to map custom URLs to specific web pages, which is especially useful when creating dynamic pages.

For instance, in an online store, each product typically has its own detailed page that is linked to a unique URL. This is commonly seen in modules like "shop," where individual product pages are created and accessible through specific web addresses

How can a dynamic route be made?

1. Create a controller

                        from odoo import http

@http.route('/store/', type='http', auth="user", website=True)
def product_detail(self, product):
    value = {
          'product': product,
    }
    return request.render('store.product_details_page, value)

2. Create a template for the detail page

<template id="product_details_page" name="Product Detail">
    <t t-call="website.layout">
        <div class="container">
            <div class="oe_structure"/>
            <div class="row">
                <div class="col-12">
                    <div class="col-6">
                        <span t-field="product.image"
                              t-options="{'widget': 'image'}"/>
                    </div> 
                    <div class="col-6">
                        <div class="prod_details">
                            <h1 t-field="product.name"/>
                            <span class="prod_price"
                                  t-field="product.lst_price"
                                  t-options="{'widget': 'price'}"/>
                            <ul class="prod_desc_list">
                                <li><t t-esc="product.brand"/></li>
                                <li><t t-esc="product.category"/></li>
                                <li><t t-esc="product.origin"/></li>
                                <li><t t-esc="product.code"/></li> 
                            </ul>
                            <span t-field="product.description"/>
                            <div class="prod_buttons">
                                <button class="btn btn-primary"
                                        t-options="{'widget': 'button'}"/>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </t>
</template>

3. To redirect to the details page, add a button or link to the current view.

<a t-attf-href="/store/#{product.id}" class="btn btn-primary">
    Goto Product <i class="fa fa-eye"/>
</a>