编辑

html,将数据渲染到tr上,方便js取值

js

//编辑板块
$(function () {
$('.edit-board-btn').click(function (event) {
var self = $(this);
var tr = self.parent().parent();
var name = tr.attr('data-name');
var board_id = tr.attr('data-id'); xtalert.alertOneInput({
'text': '请输入新的板块名称',
'placeholder': name,
'confirmCallback': function (inputValue) {
ajax.post({
'url': '/cms/uboards/',
'data': {
'board_id': board_id,
'name': inputValue
},
'success': function (data) {
if(data['code'] == 200){
window.location.reload();
}else{
xtalert.alertInfo(data['message']);
}
}
});
}
});
});
});

效果

把板块展示到前端首页

准备一些测试数据

前台首页视图

@bp.route('/')
def index():
banners = BannerModel.query.order_by(BannerModel.priority.desc()).limit(4) # 只取4条
boards = BoardModel.query.all()
context = {'banners': banners, 'boards': boards}
return render_template('front/front_index.html', **context)

html

<div class="sm-container">
<div style="padding-bottom: 10px;">
<button class="btn btn-warning btn-block">发布帖子</button>
</div>
<div class="list-group">
<a href="#" class="list-group-item active">所有板块</a>
{% for board in boards %}
<a href="#" class="list-group-item">{{ board.name }}</a>
{% endfor %} </div>
</div>

效果

最新文章

  1. JSONObject put,accumulate,element的区别
  2. 第一次接触OOM
  3. c#自制视屏监控
  4. kinect学习笔记(二)&mdash;&mdash; Sdk平台的搭建~、
  5. javascript设计模式学习之四——单例模式,缓存与对象池
  6. DBSCAN算法
  7. linux命令 --&gt; cd命令
  8. ubuntu12.04的vim配置
  9. ASP.NET MVC 5 学习教程:添加查询
  10. linux 安装redis4.0.6
  11. Windows上安装MySQL的完整教程
  12. UVALive - 4287 - Proving Equivalences(强连通分量)
  13. JavaScript生成斐波那契数列
  14. Android导出数据库文件
  15. docker在centos7系统镜像下遇到的一些问题
  16. Color the ball HDU1556
  17. 【译】第8节---EF Code First中配置类
  18. centos6.6安装hadoop-2.5.0(二、伪分布式部署)
  19. 1月第2周业务风控关注|“扫黄打非”部门查处互动作业、纳米盒等20多个学习类App
  20. Priority Queue

热门文章

  1. 06 Windows编程——设备句柄 和 WM_PAINT消息
  2. 315 &#183; Istio1.1 功能预告,真的假不了
  3. zend studio 13.6.1中文乱码的解决办法
  4. Nginx 配置参数中文说明
  5. python2.7 psycopg2
  6. [Google Guava] 7-原生类型
  7. 参数类型 (@Service层) interface 常用参数类型举例
  8. 【线性代数】7-1:线性变换思想(The Idea of a Linear Transformation)
  9. P1484 种树——数据结构优先队列
  10. c 判断数字是否无限