Dear All,

I am getting an error when load a function. The intial page is loading without issue, after clicking the card-body, i am getting result in console.log(FloorId); 

My problem is when i pass the

this.state.tokenFloorId = FloorId; inside async selectFloor(data),
i am getting "Error fetching floor list: TypeError: this is undefined".

here is my function:

/** @odoo-module */

import { registry } from '@web/core/registry';
import { Component, useState, onMounted,onWillStart } from "@odoo/owl";
import rpc from 'web.rpc';

export class CallingToken extends Component {
    setup() {
        super.setup();
        this.state = useState({
            tokenTypeId: null,
            tokenFloorId: null,
            departmentId: null,
        });
        onMounted(this.fetchInitialData.bind(this));
        //onWillStart(this.onWillStart);
    }

    async fetchInitialData() {
        try {
            const initialTokenTypeId = await rpc.query({
                model: "token.issue.station.wizard",
                method: 'fetch_token_type',
                args: [1],
            });
            this.state.tokenTypeId = initialTokenTypeId;
        } catch (error) {
            console.error("Error fetching initial tokenTypeId:", error);
        }
    }

    async selectFloor(data) {
        try {
            const FloorId = await rpc.query({
                model: "token.issue.station.wizard",
                method: 'fetch_floor_type',
                args: [1, data],
            });
            console.log(FloorId);
            this.state.tokenFloorId = FloorId;
        } catch (error) {
            console.error("Error fetching floor list:", error);
        }
    }
}

CallingToken.template = 'queue_management.CallingToken';
registry.category('actions').add('queue_management.action_call_token_js', CallingToken);

My template is :

t-name="queue_management.CallingToken" owl="1">
class="container-fluid bg-gradient">
    
class="row">
        
Token Issuing Page
    


    
class="row justify-content-center" name="token_table">
        t-if="state.tokenTypeId">
            
Stations here
            
class="col-lg-6 col-md-8 col-sm-10 col-12 text-center">
                t-foreach="state.tokenTypeId" t-as="data" t-key="data.rec_id">
                    
class="tile mb-3">
                        
class="card" t-on-click="() => selectFloor(data.rec_id)">
                            
class="card-body" t-att-code="data.rec_id">
                                
class="card-title">t-esc="data.token_type_name"/>

                                
class="card-text">
                                    t-esc="data.token_type_name"/>
                                

                            

                        

                    

                
            


        
    



            
t-if="state.tokenFloorId">
                
Select Floor
                
class="col-lg-6 col-md-8 col-sm-10 col-12 text-center">
                t-foreach="state.tokenFloorId" t-as="floor" t-key="floor.rec_id">
                    
class="card">
                        
class="card-body">
                            
class="card-title">t-esc="floor.floor_name"/>

                            
class="card-text">
                                t-esc="floor.floor_name"/>