Laravel+jQuery实现AJAX分页效果
本文实例讲述了Laravel+jQuery实现AJAX分页效果。分享给大家供大家参考,具体如下:
JavaScript部分:
//_______________________ //listenertothe[selectfromexistingphotos]button $('#photosModal').on('shown.bs.modal',function(){ //getthefirstpageofphotos(paginated) getPhotos(function(photosObj){ displayPhotos(photosObj); }); }); /** *getthephotospaginated,anddisplaytheminthemodalofselectingfromexistingphotos * *@parampage */ functiongetPhotos(callback){ $.ajax({ type:"GET", dataType:'json', url:Routes.cms_photos,//thisisavariablethatholdsmyrouteurl data:{ 'page':window.current_page+1//youmightneedtoinitthatvarontopofpage(=0) } }) .done(function(response){ varphotosObj=$.parseJSON(response.photos); console.log(photosObj); window.current_page=photosObj.current_page; //hidethe[loadmore]buttonwhenallpagesareloaded if(window.current_page==photosObj.last_page){ $('#load-more-photos').hide(); } callback(photosObj); }) .fail(function(response){ console.log("Error:"+response); }); } /** *@paramphotosObj */ functiondisplayPhotos(photosObj) { varoptions=''; $.each(photosObj.data,function(key,value){ options=options+"<optiondata-img-src='"+value.thumbnail+"'value='"+value.id+"'></option>"; }); $('#photos-selector').append(options); $("select").imagepicker(); } //listenertothe[loadmore]button $('#load-more-photos').on('click',function(e){ e.preventDefault(); getPhotos(function(photosObj){ displayPhotos(photosObj); }); });
php控制器部分:
//_______________________ //... $photos=$this->photo_repo->paginate(12); returnResponse::json([ 'status'=>'success', 'photos'=>$photos->toJson(), ]);
更多关于Laravel相关内容感兴趣的读者可查看本站专题:《Laravel框架入门与进阶教程》、《php优秀开发框架总结》、《smarty模板入门基础教程》、《php日期与时间用法总结》、《php面向对象程序设计入门教程》、《php字符串(string)用法总结》、《php+mysql数据库操作入门教程》及《php常见数据库操作技巧汇总》
希望本文所述对大家基于Laravel框架的PHP程序设计有所帮助。