리피터 및 페이징 효과(ASP)에 대한 자세한 코드 설명
Repeater 컨트롤은 각 항목의 목록을 생성하고 템플릿을 사용하여 웹 페이지에서 각 항목의 레이아웃을 정의할 수 있는 데이터 바인딩 컨테이너 컨트롤입니다. 이 기사에서는 이에 대해 자세히 소개합니다. 아래 편집기를 사용하여 살펴보겠습니다
Repeater 컨트롤은 데이터 바인딩 컨테이너 컨트롤로 각 항목의 목록을 생성할 수 있으며 템플릿을 사용하여 각 항목의 내용을 정의할 수 있습니다. 웹페이지의 항목입니다. 페이지가 실행되면 컨트롤은 데이터 소스의 각 항목에 대해 이 레이아웃을 반복합니다.
템플릿과 함께 반복기 컨트롤 사용
반복기 컨트롤을 사용하려면 템플릿의 콘텐츠 레이아웃을 정의하는 템플릿을 생성해야 합니다. 제어. 템플릿에는 마크업과 컨트롤의 모든 조합이 포함될 수 있습니다. 템플릿이 정의되지 않았거나 템플릿에 요소가 포함되어 있지 않으면 애플리케이션이 실행될 때 컨트롤이 페이지에 표시되지 않습니다.
ItemTemplate: 데이터 소스의 각 데이터 항목에 대해 한 번 렌더링되는 HTML 요소와 컨트롤을 포함합니다.
AlternatingItemTemplate: 교대 데이터 항목 형식 지정(데이터 소스의 각 데이터 항목에 대해 한 번 렌더링할 HTML 요소 및 컨트롤이 포함되어 있습니다. 일반적으로 이 템플릿을 사용하여 교대 항목에 대한 다양한 모양을 만들 수 있습니다. 예를 들어 다음을 지정합니다. ItemTemplate에 지정된 색상과 다른 배경색)
SeparatorTemplate : 구분 기호(렌더링되는 각 항목 사이에 포함된 요소)의 형식을 지정합니다.
HeaderTemplate: 헤더 형식을 지정합니다(목록 시작 부분에 별도로 렌더링되는 텍스트와 컨트롤 포함).
FooterTemplate: 바닥글 형식을 지정합니다(목록 끝에 별도로 렌더링되는 텍스트와 컨트롤이 포함되어 있음).
리피터페이징효과는 다음과 같습니다.
프런트엔드 코드:
<body>
<asp:Repeater ID="Repeater1" runat="server">
<HeaderTemplate>
<p style="background-color:#988c6e;width:400px;padding-top:5px;padding-bottom:5px;margin-left:30px;margin-top:30px;border-radius:5px;color:#fff;font-weight:bold;"><span style="padding-left:30px;">用户名</span><span style="padding-left:100px;">注册时间</span><span style="padding-left:90px;">访问量</span></p>
<table style="margin-left:30px;margin-top:30px;">
</HeaderTemplate>
<ItemTemplate>
<tr>
<td style="width:120px;text-align:left; padding-left:20px;"><%#Eval("Username") %></td>
<td style="width:170px;text-align:left; "><%#Eval("RegistrationTime") %></td>
<td style="width:50px;text-align:left; "><%#Eval("AccessAmount") %></td>
</tr>
<tr>
<td colspan="3" style="border-bottom:1px inset #C0D9D9;padding-top:7px;"></td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
<p style="margin-left:50px;">
<p style="margin:0 auto; margin-top:50px;border:1px solid #fff;font-size:16px;font-family:"microsoft yahei","宋体";">
<a><p style="border:1px solid #000; width:60px; float:left; margin:5px;text-align:center;"><a style="color:#000">共<asp:Label runat ="server" ID="zong"> </asp:Label>页</a></p></a>
<a><p style="border:1px solid #000; width:60px; float:left;margin:5px;text-align:center;"><a style="color:#000">第<asp:Label runat ="server" ID="dangqian"> </asp:Label>页</a></p></a>
<a><p style="border:1px solid #000; width:40px; float:left;margin:5px;text-align:center;"> <a style="color:#000"><asp:hyperlink id="first" runat="server" style="color:#000">首页</asp:hyperlink></a></p></a>
<a><p style="border:1px solid #000; width:60px; float:left;margin:5px;text-align:center;"><a style="color:#000"><asp:hyperlink id="lnkPrev" runat="server" style="color:#000">上一页</asp:hyperlink></a></p></a>
<a><p style="border:1px solid #000; width:60px; float:left;margin:5px;text-align:center;"><a style="color:#000"><asp:hyperlink id="lnkNext" runat="server" style="color:#000">下一页</asp:hyperlink></a></p></a>
<a><p style="border:1px solid #000; width:40px; float:left;margin:5px;text-align:center;"> <a style="color:#000"><asp:hyperlink id="end" runat="server" style="color:#000">尾页</asp:hyperlink></a></p></a>
</p>
</p>
</body>백엔드 코드:
protected void Page_Load(object sender, EventArgs e)
{
if(!Page.IsPostBack)
{
getUsers();
}
}
private void getUsers()
{
List<Users1> list = new AdminManager().QueryUsers();
PagedDataSource pag = new PagedDataSource();
pag.AllowPaging = true;// 设置允许分页
pag.PageSize = 10; // 每页显示为3行
pag.DataSource = list; // 模板绑定数据源
zong.Text = pag.PageCount.ToString(); // 显示总共页数
int CurrentPage;
// 请求页码为不为null设置当前页，否则为第一页
if (Request.QueryString["Page"] != null)
{
CurrentPage = Convert.ToInt32(Request.QueryString["Page"]);
}
else
{
CurrentPage = 1;
}
if (Request.QueryString["PageSize"] != null)
{
pag.PageSize = Convert.ToInt32(Request.QueryString["PageSize"]);
}
else
{
pag.PageSize = 10;
}
pag.CurrentPageIndex = CurrentPage - 1; // 当前页所引为页码-1
dangqian.Text = CurrentPage.ToString(); // 当前页
if (!pag.IsFirstPage)
{
// Request.CurrentExecutionFilePath为当前请求虚拟路径
lnkPrev.NavigateUrl = Request.CurrentExecutionFilePath + "?Page=" + Convert.ToString(CurrentPage - 1);
}
// 如果不是最后一页，通过参数Page设置下一页为当前页+1，否则不显示连接
if (!pag.IsLastPage)
{
// Request.CurrentExecutionFilePath为当前请求虚拟路径
lnkNext.NavigateUrl = Request.CurrentExecutionFilePath + "?Page=" + Convert.ToString(CurrentPage + 1);
}
//首页
first.NavigateUrl = Request.CurrentExecutionFilePath + "?Page=" + Convert.ToString(1);
//尾页
end.NavigateUrl = Request.CurrentExecutionFilePath + "?page=" + pag.PageCount.ToString();
if (Convert.ToInt32(HttpContext.Current.Request["page"]) > pag.PageCount)
{
first.NavigateUrl = Request.CurrentExecutionFilePath + "?Page=" + Convert.ToString(1);
}
this.Repeater1.DataSource = pag;
this.Repeater1.DataBind();
}페이징이 필요하지 않은 경우 다음 코드를 실행할 수 있습니다.
protected void Page_Load(object sender, EventArgs e)
{
if(!Page.IsPostBack)
{
getUsers();
}
}
private void getUsers()
{
List<Users1> list = new AdminManager().QueryUsers();
this.Repeater1.DataSource = list ;
this.Repeater1.DataBind();
}[관련 추천]
2. ASP 튜토리얼
위 내용은 리피터 및 페이징 효과(ASP)에 대한 자세한 코드 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
핫 AI 도구
Undresser.AI Undress
사실적인 누드 사진을 만들기 위한 AI 기반 앱
AI Clothes Remover
사진에서 옷을 제거하는 온라인 AI 도구입니다.
Undress AI Tool
무료로 이미지를 벗다
Clothoff.io
AI 옷 제거제
Video Face Swap
완전히 무료인 AI 얼굴 교환 도구를 사용하여 모든 비디오의 얼굴을 쉽게 바꾸세요!
인기 기사
뜨거운 도구
메모장++7.3.1
사용하기 쉬운 무료 코드 편집기
SublimeText3 중국어 버전
중국어 버전, 사용하기 매우 쉽습니다.
스튜디오 13.0.1 보내기
강력한 PHP 통합 개발 환경
드림위버 CS6
시각적 웹 개발 도구
SublimeText3 Mac 버전
신 수준의 코드 편집 소프트웨어(SublimeText3)
뜨거운 주제
7677
15
1393
52
1207
24
91
11
73
19
PHP 개발: 테이블 데이터 정렬 및 페이징 기능 구현 방법
Sep 20, 2023 am 11:28 AM
PHP 개발: 테이블 데이터 정렬 및 페이징 기능 구현 방법 웹 개발에서는 대량의 데이터를 처리하는 것이 일반적인 작업입니다. 많은 양의 데이터를 표시해야 하는 테이블의 경우 일반적으로 좋은 사용자 경험을 제공하고 시스템 성능을 최적화하기 위해 데이터 정렬 및 페이징 기능을 구현해야 합니다. 이 기사에서는 PHP를 사용하여 테이블 데이터의 정렬 및 페이징 기능을 구현하는 방법을 소개하고 구체적인 코드 예제를 제공합니다. 정렬 기능은 테이블에 정렬 기능을 구현하여 사용자가 다양한 필드에 따라 오름차순 또는 내림차순으로 정렬할 수 있도록 합니다. 다음은 구현 형태이다
CakePHP에서 사용자 정의 페이지 매김을 만드는 방법은 무엇입니까?
Jun 04, 2023 am 08:32 AM
CakePHP는 개발자에게 많은 유용한 도구와 기능을 제공하는 강력한 PHP 프레임워크입니다. 그 중 하나는 페이지 매김입니다. 이를 통해 대량의 데이터를 여러 페이지로 나누어 검색과 조작을 더 쉽게 할 수 있습니다. 기본적으로 CakePHP는 몇 가지 기본적인 페이지 매김 방법을 제공하지만 때로는 사용자 정의 페이지 매김 방법을 만들어야 할 수도 있습니다. 이 기사에서는 CakePHP에서 사용자 정의 페이지 매김을 만드는 방법을 보여줍니다. 1단계: 사용자 정의 페이지 매김 클래스 생성 먼저 사용자 정의 페이지 매김 클래스를 생성해야 합니다. 이것
JavaScript를 사용하여 테이블 데이터의 페이징 표시 구현
Jun 16, 2023 am 10:00 AM
데이터가 계속해서 증가함에 따라 표 형식으로 표시하는 것이 더욱 어려워집니다. 대부분의 경우 테이블에 포함된 데이터의 양이 너무 많아 로드 속도가 느려지고 사용자는 원하는 데이터를 찾기 위해 끊임없이 페이지를 탐색해야 합니다. 이 기사에서는 JavaScript를 사용하여 테이블 데이터의 페이지 매김 표시를 구현하여 사용자가 원하는 데이터를 더 쉽게 찾을 수 있는 방법을 소개합니다. 1. 동적으로 테이블을 생성합니다. 페이징 기능을 보다 쉽게 제어하려면 테이블을 동적으로 생성해야 합니다. HTML 페이지에서 아래와 유사한 테이블 요소를 추가합니다.
JavaScript를 사용하여 테이블 페이징 기능을 구현하는 방법은 무엇입니까?
Oct 20, 2023 pm 06:19 PM
JavaScript를 사용하여 테이블 페이징 기능을 구현하는 방법은 무엇입니까? 인터넷이 발달하면서 점점 더 많은 웹사이트에서 데이터를 표시하기 위해 테이블을 사용하고 있습니다. 데이터 양이 많은 경우에는 사용자 경험을 개선하기 위해 데이터를 페이지에 표시해야 합니다. 이 기사에서는 JavaScript를 사용하여 테이블 페이징 기능을 구현하는 방법을 소개하고 구체적인 코드 예제를 제공합니다. 1. HTML 구조 먼저 테이블과 페이징 버튼을 호스팅할 HTML 구조를 준비해야 합니다. <tab을 사용할 수 있습니다.
MyBatis 페이징 플러그인의 원리에 대한 자세한 설명
Feb 22, 2024 pm 03:42 PM
MyBatis는 XML과 주석을 기반으로 하는 뛰어난 지속성 레이어 프레임워크입니다. 또한 간단하고 사용하기 쉬운 플러그인 메커니즘도 제공합니다. 그 중 페이징 플러그인은 가장 많이 사용되는 플러그인 중 하나입니다. 이 기사에서는 MyBatis 페이징 플러그인의 원리를 자세히 살펴보고 특정 코드 예제를 통해 설명합니다. 1. 페이징 플러그인 원리 MyBatis 자체는 기본 페이징 기능을 제공하지 않지만 플러그인을 사용하여 페이징 쿼리를 구현할 수 있습니다. 페이징 플러그인의 원리는 주로 MyBatis를 가로채는 것입니다.
Layui를 사용하여 페이징 기능이 있는 데이터 표시 페이지를 개발하는 방법
Oct 24, 2023 pm 01:10 PM
Layui를 사용하여 페이징 기능이 포함된 데이터 표시 페이지를 개발하는 방법 Layui는 간단하고 아름다운 인터페이스 구성 요소와 풍부한 대화형 경험을 제공하는 경량 프런트 엔드 UI 프레임워크입니다. 개발 중에 우리는 많은 양의 데이터를 표시하고 페이징을 수행해야 하는 상황에 자주 직면합니다. 다음은 Layui를 이용하여 개발한 페이징 기능이 포함된 데이터 표시 페이지의 예입니다. 먼저 Layui 관련 파일과 종속성을 소개해야 합니다. HTML 페이지의 <head> 태그에 다음 코드를 추가하세요.
Vue 구성요소 실습: 페이징 구성요소 개발
Nov 24, 2023 am 08:56 AM
Vue 컴포넌트 실습: 페이징 컴포넌트 개발 소개 웹 애플리케이션에서 페이징 기능은 필수 컴포넌트입니다. 좋은 페이지 매김 구성 요소는 표현이 간단하고 명확해야 하며, 기능이 풍부하고, 통합 및 사용이 쉬워야 합니다. 이 기사에서는 Vue.js 프레임워크를 사용하여 고도로 사용자 정의 가능한 페이징 구성 요소를 개발하는 방법을 소개합니다. Vue 컴포넌트를 활용하여 개발하는 방법을 코드 예시를 통해 자세히 설명하겠습니다. 기술 스택 Vue.js2.xJavaScript(ES6) HTML5 및 CSS3 개발 환경
Vue 기술 개발에서 페이징 기능을 구현하는 방법
Oct 09, 2023 am 09:06 AM
Vue는 사용자 인터페이스 구축에 널리 사용되는 JavaScript 프레임워크입니다. Vue 기술 개발에서 페이징 기능 구현은 일반적인 요구 사항입니다. 이 기사에서는 Vue를 사용하여 페이징 기능을 구현하는 방법을 소개하고 구체적인 코드 예제를 제공합니다. 시작하기 전에 몇 가지 기본 지식을 미리 준비해야 합니다. 먼저 Vue의 기본 개념과 구문을 이해해야 합니다. 둘째, Vue 구성 요소를 사용하여 애플리케이션을 구축하는 방법을 알아야 합니다. 시작하기 전에 Vue 프로젝트에 페이징 플러그인을 설치해야 합니다.
