分页和图片上传

Posted yl好久不见

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了分页和图片上传相关的知识,希望对你有一定的参考价值。

今天学习到的新知识
分页功能得注意点 
1、使用bootstrapTable框架
    处理过程
    前台bootstrapTable框架可以设置初始化加载页面,默认第一页(pageNumber:1),每页记录行数(pageSize),以及可供选择的每页行数(pageList[10,15,50])
    还有就是page这个是控制当前页号,一般不需要修改。然后page和pageSize参数传到后台通过paginate($pageSize)函数进行处理,如果数据库中的数据少于$pageSize那么将不会显示上一页和下一页,因为该div的display设置的是none,反之page也会起作用,执行的部分sql语句为(limit 5 offset 0)意义是查询五条数据,从第一条开始。
 
2、不使用bootstrapTable框架
   虽然处理过程中使用到的函数类似
   后台执行的过程
  $data = Article::orderBy( ‘id‘,‘desc‘ )->paginate(10);
  前台显示的过程
 <div class="page_list">
      {{$data->links()}}
 </div>
 
缩略图的上传
 (1) 使用到的一个jquery.uploadify.min.js

/**
* 图片上传方法
*/
public function upload(){
$file = Input::file( ‘Filedata‘ );
if( $file->isValid() ){
$entension = $file->getClientOriginalExtension();//上传文件的后缀
$newName = date(‘YmdHis‘).mt_rand(100,999).‘.‘.$entension;//没后缀名的文件
$path = $file->move( base_path().‘/uploads/‘,$newName );//路径
$filepath = ‘uploads/‘.$newName;
return $filepath;
}
}

<tr>
<th>缩略图:</th>
<td>

<script src="{{asset( ‘resources/org/uploadify/jquery.uploadify.min.js‘ )}}" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="{{asset( ‘resources/org/uploadify/uploadify.css‘ )}}">
<input type="text" size="50" name="art_thumb">
<input id="file_upload" name="file_upload" type="file" multiple="true">
</td>
<script type="text/javascript">
<?php $timestamp = time();?>
$(function() {
$(‘#file_upload‘).uploadify({

‘formData‘ : {
‘timestamp‘ : ‘<?php echo $timestamp;?>‘,
‘_token‘ : ‘{{csrf_token()}}‘,
},
‘buttonText‘:‘图片上传‘,
‘swf‘ : ‘{{asset( ‘resources/org/uploadify/uploadify.swf‘ )}}‘,
‘uploader‘ : ‘{{url( "admin/upload" )}}‘,
‘onUploadSuccess‘ : function(file, data, response) {
$( ‘#art_thumb_v‘ ).attr( ‘src‘,‘/‘+data).css( {‘width‘:‘350px‘,‘heigth‘:‘50px‘} );
$( ‘input[name="art_thumb"]‘ ).val( data );
}
});
});
</script>
<style>
.uploadify{
display:inline-block;
}
.uploadify-button{border:none;border-radius:5px;margin-top:8x;}
table.add_tab tr td span.uploadify-button-text{color:#fff;margin:0}
</style>
</tr>
<tr>
<th></th>
<td>
<img id="art_thumb_v" >
</td>
</tr>

以上是关于分页和图片上传的主要内容,如果未能解决你的问题,请参考以下文章

带有分页和排序的 Spring Boot JPA 规范 API

物理分页和逻辑分页

django 中的高效分页和数据库查询

bootstrap-paginator+json+java+ajax实现新闻分页,并能翻页和定位到哪一页,点击跳转

现代操作系统是不是使用分页和分段?

Jsp页面,结果集分页和sql(top)分页的性能对比