odoo 通过Javascript显示或隐藏form自带按钮
实践环境
Odoo 14.0-20221212 (Community Edition)
需求描述
如下,根据条件对form视图自带按钮的显示、隐藏进行控制

代码实现
隐藏、显示编辑和创建按钮为例
odoo14/custom/estate/static/src/js/hide_or_show_form_button.js
function isHideEditButton(arg){ // 自定义函数,用途参见下文
if (arg === 'Sold') {
return true
}
return false
}
odoo.define('estate.hide_or_show_form_button', function (require) {
'use strict';
let modelConfigs = {
'estate.property': { // form表单视图归属模型,即需要对按钮的显示做管控的模型名称
/* hideEditButton hideCreateButton的值可以简单理解为eval函数的参数,形如 eval(arg),整个表达式计算结果为bool值
值为真则表示需要隐藏按钮,否则显示按钮
如果不配置hideEditButton键,则表示显示编辑按钮,类似的,如果不配置hideCreateButton键,则显示创建按钮
*/
'hideEditButton': 'isHideEditButton(this.renderer.state.data.state)', // 可选,是否隐藏编“Edit”编辑按钮 字符串类型
'hideCreateButton': "this.renderer.state.data.state === 'Sold'", // 可选,是否隐藏“Create”创建按钮 字符串类型
}
};
let FormController = require('web.FormController');
FormController.include({
updateButtons: function(){
let res = this._super.apply(this, arguments);
if (modelConfigs.hasOwnProperty(this.modelName)) {
// 控制显示或者隐藏编辑按钮
if (eval(modelConfigs[this.modelName].hideEditButton)) {
this.$buttons.find('.o_form_button_edit').hide();
} else {
this.$buttons.find('.o_form_button_edit').show();
}
// 控制显示或者隐藏创建按钮
if (eval(modelConfigs[this.modelName].hideCreateButton)) {
this.$buttons.find('.o_form_button_create').hide();
} else {
this.$buttons.find('.o_form_button_create').show();
}
}
return res;
}
});
})
说明:
- 如果需要隐藏其它自带按钮、或自定义按钮,可以通过查看form视图的html结构,依葫芦画瓢。
- 根据实际需求,可以通过在js中打印
this对象,以获取更多判断是否隐藏、显示按钮的有用信息。
加载自定义js
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/hide_or_show_form_button.js">
</xpath>
</template>
</odoo>
odoo 通过Javascript显示或隐藏form自带按钮的更多相关文章
- JavaScript网站设计实践(四)编写about.html页面,利用JavaScript和DOM,选择性的显示和隐藏DIV元素
一.现在我们在网站设计(三)的基础上,来编写about.html页面. 这个页面要用到的知识点是利用JavaScript和DOM实现选择性地显示和隐藏某些DIV about.html页面在前面我们为了 ...
- JavaScript控制页码的显示与隐藏
前端页面开发分页显示功能时,一般都要求使用自定义的页码样式,直接用网上分页插件就比较麻烦了,这里记录一下工作中总结的一个比较简单通用的控制页码显示与隐藏的的js代码. 首先是使用时需要自己根据自己具体 ...
- 使用JavaScript控制HTML元素的显示和隐藏
利用来JS控制页面控件显示和隐藏有两种方法,两种方法分别利用HTML的style中的两个属性,两种方法的不同之处在于控件隐藏后是否还在页面上占空位. 方法一: document.getElementB ...
- Js控制显示、隐藏文本框中的密码
Js控制显示.隐藏文本框中的密码,也可称为是一款小型的JavaScript星号密码破解器,点击会显示出密码类型的文本框中的真实信息,再次点击则还原,程序 主要是获取HTML元素对象,然后强制更改元素属 ...
- 显示和隐藏(display属性)none或block
显示和隐藏(display属性) 网页中经常会看到显示和隐藏的效果,可通过display属性来设置. 语法: Object.style.display = value 注意:Object是获取的元素对 ...
- js控制密码的显示与隐藏实例
原理是建立2个input,一个type是text,一个type是password.在点击按钮时,这两input个的显示状态与val()的值在切换. html: <!DOCTYPE html> ...
- js简单显示和隐藏div,触发超链接,动态更改button值,setInterval()简单使用,jquery easyui弹出框简单使用 .
js简单显示和隐藏div .<!DOCTYPE html> .<html> .<head> .<meta charset="UTF-8"& ...
- div的显示和隐藏
本文从学习角度出发,仅当做笔记.高手可以忽略本文. 借助div的display属性可以实现div的显示或隐藏,而且在隐藏后不占用原来显示的空间. js控制显示和隐藏的代码: <script ty ...
- [CSS]元素的显示与隐藏
摘自:http://www.zhangxinxu.com/wordpress/?p=1528 元素隐藏与显示是我们在页面制作与交互效果实现中非常常见的,如果您只是使用display:none与disp ...
- 控制HTML元素的显示与隐藏——display和visibility
有些时候我们需要根据某些条件来控制Web页面中的HTML元素显示还是隐藏,可以通过display或visibility来实现.通过下面的例子了解display和visibility的区别,简单的例子代 ...
随机推荐
- objectarx 之让用户自定义插件命令
#include <iostream> #include <fstream> virtual AcRx::AppRetCode On_kInitAppMsg (void *pk ...
- 鸿蒙HarmonyOS实战-Stage模型(进程模型)
前言 进程是计算机中运行的程序的实例.它是操作系统对正在执行的程序的一种抽象概念.每个进程都有自己的独立内存空间.运行状态和执行上下文.进程可以包含一个或多个线程,每个线程可以独立执行一部分任务.操作 ...
- Vue 组件生命周期:探索钩子
title: Vue 组件生命周期:探索钩子 date: 2024/5/27 18:42:38 updated: 2024/5/27 18:42:38 categories: 前端开发 tags: 生 ...
- WPF基础之样式设置和模板化(三)
IsItemsHost 属性在此示例中,一个必需的重要属性是 IsItemsHost 属性.IsItemsHost 属性用于指示在 ItemsControl(如处理项列表的 ListBox 控件)的模 ...
- NOIP模拟63
T1 电压机制 解题思路 先找出这个图的一个生成树,然后没有称为树边的边就都是返祖边了. 对于一个边是合法的当且仅当它属于所有的奇数环并且不属于任何一个偶数环. 可以利用树上差分进行修改,更改一个返祖 ...
- 初识c语言—c语言的初步认识和一个简单的程序
C语言是什么 编程语言(编程语言是控制计算机的一系列指令,他又固定的格式和词汇.同时也叫计算机语言(计算机语言是,人和计算机通讯的语言)) C语言的特点 语言简洁,紧凑,使用方便 运算符丰富 数据类型 ...
- 算法金 | LSTM 原作者带队,一个强大的算法模型杀回来了
大侠幸会,在下全网同名「算法金」 0 基础转 AI 上岸,多个算法赛 Top 「日更万日,让更多人享受智能乐趣」 时间拉回 2019 年,有「计算机界诺贝尔奖」之称图灵奖获得者公布,深度学习三巨头:Y ...
- 一文搞懂 ARM 64 系列: 一文搞懂 ARM 64 系列: 函数调用传参与返回值
函数调用涉及到传参与返回值,下面就来看下ARM 64中,参数与返回值的传递机制. 1 整数型参数传递 这里的整数型并不单指int类型,或者NSInteger类型,而是指任何能够使用整数表示的数据类型, ...
- Vue学习:16.组件通信
组件通信就是指组件之间的数据传递.由于组件的数据是独立的,无法直接访问其他组件的数据,所以想要使用其他组件数据必须通过 组件通信! 在Vue.js中,组件之间的通信可以通过多种方式实现,包括 prop ...
- TiKV 源码分析之 PointGet
作者:来自 vivo 互联网存储研发团队-Guo Xiang 本文介绍了TiDB中最基本的PointGet算子在存储层TiKV中的执行流程. 一.背景介绍 TiDB是一款具有HTAP能力(同时支持在线 ...