bootstrap 查询条件布局
2024-04-11 13:17:01
效果如下：
代码：
<div class="container-fluid"><div class="row"><div class="panel panel-default"><div class="panel-heading"><span class="glyphicon glyphicon-th-list" aria-hidden="true"></span> 条件查找</div><div class="panel-body"><div class="row"><div class="col-lg-4 col-sm-8 col-xs-8 col-xxs-12"><div class="form-horizontal"><div class="form-group"><div class="col-md-4 control-label" for="select">归属地</div><div class="col-md-4"><select ID="ddlsheng" class="form-control"><option Value="0">全国</option></select></div><div class="col-md-4"><select ID="ddlshi" class="form-control"></select></div></div></div></div><div class="col-lg-4 col-sm-8 col-xs-8 col-xxs-12"><div class="form-horizontal"><div class="form-group"><div class="col-md-4 control-label" for="select">余额</div><div class="col-md-4"><input type="text" class="form-control" runat="server" id="Balance_start"name="Balance_start" /></div><div class="col-md-4"><input type="text" class="form-control" runat="server" id="Balance_end"name="Balance_end" /></div></div></div></div><div class="col-lg-4 col-sm-8 col-xs-8 col-xxs-12"><div class="form-horizontal"><div class="form-group"><div class="col-md-4 control-label" for="select">是否VIP</div><div class="col-md-4"><select ID="select_IsVIP" runat="server" AutoPostBack="True"class="form-control"><option Value="-1">全部</option><option Value="0">是</option><option Value="1">否</option></select></div><div class="col-md-4"></div></div></div></div></div><div class="row"><div class="col-lg-4 col-sm-8 col-xs-8 col-xxs-12"><div class="form-horizontal"><div class="form-group"><div class="col-md-4 control-label" for="select">日期</div><div class="col-md-4"><input type="text" id="txtfrom" runat="server" class="form-control"placeholder="选择开始日期" onfocus="WdatePicker({dateFmt:'yyyy/MM/dd'})"></div><div class="col-md-4"><input type="text" id="txtto" runat="server" class="form-control"placeholder="选择结束日期" onfocus="WdatePicker({dateFmt:'yyyy/MM/dd'})"></div></div></div></div><div class="col-lg-4 col-sm-8 col-xs-8 col-xxs-12"><div class="form-horizontal"><div class="form-group"><div class="col-md-4 control-label" for="select">代驾次数</div><div class="col-md-4"><input type="text" class="form-control" runat="server" id="daijicount_start"name="daijicount_start" /></div><div class="col-md-4"><input type="text" class="form-control" runat="server" id="daijicount_end"name="daijicount_end" /></div></div></div></div><div class="col-lg-4 col-sm-8 col-xs-8 col-xxs-12"><div class="form-horizontal"><div class="form-group"><div class="col-md-4 control-label" for="select">生日月份</div><div class="col-md-4"><select ID="BirthdayMonth" runat="server" AutoPostBack="True"class="form-control"><option Value="0">全部</option><option Value="1">1月</option><option Value="2">2月</option><option Value="3">3月</option><option Value="4">4月</option><option Value="5">5月</option><option Value="6">6月</option><option Value="7">7月</option><option Value="8">8月</option><option Value="9">9月</option><option Value="10">10月</option><option Value="11">11月</option><option Value="12">12月</option></select></div><div class="col-md-4"></div></div></div></div></div><div class="row"><div class="col-lg-4 col-sm-8 col-xs-8 col-xxs-12"><div class="form-horizontal"><div class="form-group"><div class="col-md-4 control-label" for="select">跟踪状态</div><div class="col-md-4"><select ID="TrackingState" runat="server" AutoPostBack="True"class="form-control"><option Value="-1">全部</option><option Value="0">有意向</option><option Value="1">无意向</option></select></div><div class="col-md-4"></div></div></div></div><div class="col-lg-4 col-sm-8 col-xs-8 col-xxs-12"><div class="form-horizontal"><div class="form-group"><div class="col-md-4 control-label" for="select">再联系时间</div><div class=" col-md-8 "><input type="text" id="NextContactDate" runat="server" class="form-control"placeholder="选择日期"onfocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss'})"></div></div></div></div><div class="col-lg-4 col-sm-8 col-xs-8 col-xxs-12"><div class="form-horizontal"><div class="form-group"><div class="col-md-4 control-label" for="select">集团用户</div><div class="col-md-4"><select ID="GroupUser" runat="server" AutoPostBack="True"class="form-control"><option Value="-1">全部</option><option Value="0">个人用户</option><option Value="1">集团用户</option></select></div><div class="col-md-4"></div></div></div></div></div><div class="row"><div class="col-lg-4 col-sm-8 col-xs-8 col-xxs-12"><div class="form-horizontal"><div class="form-group"><div class="col-md-4 control-label" for="select">客户类型</div><div class="col-md-4"><select ID="CustomersType" runat="server" AutoPostBack="True"class="form-control"><option Value="0">全部</option><option Value="1">预付用户</option><option Value="2">推荐用户</option><option Value="3">普通用户</option><option Value="4">定额合约后付费商户</option><option Value="5">非定额后付费合约商户</option></select></div><div class="col-md-4"></div></div></div></div><div class="col-lg-4 col-sm-8 col-xs-8 col-xxs-12"><div class="form-horizontal"><div class="form-group"><div class="col-md-3 control-label" for="select">开票</div><div class="col-md-3"><select ID="ddl_Invoice" runat="server" AutoPostBack="True"class="form-control"><option Value="-1">全部</option><option Value="1">已开发票</option><option Value="0">未开发票</option></select></div><div class="col-md-3 control-label" for="select">标记</div><div class="col-md-3"><select ID="ddlRemark" class="form-control"><option Value="0">全部</option><option Value="1">空号</option><option Value="2">通话中</option><option Value="3">拒接</option><option Value="4">无人接听</option><option Value="5">停机</option><option Value="6">非本人</option><option Value="7">不需要</option><option Value="8">酒店</option><option Value="9">E代驾</option><option Value="10">重复数据</option><option Value="11">其他</option></select></div></div></div></div><div class="col-lg-4 col-sm-8 col-xs-8 col-xxs-12"><div class="form-horizontal"><div class="form-group"><div class="col-md-4 control-label">关键字</div><div class="col-md-4"><input type="text" class="form-control" runat="server" id="keyword"name="keyword" /></div><div class="col-md-4"><input type="button" ID="btnSearch" value=" 筛 选 "class="btn btn-success col-md-12 " /></div></div></div></div></div><!--查询 按钮--></div></div><!--/col--></div><!--/条件查找--></div>bootstrap 查询条件布局相关推荐
- html条件查询,高级查询条件设置- 通用查询-报表设计初级教程
普通布局下,多个查询条件之间是"AND"并且的关系.当多个条件之间存在着复杂的逻辑关系时,可以切换至高级布局面板,高级布局提供了括号和逻辑值的设置框,来完成条件之间逻辑关系的设置, ...
- echarts-tree：树图(带查询条件的导航图)
目录 echarts官网: 树图网址: echarts图例参数介绍网址: 功能实现 1.先实现查询数据库返回数据,将数据处理成树形结构返回给页面. 1.1.数据结构:子节点的PID等于父节点的ID. ...
- bootstrap layout.css,布局 | Layout
布局 | Layout 布局您的 Bootstrap 项目的组件和选项,包括包装容器.强大的网格系统.灵活的媒体对象和响应性实用工具类. Containers 容器是 Bootstrap 中最基本的布 ...
- 04 技术太卷我学APEX-页面查询条件提交给SQL查询
04 技术太卷我学APEX-页面查询条件提交给SQL查询 0 应用场景 0.1 仓库查历史库存的场景 比如我要查仓库某天的历史库存,这个日期需要用户在页面上输入并汇总数据返回结果返回.SQL语句大概是 ...
- 按拼音模糊匹配查询条件的生成类
转载了好几个地方,很难确定最早的出处. 将源码贴出来先. 1using System; 2using System.Text; 3using System.IO; 4 5namespa ...
- 使用ajax实现多个查询条件功能以及下拉分页
2018-8月18日 1.效果图: 2.前台html <!--搜索栏--> <div class=" row " style=" ...
- mongorepository查询条件_MongoDB动态条件之分页查询
一.使用QueryByExampleExecutor 1. 继承MongoRepositorypublic interface StudentRepository extends MongoRepos ...
- LINQ to SQL 运行时动态构建查询条件
原文地址:http://msdn.microsoft.com/zh-cn/dd567295.aspx 在进行数据查询时,经常碰到需要动态构建查询条件.使用LINQ实现这个需求可能会比以前拼接SQL语句 ...
- 浅析Entity Framework Core2.0的日志记录与动态查询条件
前言 Entity Framework Core 2.0更新也已经有一段时间了,园子里也有不少的文章.. 本文主要是浅析一下Entity Framework Core2.0的日志记录与动态查询条件 去 ...
最新文章
- docker从私有仓库Harbor， push 及 pull 镜像
- Android调焦函数,高通Android驱动中的对焦马达的配置
- 一个按键控制数码管的开和关_三菱PLC数码管显示及按键控制实验
- 【渝粤教育】国家开放大学2018年春季 0689-22T老年心理健康 参考试题
- python赋值的数组无序怎么办_Python的多维空数组赋值方法
- java 对话框打开与保存
- 微软iis服务器并发量,IIS并发连接数
- 最齐全的装饰贴图素材，速来收藏
- 【JavaWeb】Filter案例：登录验证、敏感词汇过滤
- 正态分布推导瑞利分布，瑞利信道的模型
- 斗鱼实名认证 mysql_斗鱼新人主播怎么进行实名认证 斗鱼直播实名认证失败怎么办...
- 常用的几种图片无损压缩工具
- 清华数为DWF低代码平台使用感悟
- 火狐插件 打开html 死机,Firefox火狐Flash插件卡死问题完美解决方法(转载)
- JETT（二）-Java简单实现
- 自学python接单_Python接私活，兼职轻松月薪过万，会技术就可走遍天下
- 计算机系单身率排行榜,中国高校单身率排行榜，第一名实至名归！
- linux mint 17 输入法,LinuxMint17.1 Rebecca中安装设置输入法
- 在网页中添加百度分享功能
- MCGS_pro触摸屏组态实际案列