html+='<td><a href="" id="change" class="btn btn-primary">修改</a><a href="" id="del" class="btn btn-danger">删除</a></td></tr>' $('#table').append(html);
时间: 2023-10-11 13:05:48 浏览: 164
这段代码主要是将一个包含修改和删除按钮的表格行(tr)添加到ID为"table"的表格中。其中,“<td>”表示表格中的单元格,“<a>”表示超链接标签,class为"btn btn-primary"和"btn btn-danger"表示按钮样式。您可以通过修改href属性值来设置按钮的链接地址。在这段代码中,链接地址为空,需要根据您的需求进行修改。
相关问题
{% extends "admin/base.html" %} {% block content %} <div class="container-fluid"> <div class="row"> <div class="col-md-6"> <h2>药品列表</h2> <table class="table"> <thead> <tr> <th>ID</th> <th>药品名称</th> <th>操作</th> </tr> </thead> <tbody> {% for drug in drugs %} <tr> <td>{{ drug.id }}</td> <td>{{ drug.drug_name }}</td> <td> <a href="{% url 'admin:drug_db_drug_list_change' drug.id %}" class="btn btn-primary btn-sm">编辑</a> <form action="{% url 'admin:drug_db_drug_list_delete' drug.id %}" method="post" class="d-inline"> {% csrf_token %} <button class="btn btn-danger btn-sm">删除</button> </form> </td> </tr> {% empty %} <tr> <td colspan="3">暂无药品</td> </tr> {% endfor %} </tbody> </table> <a href="{% url 'admin:drug_db_drug_list_add' %}" class="btn btn-success">添加新药品</a> </div> <div class="col-md-6"> <h2>药品相互作用</h2> <table class="table"> <thead> <tr> <th>ID</th> <th>药品1</th> <th>药品2</th> <th>相互作用</th> <th>操作</th> </tr> </thead> <tbody> {% for interaction in interactions %} <tr> <td>{{ interaction.id }}</td> <td>{{ interaction.drug1 }}</td> <td>{{ interaction.drug2 }}</td> <td>{{ interaction.interaction }}</td> <td> <a href="{% url 'admin:drug_db_drug_interaction_change' interaction.id %}" class="btn btn-primary btn-sm">编辑</a> <form action="{% url 'admin:drug_db_drug_interaction_delete' interaction.id %}" method="post" class="d-inline"> {% csrf_token %} <button class="btn btn-danger btn-sm">删除</button> </form> </td> </tr> {% empty %} <tr> <td colspan="5">暂无药品相互作用</td> </tr> {% endfor %} </tbody> </table> <a href="{% url 'admin:drug_db_drug_interaction_add' %}" class="btn btn-success">添加新药品相互作用</a> </div> </div> </div> {% endblock %} 需要定义那些视图和建那些文件
这段代码是一个 Django 的模板,用于渲染一个药品管理后台页面。在这个模板中,需要定义以下视图:
- `admin:drug_db_drug_list_change`:用于修改药品信息的视图。
- `admin:drug_db_drug_list_delete`:用于删除药品的视图。
- `admin:drug_db_drug_interaction_change`:用于修改药品相互作用信息的视图。
- `admin:drug_db_drug_interaction_delete`:用于删除药品相互作用的视图。
- `admin:drug_db_drug_list_add`:用于添加新药品的视图。
- `admin:drug_db_drug_interaction_add`:用于添加新药品相互作用的视图。
此外,需要建立以下文件:
- `models.py`:定义药品和药品相互作用模型。
- `views.py`:实现药品管理后台的视图处理逻辑。
<tbody> <tr v-for="n,index in relatedRiskData"> <td>{{n.riskSourceNumber}}</td> <td>{{n.status}}</td> <td> <div data-bs-toggle="popover" data-bs-trigger="hover" data-bs-placement="top" :data-bs-content="n.isAssociation=='1'?'请在详情页操作':null"> <div class="form-check form-switch"> <input type="checkbox" :aria-checked="n.isAssociation=='1'" :disabled="n.isAssociation=='1'" :id="'status'+index" v-model="n.isAssociation" @change="disableSwitch(n.riskSourceNumber)" class="form-check-input form-check-input-lg pointer mt-0"> </div> </div> </td> </tr> </tbody> <button @click="onSave" type="button" class="btn btn-sm btn-primary">确认</button> </table> 现有一个表格,表格中有开关操作,当开关是开启状态时,点击确认按钮把选了开启状态的参数riskSourceNumber集合传过去请求后端,请根据以上代码调整优化
可以按照以下步骤进行优化:
1. 使用一个新的数组来存储选中的风险源编号,当开关是开启状态时,把该风险源编号添加到新数组中。
2. 在确认按钮的点击事件中,把新数组作为参数传递给后端。
下面是修改后的代码:
```
<tbody>
<tr v-for="(n, index) in relatedRiskData">
<td>{{ n.riskSourceNumber }}</td>
<<td>{{ n.status }}</td>
<td>
<div v-if="n.isAssociation === '1'" data-bs-toggle="popover" data-bs-trigger="hover" data-bs-placement="top" :data-bs-content="'请在详情页操作'">
<div class="form-check form-switch">
<input type="checkbox" :aria-checked="true" :disabled="true" :id="'status'+index" v-model="n.isAssociation" class="form-check-input form-check-input-lg pointer mt-0">
</div>
</div>
<div v-else>
<div class="form-check form-switch">
<input type="checkbox" :aria-checked="false" :id="'status'+index" v-model="n.checked" class="form-check-input form-check-input-lg pointer mt-0">
</div>
</div>
</td>
</tr>
</tbody>
<button @click="onSave" type="button" class="btn btn-sm btn-primary">确认</button>
<script>
export default {
data() {
return {
relatedRiskData: [], // 相关风险数据
selectedRiskNumbers: [], // 选中的风险源编号
}
},
methods: {
// 禁用开关
disableSwitch(riskSourceNumber) {
const index = this.relatedRiskData.findIndex(item => item.riskSourceNumber === riskSourceNumber)
this.relatedRiskData[index].isAssociation = '1'
},
// 点击确认按钮
onSave() {
this.selectedRiskNumbers = this.relatedRiskData.filter(item => item.checked).map(item => item.riskSourceNumber)
// 调用后端接口,传递选中的风险源编号
},
},
}
</script>
```
注意,需要添加一个新的属性 `checked` 来表示当前行是否选中,同时修改禁用开关的逻辑。另外,在表格中需要根据 `n.isAssociation` 的值来显示相应的控件。
阅读全文
相关推荐
修改这段代码 首页 上一页 下一页 最后一页
跳转到: <input id="pageNo" type="text" class="form-control form1" name="pageNo" value="${list.pageNo}" /> 每页记录数: <input class="form-control form1" type="text" name="pageCount" value="${list.pageCount}" /> <input class="btn btn-primary" type="submit" value="跳转" /> 共有 ${list.totalPage} 页
跳转到: <input id="pageNo" type="text" class="form-control form1" name="pageNo" value="${list.pageNo}" /> 每页记录数: <input class="form-control form1" type="text" name="pageCount" value="${list.pageCount}" /> <input class="btn btn-primary" type="submit" value="跳转" /> 共有 ${list.totalPage} 页