1. 程式人生 > >Laravel 5.1之Ajax無重新整理分頁

Laravel 5.1之Ajax無重新整理分頁

ajax無重新整理分頁的優點: 1、區域性重新整理 減輕壓力 2、美觀 提高使用者體驗 php程式碼:
/*
@Laravel框架
@Ajax無重新整理分頁(簡單7步驟)
*/
public function page()
{
//1、查詢資料庫總條數
$count = count(Db::table('email')->get());
//2、設定每頁顯示條數
$rev = '4';
//3、求總頁數
$sums = ceil($count/$rev);
//4、求單前頁
$page = Input::get('page');
if(empty($page)){
$page = "1";
}
//5、設定上一頁、下一頁
$prev = ($page-1)>0?$page-1:1;
$next = ($page+1)<$sums?$page+1:$sums;
//6、求偏移量
$offset = ($page-1)*$rev;
//7、sql查詢資料庫
$data = Db::select("select * from email limit $offset,$rev");
//8、數字分頁(可有可無)
$pp = array();
for($i=1;$i<=$sums;$i++){
$pp[$i]=$i;
}
return view('page.page',['data'=>$data,'prev'=>$prev,'next'=>$next,'sums'=>$sums,'pp'=>$pp,'page'=>$page]);
}
/*
@需要替換的部分頁面
*/
public function page_pro(){
……前面的一樣……
return view('page.page_pro', ['data'=>$data,'prev'=>$prev,'next'=>$next,'sums'=>$sums,'pp'=>$pp,'page'=>$page]);}
}
page.blade.php頁面:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="Js/jquery.min.js"></script>
</head>
<body>
<div id="box">
<!-- 第一部分 -->
<a href="javascript:void(0)" onclick="page(1)">首頁</a>
<a href="javascript:void(0)" onclick="page(<?php echo $prev ?>)">上一頁</a>
<a href="javascript:void(0)" onclick="page(<?php echo $next ?>)">下一頁</a>
<a href="javascript:void(0)" onclick="page(<?php echo $sums ?>)">尾頁</a><br />
<!-- 第二部分 -->
@foreach($pp as $key=>$val)
@if($val == $page)
{{$val}}
@else
<a href="javascript:void(0)" onclick="page({{$val}})">{{$val}}</a>
@endif
@endforeach
<!-- 表 -->
<table border="1" id="">
<tr>
<td>序號</td>
<td>名稱</td>
<td>時間</td>
</tr>
@foreach($data as $val)
<tr>
<td>{{$val->email_id}}</td>
<td>{{$val->email_name}}</td>
<td>{{$val->email_time}}</td>
</tr>
@endforeach
</table>
</div>
</body>
</html>
<script>
/*
@分頁
*/
function page(page){
$.ajax({
type:"get",
url:"page_pro",
data:{
page:page
},
success:function(msg){
if(msg){
$("#box").html(msg)
}
}
})
}
</script><span id="transmark" style="display: none; width: 0px; height: 0px;"></span>
page_pro.blade.php頁面(需要替換的html) 與“page.blade.php”中 div 包著的部分一樣

相關推薦

Laravel 5.1Ajax重新整理

ajax無重新整理分頁的優點: 1、區域性重新整理 減輕壓力 2、美觀 提高使用者體驗 php程式碼: /* @Laravel框架 @Ajax無重新整理分頁(簡單7步驟) */ public fu

laravelajax重新整理

ajax無重新整理分頁的優點: 1、區域性重新整理 減輕壓力 2、美觀 提高使用者體驗 php程式碼: /* @Laravel框架 @Ajax無重新整理分頁(簡單7步驟) */ public function page() { //1、查詢資料庫總條數 $count = count(Db::table(

淺談TP5的ajax重新整理

簡單說一下如何進行TP5的ajax無重新整理分頁吧,這個功能實現的方法有千百種,或許我提供的這一種並不是最好的,但確實是很實用的。 以下的例子會使用TP5自帶的分頁類來實現,無任何修改。 首先來一段後臺查詢資料的程式碼,查詢出相關的資料     $list = Load

關於Ajax重新整理技術的一些研究 c#

小弟新手,求大神有更好的解決方案,指教下~ 以前做專案,用過GridView的重新整理分頁,也用過EasyUI的封裝好的分頁技術,最近在老專案的基礎上加新功能,迫於需求,自己沒事琢磨了個Ajax無重新整理分頁技術, 也在百度看了下, 寫的都不是很系統,在這裡寫個系統的,簡單的,方便大家研究下。 系統支

jquery.page.js實現ajax重新整理

http://blog.csdn.net/dengboblog/article/details/52699332  寫程式碼參考了這位大神的部落格。下面貼上我的程式碼。 首先是要把引入的分頁js和css新增進來。這個程式碼自己百度吧。 $.ajax({ type

ajax重新整理實現 帶例項呦

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePat

Bootstrap V3.0 Ajax重新整理的實現 附程式碼

/** * Created by wangpai on 2015/11/3. */ var cnf_id = 0; var total=0; var tuple_num=15; var offset=0; var now=1; //pageAjax後更新now var pre=1; var next=1

tp5+ajax+jq實現重新整理

tp5框架裡面自帶有panigate()+rende()的方法可以超簡單的實現分頁,但是就是看著一直要重新整理很不爽,所以找了網上的好多程式碼,終於找到了一個邏輯簡單的無重新整理分頁,以下是我更改適合之後實現的效果 程式碼裡面有詳細註釋了,就不多說了,說明一下分頁查詢的原

ASP.NET+Ajax+JQuey+Json資料+儲存過程實現重新整理

<!--引入jquery-1.6.2--> <!--ShowPageData1.aspx頁面--> <script src="../Jquery/jquery-1.6.2.min.js" type="text/javascript">&l

javascript專案實戰---ajax實現重新整理

<?php class Pagination { private $total; //資料表中總記錄數 private $listRows; //每頁顯示行數 private $limit; //mysql 資料庫的limit private $uri; //分頁

asp.net Mvc4 使用ajax結合外掛實現重新整理

本文為在mvc4中使用ajax實現無重新整理分頁demo,記錄一下。 解決方案思想:頁面資料的初始載入和按頁載入都是通過ajax來進行,頁面分頁連結點選後利用ajax技術傳送當前頁碼到後端控制器,後端控制器根據當前頁碼和設定的pageSize從資料庫中取出對應頁的資料。

Ajax+php+jquery重新整理處理

日常醬油.....如下動圖:主要解決的問題如下:1.使用PDO連線資料庫2.PDO::query 執行SQL語句,返回PDOStatement物件,可以理解為結果集3.PDOStatement::fetchColumn 從結果集中的下一行返回單獨的一列 4.ceil()

asp.net mvc基於jQuery+Ajax實現重新整理

解決方案思想:頁面資料的初始載入和按頁載入都是通過ajax來進行,頁面分頁連結點選後利用ajax技術傳送當前頁碼到後端控制器,後端控制器根據當前頁碼和設定的pageSize從資料庫中取出對應頁的資料。後端控制器處理完後利用PartialView方法把資料返回到分部檢視中,利用

Jquery+ajax+PHP 基於thinkPHP的重新整理

var page_cur = 1; //當前頁 var total_num, page_size, page_total_num;//定義總記錄數,每頁條數,總頁數 function getData(page) { //獲取當前頁資料 var w = document.getElementById("

SSH三大框架的整合+利用Ajax實現重新整理

以下是我利用Struts2.3.24、Spring4.0、Hibernate4.2 結合Mysql資料庫進行的ssh整合,實現分頁需要json.js 首先ssh的整合需要匯入所有的jar包 在web.xml <?xml version="1.0" e

實現FreeMarker+Ajax重新整理

目前已經使用SpringBoot+MyBatis+PageHelper實現了物理分頁. 現在想通過Ajax實現FreeMarker的無重新整理分頁. 我的理解是最關鍵的地方在於如何替換FreeMarker中的標籤的值. 只要解決了這一點, 就可以輕鬆解決資料回顯和分頁出現的

Bootstrap Paginator外掛+ajax 實現動態重新整理

之前做分頁想過做淘寶的那個,但是因為是後臺要求不高,就Bootstrap Paginator外掛感覺還蠻容易上手,所以就選了它。 Bootstrap Paginator分頁外掛下載地址: 1.這是需要分頁的頁面放的 js函式: <span style="font-

分享一個自己寫的MVC EF 增刪改查 重新整理程式

分享一下我老師大神的人工智慧教程!零基礎,通俗易懂!http://blog.csdn.net/jiangjunshow 也歡迎大家轉載本篇文章。分享知識,造福人民,實現我們中華民族偉大復興!        

php 重新整理

首先看無重新整理分頁效果: (一) (二) 比較一二兩副圖可以看出,下面文字部分的翻頁了,但是整個頁面並沒有重新整理,視訊依然正常播放下去。 無重新整理的關鍵思路: 首頁,上一頁,下一頁,尾頁。點選時,呼叫onclick事件,然後跳轉到另外一張AJAX處理頁,同時傳入

jQuery 重新整理

   <html> <head>      <script type="text/javascript" src="script/jquery-1.7.1.min.js"></script>         <scrip