前言

若依(ruoyi)： v4.3
mysql：5.7.31

自定义的数据选择对话框的开发说明

在“若依(ruoyi)”中，数据选择对话框可以分为2类：

树表数据的选择对话框，比如选择部门。
非树表数据的选择对话框，比如选择商品、订单等。

树表的代码生产模板所生产的代码，已预置一个选择框，参考选择部门对话框的调用方法调用即可。参考这里：【若依(ruoyi)】数据选择对话框。

非树表的数据选择对话框需要安装这里说的“自定义的数据选择对话框”的开发方式开放。

自定义的数据选择对话框开发

新增一个查询功能。自定义的数据选择对话框打开该查询功能。该查询功能参考若依(ruoyi)与之相近的功能实现。假设功能为A，通常情况下会得到：/xxx/A(A功能的url地址)、A.html（A功能的html页面）、…。
在A.html中修改table的参数，使其可以点击选中、记住选中、…。

   $(function() {var options = {url: prefix + "/selectA",showSearch: false,showRefresh: false,showToggle: false,showColumns: false,clickToSelect: true, // 当点击某行时，是否选中该行rememberSelected: true, // 默认false。设为false不启用翻页记住前面的选择，设为true启用singleSelect: false, // 默认false。是否单选checkboxmodalName: "A",columns: [{checkbox: true},{field : ...},...]};$.table.init(options);});

在B功能中调用选择A的对话框。在B功能的B.html（B功能的html页面）中添加弹出选择对话框代码（对话框中的页面是A功能的html页面）。

   function selectA() {var url = ctx + "A/selectA";var title = "选择A";$.modal.open(title, url, null, null, selectACallback);}

在B功能的B.html（B功能的html页面）中添加弹出选择对话框的确定按钮的回调方法。

   function selectACallback(index, layero) {var opJquery = layero.find("iframe")[0].contentWindow.$;var selectedIds = opJquery.table.selectFirstColumns(); //此时，第1列应该是ID，隐藏的ID也行。if (selectedIds.length == 0) {$.modal.alertWarning("请至少选择一条记录");return;}var selectedNames = opJquery.table.selectColumns("name"); //name列$("selectedIds").val(selectedIds.join());$("selectedNames").val(selectedNames.join());layer.close(index);}

或者：

   function selectACallback(index, layero) {var opJquery = layero.find("iframe")[0].contentWindow.$;var selectedRows = opJquery.table.selectRows();//所有已选择的行if ($.common.isEmpty(selectedRows)) {$.modal.alertWarning("请至少选择一条记录");return;}selectedRows.forEach(function(data,index){$("selectedIds").val($("selectedIds").val()+index>0?",":""+data.id);$("selectedNames").val($("selectedNames").val()+index>0?",":""+data.id);});layer.close(index);}

selectRows：需要自行添加。

关于单选

上面介绍的是多选，当单选时，有以下几点不一样的地方：

A.html的不同

   $(function() {var options = {url: prefix + "/selectA",showSearch: false,showRefresh: false,showToggle: false,showColumns: false,clickToSelect: true, // 当点击某行时，是否选中该行rememberSelected: false, // 默认false。设为false不启用翻页记住前面的选择，设为true启用singleSelect: true, // 默认false。是否单选checkboxmodalName: "A",columns: [{radio: true},{field : ...},...]};$.table.init(options);});

selectRows

找到ruoyi.js，在table下面添加selectRows函数：

            // 查询表格已选择的行selectRows: function() {var rows = $("#" + table.options.id).bootstrapTable('getSelections');if ($.common.isNotEmpty(table.options.rememberSelected) && table.options.rememberSelected) {var selectedRows = table.rememberSelecteds[table.options.id];if($.common.isNotEmpty(selectedRows)) {return selectedRows;}}return rows;},

【若依(ruoyi)】自定义的数据选择对话框相关推荐

maximo 自定义高级数据选择对话框（非表域实现）
1.定义弹出式窗口页面控制类继承自 psdi.webclient.system.beans.DataBean类在其,实现两个方法 package cust.app.beans; impor ...
【若依(ruoyi)】数据选择对话框
前言若依(ruoyi): v4.3 mysql:5.5.40 假设的需求使用部门选择框,选择部门. 其它使用选择框的操作.比如:选择入库单.出库单.用户.- 分析在"RuoYi&quo ...
ASP.NET 2.0数据教程之二十六::排序自定义分页数据
导言和默认翻页方式相比,自定义分页能提高几个数量级的效率.当我们的需要对大量数据分页的时候就需要考虑自定义分页,然而实现自定义分页相比默认分页需要做更多工作.对于排序自定义分页数据也是这样,在本教程 ...
文件夹选择对话框 JS实现(转)
/** * browseFolder.js * 该文件定义了BrowseFolder()函数,它将提供一个文件夹选择对话框 * 以供用户实现对系统文件夹选择的功能 * 文件夹选择对话框起始目录由 * ...
选择对话框 android_Android日期时间选择器对话框
选择对话框 android Android Date Time picker are used a lot in android apps. In this tutorial we'll demons ...
【转载】CodeWarrior IDE使用tips之prm链接文件详解(自定义存储器分区以及自定义RAM数据初始化与在RAM中运行函数）...
CodeWarrior IDE使用tips之prm链接文件详解(自定义存储器分区以及自定义RAM数据初始化与在RAM中运行函数) 2017-08-19 胡恩伟汽车电子expert成长之路内容提要 ...
python 数据分析入门教程(三)_Python数据分析入门教程(三)：数据选择——AIU人工智能学院-经管之家官网！...
https://p1.pstatp.com/large/pgc-image/a6743a84f13a4f07a7ec3e9405467c6a 在上面的代码中,iloc后的方括号中逗号之前的部分表示要获 ...
文件夹选择对话框 JS实现的两种方案
文件夹选择对话框 JS实现的两种方案 /** * browseFolder.js * 该文件定义了BrowseFolder()函数,它将提供一个文件夹选择对话框 * 以供用户实现对系统文件夹选择 ...
Android 高德地图自定义线路规划选择方案之后按照方案进行导航
Android 高德地图自定义线路规划选择方案之后按照方案进行导航因为我这边导航需求的问题,导致我这边不能使用高德地图官方的线路规划和导航.所以我这边线路规划和导航界面都是根据高德地图那边给的api ...

【若依(ruoyi)】自定义的数据选择对话框

前言

自定义的数据选择对话框的开发说明

自定义的数据选择对话框开发

关于单选

selectRows

【若依(ruoyi)】自定义的数据选择对话框相关推荐

最新文章

热门文章