Read the first three articlesArticleShould have a preliminary understanding of the Asp.net web API, at least understand the encoding method of the web API. This article will share the pages in the web API. If you don't talk much about it, just pick up the hard goods.
The following content is all extensions in the previous article, so you can download the information you cannot find from the previous article.
First, add APIs that support paging.
Public Ienumerable <userinfo> getuserinfos ( Int Pageindex, Int Size)
{
Return Bll. Get (). Skip (pageindex- 1 ) * Size). Take (size );
}
Add a new page
Introduce JS
< Script SRC = "Scripts/jquery-1.7.1.min.js" Type = "Text/JavaScript" > </ Script >
< Script SRC = "Scripts/knockout-2.1.0.js" Type = "Text/JavaScript" > </ Script >
Compile an iterative data display template
< Ul Data-bind = "Template: {Name: 'userinfotemplate', foreach: userinfos }" >
</ Ul >
Ul is the data iteration container Template
< Script ID = "Userinfotemplate" Type = "Text/html" >
< Li class = " Userinfo " >
< Div class = " Info " >
< Strong > < Span data - Bind = " Text: Name " > < / Span> < / Strong >
< Span data - Bind = " Text: Age " > < / Span>
< / Div>
< / LI>
</ Script >
Script id = 'userinfotemplate' is the data item template.
Compile and retrieve the paging Operation Panel
< Fieldset >
< Label > The </ Label > < Input Type = "Text" ID = "Pageindex" /> < Label > Page </ Label > < BR />
< Label > Each </ Label > < Input Type = "Text" ID = "Pagesize" /> < Label > One page </ Label > < BR />
< Input Type = "Button" Value = "Get" ID = "Getbutton" />
</ Fieldset >
Start to compile JS and obtain it based on the input page number and the number of pages per page.
< Script Type = "Text/JavaScript" >
Viewmodel = {
Userinfos: KO. observablearray ([])
};
Ko. applybindings (viewmodel );
$ ( " # Getbutton " ). Click ( Function (){
Viewmodel. userinfos ([]);
VaR Pagesize = $ ( ' # Pagesize ' ). Val ();
VaR Pageindex = $ ( ' # Pageindex ' ). Val ();
VaR URL = " /API/userinfo? Pageindex = " + Pageindex + ' & Amp; size = ' + Pagesize;
$. Getjson (URL,Function(Data ){
//Obtain data by path
Viewmodel. userinfos (data );
});
Return False;
});
</Script>
The final running result gets the first page.
Obtain the first page.
Download the source code of this article:
/Files/risk/web API 4/mvcapplication1.rar