OWL Javascript Framework - Action and Service (Todo List App)
HTML-код
- Опубликовано: 1 авг 2024
- In this tutorial, you will learn how to use Odoo OWL Javascript Framework using Action and Service and implement Add, Edit, Delete, and Search Functionality.
In this tutorial, we will discuss the following:
00:00 - Project Overview
02:30 - Run Odoo 16
05:40 - Create an owl module
11:11 - Example module using OWL App
14:23 - Start OWL Implementation
19:52 - Build OWL template (UI)
24:40 - Create Add, Edit, Delete & Search using OWL
Github Repo: github.com/alferjay/odoo-owl-...
Talky Beat by Twin Musicom is licensed under a Creative Commons Attribution 4.0 license. creativecommons.org/licenses/...
Source: www.twinmusicom.org/song/265/t...
Artist: www.twinmusicom.org 
Наука
Woah! you really rock! This is what i've looking for!
Please do more examples about using odoo OWL framework!
You doing a very nice job!
No words can truly convey the appreciation for your exceptional efforts!
Thank you very much!
I've been waiting this for a long time. Thank you!
I hope you can make more videos regarding OWL and Odoo.
Cheers
You're welcome!! I will try my best...
Many thanks for this awesome tutorial 🙏
Thanks a lot man! you're a gem in the odoo world
Thank you for your great tutorials
Great work! Waiting for more content on Odoo Owl)
thanks for the tutorial! it will be great when you do more videos about owl in pos 👍
Dude, please make more videos, your stuff is great. Thanks a lot man.
More to come! Thank you...
What a perfect tutorial, thank you
You're very welcome!
Your videos are amazing brother, thanks for sharing your experience.
Greetings from Medellin, Colombia
Thanks and you’re welcome 😊.
Donated to you for this great OWL playlist)
Thank you very much! This means a lot. First donation I received :)
Brilliant video! Great pacing for odoo developers, keep it up.
Sure.. Thanks for watching my videos...
Really rocks!
Thank you so much!
You're welcome!
hanks for your time
Great video!!! Good job
Thank you!!
Thank you, for this video.
A learning so much about owl.
🤩🤩🤩🤩🤩🤩🤩🤩🤩🤩🤩🤩
Glad it helps 😊. You’re welcome!! Keep watching..
I really like your content.
I'm glad you like it
Good video!!! 👍
YOU ARE THE BEST 💕💘
super 👍
Thanks for your video. I have 3 years of odoo develpoment experience but I am still stuck at owl and your contents help me. Keep going man.
Please make content for customizing odoo chatter if it is possible.
Happy to help and will see that in my future tutorials
Thanks a lot for your quality video. I'e tried to donate you but I have a problem with Paypal. I've already contact them to solve this issue.
Keep on those great tutorials about Owl!
No worries! You can also try this www.buymeacoffee.com/ajscriptmedia. Thank you so much!
very helpful great job sir please keep making videoes on odoo js part
Sure.. I will try my best....
Thank you for this nice tutorial ,
How can close Modal after saveTask by code
best regards
Great work!. Please do a video on how to use existing field widgets (Many2one, One2many etc..) on this kind of custom views. It will be really helpful. Thanks in advance.
Thanks for the suggestion! I will add that on my list.
thank u so much for this videos, they are a gem, im finally understanding owl+odoo
i have some questions: are the client action the same as a view? for instance, i want to use the native tree view but when i click on a record i want to open my custom owl "view/clien action/widget" instead of the form view, is this possible? im confused about that part
We can say it like a view since client action will return a Component that will have a template and do our custom design or methods. If you want to use your own form view, you need to make sure that the action window will not have a form view, and to make sure, add attributes to the tree view like editable="bottom" to prevent opening the form view. Then in the tree view, you need to add a button that will call a client action. Check this link on how they use client action in JS: github.com/odoo/odoo/blob/16.0/addons/base_import/static/src/import_records/import_records.js
when we will have more videos on Owl?
I'm using VS code as my IDE, I'm wondering in 4:44 is that possible if I add more params like ( -U "owl" ) so whenever service is restarted the "owl" module also updated?
{
"version": "0.2.0",
"configurations": [
{
"name": "Odoo 16",
"type": "python",
"request": "launch",
"python":"...your python location../bin/python3",
"program": ".. yout odoo bin location ../community/odoo-bin",
"args": [
"--config=..location of the conf./odoo.conf",
"--update=owl"
],
"console": "integratedTerminal",
"justMyCode": true,
}
]
}
Try the above code .vscode/launch.json
How to render a OWL template from a http route. Which registry should I add that component then?
I believe this is not yet implemented in http route. This will only work for web client and point of sale but not on the website.
when will new video for owl js will come ?
Great Content .
but, why not directly search and filter the task array in the frontend only, this just beats the purpose of having frontend library.
Hi, you're right and absolutely fine for this simple kind of data. However, for actual business data, there will be a lot of users involved and we always want to get the updated data.
Greate Job Sir i learn so much from this but can you have any idea about why this code not work in V17 it will error like odoo.define not a function i am aware that this code is for version 16 but i am getting this error from log time if you will guide me this is help full.
Thank You
Yes, probably because of the version. I know this is an issue in Odoo JS since it always change per version.
If I have time, I will revisit the code and check the issue.
How can I learn more about js for odoo. I struggle in front end for odoo.
Please check this tutorials ruclips.net/p/PLdpXsMi-xePb-NvOKJujf3NgqCAum87eA&si=MKlbI0gudAvsCM0m.
It will explain the website front end of Odoo and on hoe you can use JS widget and OWL component.
Can you give CSS code for this class="todo-list-container"? Very nice job!!
Hi, actually didn't focus much on styling here? If you have scrolling issue for huge contents, you can easily use some bootstrap classes
Hope this helps!
Hi Sir,
I followed up these steps but I get this error:
UncaughtPromiseError > KeyNotFoundError
Uncaught Promise > Cannot find owl.action_todo_list_js in this registry!
Hello Mohammed, it seems you missed the client action. Kindly check this link github.com/alferjay/odoo-owl-tutorial. You can refer to it or just download to get all the files used in this tutorial.
Hi. I need some help in development of custom_module in odoo. Can you please help me
Hi Ateeq, unfortunately, I don't have tutorials for complete custom module development. But I will try to create it in the future. Kindly try this link for now www.odoo.com/documentation/16.0/developer/tutorials/getting_started/01_architecture.html#odoo-modules.
do you have any github repo for odoo owl tutorials
Hi Muhammad Awais. Check this link github.com/alferjay/odoo-owl-tutorial/tree/action_and_service
thanks
good Job bro! but i keep getting this error UncaughtPromiseError > KeyNotFoundError
Uncaught Promise > Cannot find owl.action_todo_list_js in this registry! although i have the same exact code as the repo
Hi, please make sure you add the client action under views github.com/alferjay/odoo-owl-tutorial/blob/master/custom-addons/owl/views/todo_list.xml#L38
Or try to change the glob patterns in the manifest file like below:
'owl/static/src/components/**/*.js',
'owl/static/src/components/**/*.xml',
'owl/static/src/components/**/*.scss',
The error seems the components/js has not been loaded successfully.
Nice tutorial! I keep having this error
UncaughtPromiseError > KeyNotFoundError
Uncaught Promise > Cannot find owl.action_todo_list_js in this registry!
Hello Cario. This is a series of tutorials that’s why you got all the codes from other tutorials. Kindly download the github repo included on the description. This code is related on todo list app, the first episode of this playlist.
Installing all the repo in a odoo v16 will make it work?@@ajscriptmedia
This looks like React in hard mode.
Yes,, it's very similar to React..
Cool bro