折腾:
[已解决]Flask的SQLAlchemy中给数据库的表中添加列表类型的字段
期间,需要对于已有的列表中的某一行内,显示列表的内容
<div class="pages"> <!– Page, data-page contains page name–> <div data-page="showEvent" class="page"> <!– Scrollable page content–> <div class="page-content"> <div class="list-block"> <ul> <li> <div class="item-content"> <div class="item-inner"> <div class="item-title label">标题</div> <div class="item-text">{{ curEvent.title }}</div> </div> </div> </li> <li> <div class="item-content"> <div class="item-inner"> <div class="item-title label">发起人</div> <div class="item-text">{{ curEvent.user.nickname }}</div> </div> </div> </li> <li> <div class="item-content"> <div class="item-inner"> <div class="item-title label">起始时间</div> <div class="item-text">{{ curEvent.start_date | datetime_format }}</div> </div> </div> </li> <li> <div class="item-content"> <div class="item-inner"> <div class="item-title label">截止时间</div> <div class="item-text">{{ curEvent.end_date | datetime_format }}</div> </div> </div> </li> <li> <div class="item-content"> <div class="item-inner"> <div class="item-title label">地点</div> <div class="item-text">{{ curEvent.location }}</div> </div> </div> </li> <li> <div class="item-content"> <div class="item-inner"> <div class="item-title label">人数上限</div> <div class="item-text">{{ curEvent.max_user_num }}人</div> </div> </div> </li> <li> <div class="item-content"> <div class="item-inner"> <div class="item-title label">是否公开</div> <div class="item-text"> {% if curEvent.is_public %} 公开 {% else %} 不公开 {% endif %} </div> </div> </li> <li class="align-top"> <div class="item-content"> <div class="item-inner"> <div class="item-title label">描述</div> <div class="item-text">{{ curEvent.description }} <!–<textarea readonly>一起头脑风暴参与讨论出日历的功能,基本的用途</textarea>–> </div> </div> </div> </li> <li> <div class="item-content"> <div class="item-inner"> <div class="item-title label">提醒时间</div> <div class="item-text">5分钟前</div> </div> </div> </li> </ul> </div> <div class="content-block"> <div class="row"> <div class="col-50"> <input type="submit" value="分享链接" class="button button-big button-fill color-cyan"/> </div> <div class="col-50"> <form action="{{ url_for("create_event_qrcode", eventId=curEvent.id, curUserOpenid=curEvent.user.openid) }}" method="POST"> <input type="submit" value="生成邀请码" class="button button-big button-fill color-blue"/> </form> </div> </div> </div> </div> </div> </div> |
需要在其中添加一行:
<li> <div class="item-content"> <div class="item-inner"> <div class="item-title label">已报名人员</div> <div class="item-text">添加人员列表</div> </div> </div> </li> |
希望在里面实现人员名字的列表
framework7 列表嵌套
List View (Table View) | Framework7 Documentation
目前暂时用:
<li> <div class="item-content"> <div class="item-inner"> <div class="item-title label">已报名人员</div> <div class="list-block inset"> <ul> {% for eachJoiner in curEvent.joiners %} <li> <div class="item-content"> <div class="item-media"> <img class="initiator-avatar" src="{{ url_for(‘images’, width=24, height=24, quality=95, filename = eachJoiner.avatar_static_path ) }}"> </div> <div class="item-inner"> <div class="item-title">{{ eachJoiner.nickname }}</div> </div> </div> </li> {% endfor %} </ul> </div> </div> </div> </li> |
虽然比较难看,但是可以凑合显示:
[总结]
此处,暂时用
<!– We don’t need full layout here, because this page will be parsed with Ajax–> <!– Top Navbar–> <div class="navbar"> <div class="navbar-inner"> <div class="left"><a href="#" class="back link"> <i class="icon icon-back"></i><span>返回</span></a></div> <div class="center sliding">详情活动</div> </div> </div> <div class="pages"> <!– Page, data-page contains page name–> <div data-page="showEvent" class="page"> <!– Scrollable page content–> <div class="page-content"> <div class="list-block"> <ul> <li> <div class="item-content"> <div class="item-inner"> <div class="item-title label">标题</div> <div class="item-text">{{ curEvent.title }}</div> </div> </div> </li> <li> <div class="item-content"> <div class="item-inner"> <div class="item-title label">提醒时间</div> <div class="item-text">5分钟前</div> </div> </div> </li> <li> <div class="item-content"> <div class="item-inner"> <div class="item-title label">已报名人员</div> <div class="list-block inset"> <ul> {% for eachJoiner in curEvent.joiners %} <li> <div class="item-content"> <div class="item-media"> <img class="initiator-avatar" src="{{ url_for(‘images’, width=24, height=24, quality=95, filename = eachJoiner.avatar_static_path ) }}"> </div> <div class="item-inner"> <div class="item-title">{{ eachJoiner.nickname }}</div> </div> </div> </li> {% endfor %} </ul> </div> </div> </div> </li> </ul> </div> </div> </div> </div> |
从而暂时实现了:
列表内部嵌套显示列表。
虽然难看,但是先凑合吧。
转载请注明:在路上 » [基本解决]Framework7中如何实现列表项中添加列表