置顶信息（不仅修改数据库，也完成了前台效果）

最新推荐文章于 2023-06-02 14:09:04 发布

VIP文章用户aaa

最新推荐文章于 2023-06-02 14:09:04 发布

阅读量1.7k

点赞数 1

分类专栏：前端 easyui 文章标签： java js easyui 数据库

本文链接：https://blog.csdn.net/qq_38210636/article/details/115311565

版权

零、效果

不仅修改了数据库，前台页面也变化了。。。
在这里插入图片描述

一、项目需求（二次开发+ssm+js）：

需求：完成某条信息的置顶功能

详细：在某页面的管理后台，完成对数据库的某张表中，某1条信息的置顶（前端动态效果+后端修改数据库）

二、项目框架：

前端：easyUI

后端：ssm

三、思路：

前端：编写js代码，实现置顶和取消置顶的效果，以及在执行前，完成对每一行数据的置顶状态的判断

后端：查询每一行的数据、修改置顶状态，根据置顶状态，降序排列DESC

四、前端js以及部分样式编写：

1、完成页面中的table “表头 + 表格数据来源” 的制作，并要添加一个字段，代表置顶状态（top），（注意：下面的代码位于<body>中，展现出的是一个表格，可以在easyUI官网中找到这段制作表格的代码）

<body>

	<table class="easyui-datagrid"
					style="width: 100%; height: 100%; display: none"
					data-options="scrollbarSize:0,singleSelect:true,collapsible:true,url:这里填写你自己想要展示的数据的控制层路由地址（即从数据库中查询数据，并展示列表的功能），最后用单引号引起来 ,fitColumns : true,"
					id=这里是表名称，很重要！！！后面会通过该名称，获取表中的数据，我这里写的是infodetail(要带双引号) toolbar="#tb1">
	
					<%--表头--%>
					<thead>
						<tr>
							<th data-options="field:你自己的表中的某个字段名称（最后用单引号引起来）,width:250,align:'center'">你自己的表中的某个字段名称</th>
	
							<th data-options="field:你自己的表中表示时间的字段名称（最后用单引号引起来，我这里是'fbsj'）,width:250,align:'center',formatter:formattime">你自己的表中表示时间的字段名称</th>
							
							<th data-options="field:你自己的表中表示置顶状态的字段名称（最后用单引号引起来，我这里表示置顶状态的名称是'top'）,width:250,align:'center',formatter:formatjudgetopstate">置顶状态</th>
							
							<th data-options="field:'_operate',width:250,align:'center',formatter:formatistop">操作</th>
						</tr>
					</thead>
	</table>

</body>

2、完成时间格式化（拓展功能。。。可不看）

/* 时间格式化 （将数据库中获取到的时间格式化）*/
		function formattime(val, row) {
   
		/* 注意：方法名formattime 要与第一个代码块中的第2个 <th data-options>中的formatter属性的value要对应相同。。。否则return失败 */
			var da = new Date(val);
			return da.toLocaleString();
		}

3、完成置顶和取消置顶超链接的制作

 function formatistop(val, row, index) {
      // val, row, index 是 easyui自己封装好的获取当前行的一些数据，其中，row代表当前行的所有数据，如{'name':'张三','age':'18'......}
           
           //获取每一行的 top字段所对应的值，判断false或true
		    if(!row['top'

最低0.47元/天解锁文章

用户aaa

关注

1
点赞
踩
8

收藏

觉得还不错? 一键收藏
0
评论
置顶信息（不仅修改数据库，也完成了前台效果）

零、效果不仅修改了数据库，前台页面也变化了。。。# 一、项目需求（二次开发+ssm+js）：需求：完成某条信息的置顶功能详细：在某页面的管理后台，完成对数据库的某张表中，某1条信息的置顶（前端动态效果+后端修改数据库）二、项目框架：前端：easyUI后端：ssm三、思路：前端：编写js代码，实现置顶和取消置顶的效果，以及在执行前，完成对每一行数据的置顶状态的判断后端：查询每一行的数据、修改置顶状态四、前端js以及部分样式编写：1、完成页面中的table “表头 + 表格数
复制链接

扫一扫