您的位置:首页 > 产品设计 > UI/UE

SUI分页组件和avalon搞定ajax无刷新分页

2015-06-22 20:05 381 查看
<div ms-controller="main">
<h2 class="pagination-centered">{{ title }}</h2>
<form method="get" action="" class="sui-form" style="margin-bottom:5px;">
重量:<input class="input-medium" type="text" name="weight" value="@ViewBag.weight" id="weight" />
内容:<input class="input-medium" type="text" name="content" value="@ViewBag.content" id="content" />
解释:<input class="input-medium" type="text" name="intro" value="@ViewBag.intro" id="intro" />
每页:<input class="input-mini" type="text" name="pageSize" value="@ViewBag.pageSize" id="pageSize" />
<input class="sui-btn btn-medium btn-primary" type="submit" name="search" value="查询" id="search" />
</form>
<table class="sui-table table-zebra table-hover table-primary">
<thead>
<tr>
<th width="40">重量</th>
<th width="230">内容</th>
<th>解释</th>
</tr>

</thead>
<tbody>
<tr ms-repeat="datalist">
<td style="text-align:center;">{{ el.weight }}</td>
<td>{{ el.content | html }}</td>
<td>{{ el.intro | html }}</td>
</tr>

</tbody>

</table>

<div id="pager">

</div>

</div>

<script type="text/javascript">

$(function(){

var vm=avalon.define({
$id:"main",
title: "称骨算命",
datalist: [{"weight":"0","content":"内容","intro":"注解"}]
});

var loadData = function (pageIndex,pageSize,weight,content,intro) {
var itemsCount = 0;
$.getJSON("/home/getdata", { "page": pageIndex, "size": pageSize,"weight":weight,"content":content,"intro":intro }, function (data) {
itemsCount = data.total;
vm.datalist = data.rows;

$('#pager').pagination({
itemsCount: data.total,
pageSize: pageSize,
currentPage: pageIndex,
displayPage: 6,
displayInfoType: "itemsCount",
styleClass: ['pagination-large'],
showCtrl: true,
onSelect: function (num) {
loadData(num, pageSize, weight, content, intro);
}
});

});

};

loadData(1,$("#pageSize").val(),$("#weight").val(),$("#content").val(),$("#intro").val());

});

</script>


1、控制器

public ActionResult GetData(int page=1,int size=10,string weight="",string content="",string intro="")
{
int itemsCount = 0;
int pageSize = size;
int pageIndex = page;

string where = "1=1";
if (!string.IsNullOrEmpty(weight))
{
where += " and weight = '" + weight + "'";
}
if (!string.IsNullOrEmpty(content))
{
where += " and content like '%" + content + "%'";
}
if (!string.IsNullOrEmpty(intro))
{
where += " and intro like '%" + intro + "%'";
}

// List<chenggu> list = DBFast.Select<chenggu>(pageIndex, pageSize, where, out itemsCount);

using (MAction action = new MAction("chenggu"))
{
return Content(action.Select(pageIndex, pageSize, where, out itemsCount).ToJson());

}

//var data=new {Total=itemsCount,DataList=list};
//return Json( data, JsonRequestBehavior.AllowGet);
}


View:
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: