经验小总结
获取上个页面传递过来的行程id
通过js获取
eg : <a href=''demo.jsp?gId=1">跳转"</a>
<script>
$.getUrlParam = function (name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if (r != null) return decodeURI(r[2]); return null;
}
var gId=$.getUrlParam('gId') //传过来的id
</script>
获取时间
Date now=new Date();
SimpleDateFormat sp = new SimpleDateFormat("yyyy-MM-dd");
String time=sp.format(now);
layui操作小总结
(1)传过来数据有对象的时候
table.render({
elem: '#table1',
url: "../../servlet/BackUser?method=queryTravelAssign&content="+sId,//数据接口
page: true,//开启分页
cols: [[ //表头
{field: 'day', title: '行程安排' },
{field: 'con', title: '安排内容'} ,
{field: 'scenicSpot', title: '景点' ,templet:function(d){return d.scenicSpot.scenic_spot_name;}},
//tripMode 是个对象 ;t_from_place对象中的属性
{field: 'tripMode', title: '出行',templet:function(d){return d.tripMode.t_from_place}} ,
{field: 'cooperation', title: '饭店',templet:function(d){return d.cooperation.cooperation_name}} ,
]],id:'idtable1'
});
(2)数据转换
....
{field: 'g_grade', title: '等级',templet:'#grade'},
......
<script type="text/html" id="grade">
{{# if(d.g_grade<=25){ }}
初级
{{# }else if(d.g_grade>=25&&d.g_grade<=50){ }}
中级
{{# }else if(d.g_grade>=50&&d.g_grade<=75){ }}
高级
{{# }else if(d.g_grade>=75&&d.g_grade<=100){ }}
高高级
{{# } }}
</script>
(3)双击行获取数据
<table class="layui-table" id="tab1" lay-filter="tab1"> </table>
table.on('rowDouble(tab1)', function(obj){
var gname=obj.data.g_name;
$('#retName').val(gname)
$('#retId').val(obj.data.id)
layer.msg('您选择的是'+gname+'导游')
});
//监听单元格事件
table.on('tool(tab1)', function(obj){
var data = obj.data;
if(obj.event === 'scenicSpot'){
}
})
(4)批量操作
$('#delAll').click(function(){
var checkStatus=table.checkStatus('idtable1'),
length=checkStatus.data.length;
if(length>0){
var guiderId= "";
for(var i=0;i<length;i++){
guiderId +=checkStatus.data[i].id+",";
}
layer.confirm('确认要批量删除吗?',function(){
layer.confirm('真的确认要批量删除?',function(){
$.get("../../servlet/BackUser?method=delGuiderAll&guiderId="+guiderId,function(retdata){
if(retdata=='true'){
layer.msg('已成功批量删除!', {
icon: 1,
time: 1000
});
}else{
layer.msg('批量删除有异常!', {
icon: 1,
time: 1000
});
}
});
table.reload('idtable1');
});
});
}else{
layer.msg('您还木有选择!', {
icon: 6,
time: 1000
});
}
})
(4)搜索
<form class="layui-form layui-col-md12 x-so" id="searchform">
<input type="text" name="search" placeholder="请输入查询信息" class="layui-input" style="width:200px;">
<button class="layui-btn" type="submit" lay-submit="" lay-filter="search"><i class="layui-icon"></i></button>
</form>
//搜索信息
form.on('submit(search)', function(data){
var searchdata=data.field;
console.log(searchdata)
tablereload.reload({
where:{search:searchdata.search},
page:{curr:1}//解决不同页也可以查询所需内内容
});
return false;
});
===============================================================
$('#form1').submit(function(){
var content=$('#content').val()
table.reload('idtable1',{
where:{content:content},
page:{curr:1} //解决不同页也可以查询所需内内容
});
return false;
})
(5)表格渲染
<form class="layui-form" id="fomr1" lay-filter="test2" >....
....
success:function (data){
$("input:radio[value='"+data.g_sex+"']").attr('checked','true');
$("#st_type option[value='"+ret.st_type+"']").attr("selected",true);
form.render(null, 'test2');
}
(6)复选框切换
<script type="text/html" id="isNice">
<input type="checkbox" name="s_isNice" value="{{d.id+','+d.s_isNice}}" lay-skin="switch" lay-text="是|否" lay-filter="isNice" {{ d.s_isNice == 1 ? 'checked' : '' }}>
</script>
...
{field:'s_isNice', title:'是否精选',width:100, templet: '#isNice'},
...
//监听精选操作
form.on('switch(isNice)', function(obj){
var id=this.value;
$.get('../../servlet/BackUser?method=upSisNice&s_id='+id,function(ret){
if(ret=='true'){
layer.msg('修改成功',function(){
icon:6
time:1000
});
}else{
layer.msg('修改失败',function(){
icon:1
time:1000
});
}
})
/* layer.tips(this.value + ' ' + this.name + ':'+ obj.elem.checked,obj.othis); */
});
上传图片效果
//隐藏的一个file类型的input 标签
<input type="file" name="g_header" id="headimgfile" style="display:none;">
//一个展示图片的一个img标签
<img style="width:120px;height:130px;" src="../images/pic/1.png" class="updateheadimg" id="heImg">
var img=""; // 图片上传的本地完整路径
// 展示的img点击后发生的事件
$('#heImg').click(function(){
$("#headimgfile").click(); // 触发隐藏的input标签
$("#headimgfile").change(function(e){
//获取图片的的本地完整路径
var url = window.URL.createObjectURL(e.target.files[0]);
//改变展示图片内容以及样式大小等
$("#heImg").attr("src",url).attr("style","height:120px;","width:130px");
});
})
//隐藏的input改变后
$("#headimgfile").change(function(e){
img=e.target.files[0];
})
//点击确认提交按钮后
form.on('submit(add)', function(){
//重新实例化一个form对象
var form = new FormData();
//往form对象中添加数据
form.append("g_header",img);
form.append("g_name", $('#g_name').val());
//获取单选按钮数据
form.append("g_sex", $('input:radio[name="g_sex"]:checked').val());
form.append("g_age", $('#g_age').val());
form.append("g_phone", $('#g_phone').val());
form.append("g_grade", $('#g_grade').val());
form.append("g_introduce", $('#g_introduce').val());
if(img==""){
layer.msg('照片还木有上传了',function(){
icon:1
time:3000
})
}else{
$.ajax({
url:'../../servlet/BackUser?method=addGuider',
type:'post',
data:form,
dataType:'text',
processData : false, // 使数据不做处理
contentType : false, // 不要设置Content-Type请求头
success:function(ret){
if(ret=='true'){
layer.msg('添加成功',function(){
icon:1
time:3000
})
}else{
layer.msg('添加失败,可能原因是该添加导游存在',function(){
icon:6
time:3000
})
}
}
})
}
return false;
});
//servlet数据获取
Map<String, Object> map= CommonsUtil.upLoad(request);
// 获取数据.并转换
Integer.parseInt((String) map.get("g_id")),
(String)map.get("g_phone")
Double.parseDouble((String)map.get("g_grade"))
删除图片
//===>>>servlet中的方法
public void delGuiderOne(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
int guiderId=Integer.parseInt(request.getParameter("guiderId"));
IUser godao=new UserImple();
//获取路径
String path=request.getServletContext().getRealPath("");
//删除数据库中数据
boolean bool=godao.delGuiderOne(guiderId,path);
PrintWriter out=response.getWriter();
out.print(bool);
}
//===>>>实现类中的方法
public Boolean delGuiderOne(int guiderId,String path) {
//删除头像文件
Guider_table guider= selGuiderOne(guiderId);
CommonsUtil.delFile(guider.getG_header(),path);
}
//===>>>文件删除类中的方法
public static void delFile(String path,String patha){
patha +=File.separator+UPLOAD_PATH;
String pathb[] =path.split("/"); //分割
String name=pathb[pathb.length-1]; //获取最后一个内容:图片名
File file=new File(patha+"\\"+name);
if(file.exists()&&file.isFile()){
file.delete();
}
占位符sql语句
/*
* (导游数据遍历)
*/
@Override
public ArrayList<Guider_table> queryGuiderAll2(Map<String, Object> map) {
ArrayList<Guider_table> list=new ArrayList<Guider_table>();
Connection conn=DBUtil.getConn();
PreparedStatement ps=null;
ResultSet rs=null;
try {
//定义sql语句
StringBuffer sql = new StringBuffer();
sql.append("select * from guider_table where 1=1");
//判断是否有条件查询遍历数据
if(!map.get("content").equals("")){
sql.append(" and g_name like ? or id = ? or g_phone = ? ");
}
sql.append(" limit ?,?");
ps =conn.prepareStatement(sql.toString());
ps.setInt(1,Integer.parseInt(map.get("star")+""));
ps.setInt(2,Integer.parseInt(map.get("size")+""));
//判断是否有条件查询遍历数据
if(!map.get("content").equals("")){
ps.setString(1,"%"+map.get("content")+"%");
for (int i = 2; i <4; i++) {
ps.setString(i,map.get("content")+"");
}
ps.setInt(4,Integer.parseInt(map.get("star")+""));
ps.setInt(5,Integer.parseInt(map.get("size")+""));
}
/* //获取参数 map中不为空的键
Set<String> nam_space = map.keySet();
for (String str : nam_space) {
if(str!=null && !("").equals(str)){
if("content".equals(str)){
sql.append("or g_name like ? ");
}else if("content".equals(str)){
sql.append("or id = ? ");
}else if("content".equals(str)){
sql.append("or g_phone = ? ");
}
}
}
//给问号 赋值
int i=1;
for (String str : nam_space) {
//取键对应的值
Object knames = map.get(str);
if(knames!=null && !("").equals(knames)){
ps.setObject(i,knames);
i++;
}
}*/
rs=ps.executeQuery();
while(rs.next()&&rs!=null){
Guider_table guider=new Guider_table(
rs.getInt("id"),
rs.getString("g_name"),
rs.getString("g_sex"),
rs.getInt("g_age"),
rs.getString("g_phone"),
rs.getString("g_header"),
rs.getDouble("g_grade"),
rs.getString("g_introduce"),
rs.getInt("g_status"));
list.add(guider);
}
} catch (Exception e) {
e.printStackTrace();
}finally {
DBUtil.dbClose(rs, ps, conn);
}
return list;
}
/*
* (导游总数2)
*/
@Override
public int retGuiderNum2(Map<String, Object> map) {
int num=0;
Connection conn=DBUtil.getConn();
ResultSet rs=null;
PreparedStatement ps=null;
StringBuffer sql=new StringBuffer();
sql.append("select count(*) from guider_table where 1=1");
try {
ps=conn.prepareStatement(sql.toString());
if(!map.get("content").equals("")){
sql.append(" and g_name like ? or id = ? or g_phone = ? ");
ps=conn.prepareStatement(sql.toString());
ps.setString(1,"%"+map.get("content")+"%");
for (int i = 2; i <4; i++) {
ps.setString(i,map.get("content")+"");
}
}
rs=ps.executeQuery();
rs.next();
num=rs.getInt(1);
} catch (Exception e) {
e.printStackTrace();
}finally {
DBUtil.dbClose(rs, ps, conn);
}
return num;
}
返回Json数据遍历
$.ajax({
url:'servlet/ScenicSpot?method=showScenicSpot',
type:'get',
dataType:'json',
async:false,
success:function(retdata){
$('#count').text(retdata.sumPage);
$('#nowcount').text(retdata.currentPage);
$(retdata.list).each(function(i,item){
add(i,item.id,item.scenic_spot_img,item.scenic_spot_name,item.scenic_spot_history)
})
}
})
//通过 append 增加内容格式
function add(j,id,scenic_spot_img,scenic_spot_name,scenic_spot_history){
if(j<3){
$('#tsOne').append(
"<div class='bi_one' >"+
"<a href='view_place.jsp?id="+id+"'><img height='100%' src='"+scenic_spot_img+"'width='280px'' /></a>"+
"<div class='kong'>"+
"<h5 style='margin-top:10px;'>"+scenic_spot_name+"</h5><p>"+
scenic_spot_history.substring(0,50)+"...</p></div></div>"
)
}else{
$('#tsTwo').append(
"<div class='bi_one'>"+
"<a href='view_place.jsp?id="+id+"'><img height='100%' src='"+scenic_spot_img+"'width='280px;'' /></a>"+
"<div class='kong'>"+
"<h5 style='margin-top:10px;'>"+scenic_spot_name+"</h5><p>"+
scenic_spot_history.substring(0,50)+"...</p></div></div>"
)
}
}
//清空内容
$('.tsBass').empty()
//案例
$.ajax({
url:'servlet/Login?op=SelMessage&judge=1',
type:'get',
dataType:'json',
success:function(retMeg){
$('#inNum').text(retMeg.length)
$.each(retMeg,function(i,item){
//通过添加 prepend 数据 加载在加载中的数据最前面
$('#indisNews').prepend(
"<li class='chat' title='双击查看详情'>"+
"<input type='hidden' class='mg_id' value='"+
item.mg_id+"'><span class='glyphicon glyphicon-envelope' aria-hidden='true'></span>"+
"<span class='glyphicon-class'></span>"+
item.mg_type+"<br/><br/><img class='delMeg' title='删除' src='images/deim.png'></li>"
)
})
}
})
//双击查看消息详情
$('#indisNews').on("dblclick",".chat",function(){
if(judge!=3){
$.get('servlet/Login?op=UpMeglook&mgId='+$(this).find('input[class=mg_id]').val());
}
layer.open({
type: 2, //类型,解析url
closeBtn: 2, //关闭按钮是否显示 1显示0不显示
title: false, //页面标题
shadeClose: false, //点击遮罩区域是否关闭页面
shade: 0.8, //遮罩透明度
area: ['1150px', '650px'], //弹出层页面比例
content: ['chatRet.jsp?mgId='+$(this).find('input[class=mg_id]').val()], //弹出层的url
anim: 2
});
ObtainNews()
});
//删除消息
$('#indisNews').on("click",".delMeg",function(){
var mgId=$(this).parent().find('input[class=mg_id]').val()
layer.confirm('确认要删除吗?', function(index) {
$.ajax({
url:'servlet/Login?op=DelMessageOne',
type:'get',
data:{"mgId":mgId},
dataType:'text',
success:function(msg){
layer.msg('删除成功',function(){
icon:1;
time:3000;
})
ObtainNews()
}
})
})
});
js获取数据
1.通过名字获取:document.getElementByName(“name”).value;
2.通过id获取: document.getElementById(“id”).value;
3.通过类获取:document.getElementsByClassName(“class”).value;
4.获取文档中id=“querySelector”的值:document.querySelector("#querySelector").value;
js日期函数总结:
var mydate = new Date();
mydate.getYear(); //获取当前年份(2位)
mydate.getFullYear(); //获取完整的年份(4位,1970-???)
mydate.getMonth(); //获取当前月份(0-11,0代表1月)
mydate.getDate(); //获取当前日(1-31)
mydate.getDay(); //获取当前星期X(0-6,0代表星期天)
mydate.getTime(); //获取当前时间(从1970.1.1开始的毫秒数)
mydate.getHours(); //获取当前小时数(0-23)
mydate.getMinutes(); //获取当前分钟数(0-59)
mydate.getSeconds(); //获取当前秒数(0-59)
mydate.getMilliseconds(); //获取当前毫秒数(0-999)
mydate.toLocaleDateString(); //获取当前日期
var mytime=mydate.toLocaleTimeString(); //获取当前时间
mydate.toLocaleString( ); //获取日期与时间
集合遍历三种方法
第一种、最基础的遍历方式:for循环,指定下标长度,使用List集合的size()方法,进行for循环遍历
import java.util.ArrayList;
public class Demo01 {
public static void main(String[] args) {
ArrayList<News> list = new ArrayList<News>();
list.add(new News(1,"list1","a"));
list.add(new News(2,"list2","b"));
list.add(new News(3,"list3","c"));
list.add(new News(4,"list4","d"));
for (int i = 0; i < list.size(); i++) {
News s = (News)list.get(i);
System.out.println(s.getId()+" "+s.getTitle()+" "+s.getAuthor());
}
}
}
第二种、较为简洁的遍历方式:使用foreach遍历List,但不能对某一个元素进行操作(这种方法在遍历数组和Map集合的时候同样适用)
import java.util.ArrayList;
public class Demo02 {
public static void main(String[] args) {
ArrayList<News> list = new ArrayList<News>();
list.add(new News(1,"list1","a"));
list.add(new News(2,"list2","b"));
list.add(new News(3,"list3","c"));
list.add(new News(4,"list4","d"));
for (News s : list) {
System.out.println(s.getId()+" "+s.getTitle()+" "+s.getAuthor());
}
}
}
第三种、适用迭代器Iterator遍历:直接根据List集合的自动遍历
import java.util.ArrayList;
public class Demo03 {
public static void main(String[] args) {
ArrayList<News> list = new ArrayList<News>();
list.add(new News(1,"list1","a"));
list.add(new News(2,"list2","b"));
list.add(new News(3,"list3","c"));
list.add(new News(4,"list4","d"));
Iterator<News> iter = list.iterator();
while (iter.hasNext()) {
News s = (News) iter.next();
System.out.println(s.getId()+" "+s.getTitle()+" "+s.getAuthor());
}
}
}