前端：使用与基于 id 的不同表相关的表中的数据
Posted
技术标签:
【中文标题】前端：使用与基于 id 的不同表相关的表中的数据【英文标题】：frontend: using data from table related to a different table based on id 【发布时间】：2021-09-11 03:12:55 【问题描述】：更新：添加了解决方案。比我想象的要简单。
我有一个使用 API 端点 (/listpotato) 动态创建的表。 此表的 id 为：#potato_list 并返回：
name: 'id', has_sort: true,
name: 'type_id', label: 'potato type id' value: (o)=> ... something goes here... ,
name: 'title', label: 'potato name', has_sort: true, action: (o)=>
@enterPage 'potato', o.id
,
我有一个带有端点 (/listpotatotype) 的表，#potatotype_list 并返回：
name: 'id', has_sort: true,
name: 'label', label: 'potato type label' ,
name: 'has_magicPower', label: 'has magic power', is_boolean: true,
我想从#potatotype_list 中显示标签的值（它是一个字符串，并为土豆的类型提供一个文本名称），而不是在#potato_list 中显示type_id 的id 值。我该怎么做？
我知道直接在后端做更直接，但我想，对于这个特定的任务，通过前端做，我显然是个白痴，因为我无法想出一个一整天的有用解决方案。我正在使用coffeeScript（原因太长无法解释）和jQuery，我对这两者的了解真的很短。
我尝试将它映射到 value: type_id 对象的函数内的匿名函数中，但我没有设法从其中的 /potatotype_list 获取数据，所以我一直未定义。
我尝试在返回 /listpotato 后调用 potatotypelist API，但 jquery 给我的是 null / undefined。
.then () =>
return @api.listpotatotype()
.then (potato_types)=>
$u = $('#ui_potatoes #potato_list')
console.log($u)
$el = $u.find("input[name='type_id']").val()
console.log($el)
<head>
<script type="text/javascript" src="lib/jquery-3.6.0.min.js"></script>
<script type="text/javascript" src="lib/sprintf.min.js"></script>
</head>
<body>
<div id='ui_potatos' class='ui_page'>
<h1>Potatos</h1>
<table id='potato_list' class='ui_block'></table>
</div>
</body>
Any pointer in the right direction will be greatly appreciated.
【问题讨论】：
你能显示你的 html 吗？另外，请同时显示异常输出。 嗨@Swati，预期的输出是：（#potatotype_list）中的'label'值，它是一个对象数组，替换#potato_list中的'type_id'值。 你的桌子有input[name='type_id']还是没有？我在你的桌子上没有看到。
可以，但它是通过不同的函数动态创建的。无论如何，我找到了解决方案，将更新我的帖子。感谢您的兴趣。 :)
【参考方案1】：
如果这对其他人有帮助：
#small loop changes type_id in #drop_list to type label
potatos_types = await @api.listpotatotype()
li =
for item in potatos_types then li[item.id]=item.label
然后将其添加到#potato_list：
name: 'id', has_sort: true,
name: 'type_id', label: 'potato type id' value: (o)=> return li[o.type_id] ,
name: 'title', label: 'potato name', has_sort: true, action: (o)=>
@enterPage 'potato', o.id ,
【讨论】：
以上是关于前端：使用与基于 id 的不同表相关的表中的数据的主要内容，如果未能解决你的问题，请参考以下文章