做条件查询时的小技巧
原创
©著作权归作者所有:来自51CTO博客作者gaochaojs的原创作品,请联系作者获取转载授权,否则将追究法律责任
在做查询时,一般我们都是首先选择查询项,如姓名,然后查询值,如“周”进行模糊查询,则所有名字中含有“周”的记录将被查出,如“马周”、“周向宁”等。如果查询项是年份,部门等有固定值的情况呢,要做添加的话,毋庸考虑,是用下拉菜单。如果是查询呢,有的简单的系统可能会用直接令用户输入的方法,这种方法虽然简单易行,但是很不友好,用户会觉得不舒服。
比较友好的界面设计方法应该是当查询项是姓名,名称及类似查询项时,使用文本框输入;如果查询项是年份时则使用下拉菜单。另外还有一个广泛应用于ERP系统,OA系统,MIS系统等中的按照部门查询,这种情况下有可能是部门会动态增加或减少,那么查询项我们可以有两种设计方法,第一种,尽可能将以后会出现的所有不猛加入下拉菜单;第二种将部门记录从数据库中读出显示在下拉菜单中。
示例代码如下:
<script type="text/javascript">
function check()
{
var msg = document.getElementById("searchitem1");
if('depName'.match(msg.value))
{
document.all('showName').style.display="none";
document.all('showDep').style.display="block";
}
else{
document.all('showName').style.display="block";
document.all('showDep').style.display="none";
}
}
<form name="Form" method="post">
<table>
<tr>
<td width="10%"></td>
<td>
<select name="query.searchitem1" id="searchitem1"
onclick="check();">
<option value="name">
姓名
</option>
<option value="depName">
部门
</option>
</select>
</td>
<td>
<div id="showName" style="display: block;">
<input type="text" name="query.searchvalue2" style="width: 150px">
</div>
<div id="showDep" style="display: none;">
按部门查询的第一种方法
<select name="query.searchvalue1" id="searchvalue1"
style="width: 150px">
<option value="办公室">
办公室
</option>
<option value="市场部">
市场部
</option>
</select>
按部门查询的第二种方法,departmentlist为符合查询要求的department列表
<%<select name="query.searchvalue2" id="searchvalue2"
style="width: 150px">
<c:forEach var="item" items="${departmentlist}">
<option value="<c:out value='$item.deptName}'/>">
${item.deptName}
</option>
</c:forEach>
</select> %>
</div>
</td>
<td>
<input type="button" name="button" value="查 询 style="cursor: hand;" />
</td>
</tr>
</table>
提问和评论都可以,用心的回复会被更多人看到
评论
发布评论
相关文章
-
SpringBoot开发的几个小技巧
SpringBoot开发的几个小技巧
Controller 注册 容器 -
SQL查询小技巧
有那么一些SQL查询小技巧你一定会收藏的~
分页 sql 数据 -
几个SQL查询小技巧
这些SQL查询小技巧,一般人我不告诉他
sql 数据 分页 -
yum 软件查询使用小技巧
Linux命令对应软件包查询使用小技巧
Linux 命令 软件包