实践环境

Odoo 14.0-20221212 (Community Edition)

代码实现

模块文件组织结构

说明:为了更好的表达本文主题,一些和主题无关的文件、代码已略去

odoo14\custom\estate
│ __init__.py
│ __manifest__.py

├─models
│ estate_customer.py
│ estate_property_offer.py
│ __init__.py

├─static
│ │
│ └─src
│ └─xml
│ estate_customer_inline_tree_buttons.js

└─views
estate_customer_views.xml
webclient_templates.xml

测试模型定义

odoo14\custom\estate\models\estate_customer.py

#!/usr/bin/env python
# -*- coding: utf-8 -*- class EstateCustomer(models.Model):
_name = 'estate.customer'
_description = 'estate customer' name = fields.Char(required=True)
age = fields.Integer()
description = fields.Text()
property_ids = fields.One2many("estate.property", "customer_id", string="Property")

odoo14\custom\estate\models\estate_property.py

class EstateProperty(models.Model):
_name = 'estate.property'
_description = 'estate property'
name = fields.Char()
status = fields.Char()
customer_id = fields.Many2one('estate.customer')

测试模型视图定义

odoo14\custom\estate\views\estate_customer_views.xml

<?xml version="1.0"?>
<odoo>
<!--此处代码略-->
<record id="estate_customer_view_form" model="ir.ui.view">
<field name="name">estate.customer.form</field>
<field name="model">estate.customer</field>
<field name="arch" type="xml">
<form>
<sheet>
<group>
<field name="name" />
<field name="age"/>
<field name="property_ids" widget="my_field_one_2_many">
<tree>
<field name="name"/>
<field name="status"/>
</tree>
</field>
</group>
</sheet>
</form>
</field>
</record>
</odoo>

说明:<field name="property_ids" widget="my_field_one_2_many">,其中my_field_one_2_many为下文javascript中定义的组件,实现添加自定义按钮;

my_field_one_2_many 组件定义

js实现

为列表视图添加自定义按钮

odoo14\custom\estate\static\src\js\estate_customer_inline_tree_buttons.js

odoo.define('estate.customer.fieldOne2Many', function (require) {
"use strict";
var registry = require('web.field_registry');
var FieldOne2Many = require('web.relational_fields').FieldOne2Many;
var viewRegistry = require('web.view_registry'); var MyFieldOne2Many = FieldOne2Many.extend({
supportedFieldTypes: ['one2many'],
events: _.extend({}, FieldOne2Many.prototype.events, {
'click .o_button_upload_estate_customer': '_on_your_button_clicked'
}), // 重写渲染按钮函数,添加按钮
_renderButtons: function () {
this._super.apply(this, arguments);
this.$buttons = $('<button type="button" class="btn btn-primary o_button_upload_estate_customer">CustomButton</button>');
}, _on_your_button_clicked(){
console.log('button clicked');
},
}); registry.add('my_field_one_2_many', MyFieldOne2Many)
});

加载js脚本xml文件定义

odoo14\custom\estate\views\webclient_templates.xml

<?xml version="1.0" encoding="utf-8"?>
<odoo>
<template id="assets_common" inherit_id="web.assets_common" name="Backend Assets (used in backend interface)">
<xpath expr="//script[last()]" position="after">
<script type="text/javascript" src="/estate/static/src/js/estate_customer_inline_tree_buttons.js"></script>
</xpath>
</template>
</odoo>

最终效果

~~~~网站提示文字太少占位~~~~

~~~~网站提示文字太少占位~~~~

~~~~网站提示文字太少占位~~~~

~~~~网站提示文字太少占位~~~~

~~~~网站提示文字太少占位~~~~

odoo 给form表单视图内联列表添加按钮的更多相关文章

  1. form表单以及内嵌框架标签

    今关于今天所学习的东西又复杂又简单,上午学习了form表单,也是挺简单的:搭配table表格使用也是非常熟练. 下午讲了讲给网页内嵌框架标签以及在内嵌框架标签中添加其他的网页:还有在内嵌框架标签中添加 ...

  2. Bootstrap3 表单-输出内联表单

    为 <form> 元素添加 .form-inline 类可使其内容左对齐并且表现为 inline-block 级别的控件.只适用于视口(viewport)至少在 768px 宽度时(视口宽 ...

  3. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单:内联表单

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  4. 关于html 中form表单的内标签和使用

    表单标记 1.普通文本框: <input type=”text” name=”名称” value=”值”;不写value默认为空/> 2.密码框:<input type=”passw ...

  5. form表单 无法提交js动态添加的表单元素问题。。

    第一种情况, 这种情况js动态添加的表单元素是不能提交到服务器端的 <table> <form method="post" action=" url   ...

  6. Html form表单大全(一)

    在前后端交互的过程中,除了ajax请求之外,最常见的就是表单请求了. 由于form表单属性多,表单标签内容多且复杂,不深究的话很难全面的弄明白. 接下来就来详细的说一说整个form表单都有些什么,并且 ...

  7. js阻止form表单重复提交

    防止表单重复提交的方法总体来说有两种,一种是在js中阻止重复提交:另一种是在后台利用token令牌实现,大致思路是生成一个随机码放到session和form表单的隐藏输入框中,提交表单时两者对比,表单 ...

  8. MVC中Form表单的提交

    概述 Web页面进行Form表单提交是数据提交的一种,在MVC中Form表单提交到服务器.服务端接受Form表单的方式有多种,如果一个Form有2个submit按钮,那后台如何判断是哪个按钮提交的数据 ...

  9. Button按钮为什么无缘无故会提交form表单?

    我的form表单里有好几个Button按钮,每个按钮有不同的功能,可是这些按钮居然都有提交功能,真是把我惊呆了 <button class="btn btn-info " o ...

  10. element-ui Form表单验证

    element-ui Form表单验证规则全解 element的form表单非常好用,自带了验证规则,用起来很方便,官网给的案例对于一些普通场景完全没问题,不过一些复杂场景的验证还得自己多看文档摸索, ...

随机推荐

  1. ShardingJDBC使用不当引发的线上事故

    本文讲述一个由 ShardingJDBC 使用不当引起的悲惨故事. 一. 问题重现 有一天运营反馈我们部分订单状态和第三方订单状态无法同步. 根据现象找到了不能同步订单状态是因为 order 表的 t ...

  2. 使用IDEA导入MyBatis源码进行调试

    一. 下载源码 GitHub地址:https://github.com/mybatis/mybatis-3 复制上面的地址执行下列命令: git clone https://github.com/my ...

  3. FFmpeg Batch AV Converter 2.2.2 官方版

    基本简介 FFmpeg Batch AV Converter官方版是一款Windows FFmpeg用户的前端程序,FFmpeg Batch AV Converter最新版允许使用FFmpeg命令行的 ...

  4. 将.net core api 部署成windows服务

    将.net core api 部署成windows服务   参考 https://blog.csdn.net/qq_38762313/article/details/103311944 将NSSM解压 ...

  5. 不到200行用Vue实现类似Swiper.js的轮播组件

    前言 大家在开发过程中,或多或少都会用到轮播图之类的组件,PC和Mobile上使用 Swiper.js ,小程序上使用swiper组件等. 本文将详细讲解如何用Vue一步步实现的类似Swiper.js ...

  6. nginx基础安装使用和负载均衡高可用,日志切割配置

    1. Nginx简介 Nginx [engine x]是HTTP和反向代理服务器,邮件代理服务器和通用TCP / UDP代理服务器,最初由Igor Sysoev编写.很长一段时间以来,它已经在许多重负 ...

  7. mobile select 移动端下拉框

    官方链接 原生 js 移动端选择控件,不依赖任何库 可传入普通数组或者 json 数组 可根据传入的参数长度,自动渲染出对应的列数,支持单项到多项选择 自动识别是否级联 选择成功后,提供自定义回调函数 ...

  8. Qt信号与槽的使用

    参考视频:黑马程序员https://www.bilibili.com/video/BV1XW411x7NU?p=4 1  新建工程 先创建一个控件基础工程,创建后的界面如下: 主函数我们不需要修改,就 ...

  9. Java中Calendar类与SimpleDateFormat类的介绍

    目录 Calendar类(关于日期的一些方法) get(Calendar.XXX); get(Calendar.Year) get(Calendar.MONTH) get(Calendar.DAY_O ...

  10. 喜讯!极限科技再次中标中国移动云 Elasticsearch 自研版技术开发服务项目!

    喜讯!极限科技 再次中标 中国移动云 Elasticsearch 自研版技术开发服务项目! 近日,极限科技再次成功中标中国移动苏州研发中心 <云能力中心 2023-2024 年移动云 Elast ...