自定义页面的表格,如何点击表格操作列的按钮,跳转新页面时,将这条表格的信息一个字段信息,传参到新页面的关联表单(关联表单的主标题为这条数据的那个字段)。
路由跳转(实现跳转新页面):this.utils.router.push(path, {要携带的参数【对象格式key:value】}, true, true, 'replace');
宜搭的路由跳转携带参数都是拼接在url后面的,按照key直接取就好了this.utils.router.getQuery('key值')
取到值之后就按照关联表单的格式setValue就好了
不知道关联表单的格式可以getValue查看下
这些很常见的场景宜搭都封装好了API的,直接调用就可以了,没必要调用一大堆jsApi
自定义页面中表格属性中添加数据源可显示详情,方法有两个:一是直接将远程数据源添加到此表格的“数据源”(表格字段名须与返回字段同名);二是设定两个全局变量,一个是远程的用来获取数据,一个的普通的全局变量用来存储中转数据,最后将这个普通的全局变量绑定到表格“数据源”,表格中字段名和返回的字段名可相同也可不同。具体如下说明:
在数据源处添加的变量是全局变量,可以作为中间值完成后台和前端的数据传递。具体:通过添加“远程变量”,获得后台数据赋值给全局变量用“:”,键和值的格式,表格组件添加数据源来绑定这个全局变量,表格中字段名和远程获得数据的字段名相同时,系统可自动匹配到各字段;如果不同就需要手动一一对应分别赋值用“:”。注:即远程变量获得数据值,再赋值给全局变量(添加普通变量,作为中间值),表格绑定这个全局变量。
要实现这个功能,可以使用前端JavaScript技术实现。以下是可能的实现步骤:
// 表格操作列按钮点击事件监听器
table.addEventListener('click', function(event) {
// 获取当前行数据
var rowData = table.getRowData(event.target.parentElement.parentElement.rowIndex);
// 跳转函数
function jumpToNewPage(rowData) {
// 跳转到新页面,并将当前行数据作为参数传递
window.location.href = 'new-page.html?data=' + encodeURIComponent(JSON.stringify(rowData));
}
// 调用跳转函数
jumpToNewPage(rowData);
});
CopyCopy
在新页面的关联表单中,可以使用以下代码来根据传递过来的参数设置主标题:
// new-page.html
<!DOCTYPE html>
在这个示例中,data是一个对象,它包含了从旧页面传递过来的当前行数据。
您好!为了实现自定义页面表格中点击操作列按钮跳转新页面,并将选中数据的一个字段您好!为了实现自定义页面表格中点击操作列按钮跳转新页面,并将选中数据的一个字段信息作为参数传递给新页面的关联表单组件,您可以按照以下步骤进行操作:
首先,确保您已创建自定义页面和关联表单组件。如果还未创建,请进入已创建好的应用,点击页面左上角的"+"号,然后选择新建自定义页面。
在自定义页面的表格中,为操作列的按钮添加点击事件。当点击该按钮时,获取当前选中行的数据。
使用关联表单组件的dataFill
方法,将选中行的数据填充到关联表单中。具体地,您可以设置填充条件,例如将选中数据的某个字段填充到关联表单的主标题中。
在关联表单组件的配置中,设置其主标题为需要传递的字段信息。这样,当从自定义页面跳转并填充数据时,关联表单的主标题会自动更新为选中数据的那个字段。
最后,为关联表单设置提交按钮,并在其点击事件中处理表单提交逻辑。
要实现这个功能,你可以采用以下步骤:
$(this).closest('tr').find('td').text()
来获取当前行的所有文本内容。href
属性来实现,例如:<a href="newpage.html?field1=value1&field2=value2">Link</a>
。window.location.search
来获取URL的查询字符串,并且通过split
、forEach
等函数来解析出参数和其对应的值。以下是代码示例:
// 在旧页面上
var rowData = $(this).closest('tr').find('td').text();
var url = 'newpage.html';
for (var i = 0; i < rowData.length; i++) {
var pair = rowData[i].split('=');
url += '&' + pair[0] + '=' + pair[1];
}
$(this).attr('href', url);
// 在新页面上
var queryStr = window.location.search.substring(1);
queryStr.split('&').forEach(function(pair) {
var keyValue = pair.split('=');
if (keyValue[0] == 'yourField') { // 将 yourField 替换为你要展示的字段名
$('#yourTitle').html(keyValue[1]); // 将 yourTitle 替换为你关联表单的主标题元素ID
}
});
注意:这里的示例代码只是一个基础的实现思路,你可能需要根据实际的需求和现有的代码结构进行适当的修改和扩展。
版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。