控件名:PagingBulletedListExtender
属性:
BehaviorID:该控件在客户端的标识号。
      TargetControlID:该控件要关联的BulletedList控件。
      ClientSort:该控件是否允许BulletedList在客户端进行排序。
      IndexSize:在BulletedList中索引项的字符个数。
      MaxItemPerPage:BulletedList中显示的每页的最大项数。
  

PagingBulletedList控件实现对BulletedList服务端控件进行扩展,使其具有索引、分页及排序的功能。

  • 控件适配器-初步
  • 控件适配器-更高级一点的适配器
  • 控件适配器-.browser
    文件

该控件用起来很简单,托一个BulletedList,然后在托一个PagingBulletedListExtender设置属性就ok了
效果图:澳门新葡萄京官网首页 1

属性列表:
   
TargetControlID:该扩展器目标BulletedList控件的ID,即将要被添加客户端索引、分页和排序功能的BulletedList的ID。
   
ClientSort:若该属性设置为true,那么目标BulletedList控件中的项将在客户端自动进行排序。
   
Height:目标BulletedList控件加上其上方的该扩展器控件添加的索引链接总高度。
    IndexSize:索引的长度,即索引中每一项所包含的字符数目。
    MaxItemPerPage:每一页的最大条目数。
    Separator:索引中项的分隔符。
    SelectIndexCssClass:被选中的索引将应用的CSS Class。
澳门新葡萄京官网首页,    UnselectIndexCssClass:未被选中的索引将应用的CSS Class。


澳门新葡萄京官网首页 2

实例解析一、显示动态列表内容的实例

在 ASP.NET 中 Label 控件在输出到客户端时是一个 span 控件,ListBox
输出到客户端时是一个 select 控件,BulletedList 输出到客户端时是一个 ul
控件……

 

<head runat=”server”>
    <title>PagingBulletedList</title>
    <style>
      .selected{
         font-weight:bolder;
         color:#335588;
         text-decoration:none;        
      }
      .unselected{
         font-weight:normal;
         text-decoration:underline;
      }
    </style>
</head>
<body>
    <form id=”form1″ runat=”server”>
    <div>
        <asp:ScriptManager ID=”ScriptManager1″
runat=”server”></asp:ScriptManager>   
    </div>
        <asp:BulletedList ID=”BulletedList1″ runat=”server”
DataSourceID=”SqlDataSource1″
            DataTextField=”title” DataValueField=”id”>
        </asp:BulletedList>
        <asp:SqlDataSource ID=”SqlDataSource1″ runat=”server”
ConnectionString=”<%$ ConnectionStrings:myworkdataConnectionString
%>”
            SelectCommand=”SELECT [id], [title] FROM
[news]”></asp:SqlDataSource>
        <cc1:PagingBulletedListExtender
ID=”PagingBulletedListExtender1″ runat=”server” ClientSort=”True”
            IndexSize=”2″ MaxItemPerPage=”3″
SelectIndexCssClass=”selected” Separator=”–“
            TargetControlID=”BulletedList1″
UnselectIndexCssClass=”unselected”>
        </cc1:PagingBulletedListExtender>
    </form>
</body>

也就是说 ASP.NET 的控件和 HTML
控件存在一定的联系,那么我可不可以更改这种联系呢?比如我要把 ASP.NET
中的 Label 控件与 HTML 中的 div 控件对应起来,可不可以呢?

 

实例解析二、简单使用功能
效果图:
 
1.前台UI
<%@ Page Language=”C#” %>

可以的,这就是本节要讨论的内容,我们以 BulletedList 为例,我们不希望
BulletedList 输出的是 ul 列表,而是一项一个段落 p
的形式,这里就不要讨论输出 ul 好还是输出 p 好。

 

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”
“;
<script runat=”server”>
    private static string[] m_javaScriptFunctionList = null;

首先

编程少年基地

    protected void Page_Load(object sender, EventArgs e)
    {
        if (m_javaScriptFunctionList == null)
        {
            m_javaScriptFunctionList =
System.IO.File.ReadAllLines(Server.MapPath(“~/App_Data/JavaScriptFunctions.txt”));
        }

我们要建立一个 class 放在 App_Code 文件夹中,这个类的作用就是重写
ASP.NET 控件到 HTML 控件的转换,该类代码如下:

http://www.bcsnjd.cn

        jsFuncList.DataSource = m_javaScriptFunctionList;
        jsFuncList.DataBind();
    }
</script>

using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls.Adapters;
 
 
namespace Cftea
{
    public class BulletedListAdapter : WebControlAdapter
    {
        protected override void RenderBeginTag(HtmlTextWriter writer)
        {
            //base.RenderBeginTag(writer);
        }

<html xmlns=”;
<head id=”Head1″ runat=”server”>
    <title>PagingBulletedList Demo</title>
    <link href=”StyleSheet.css” rel=”stylesheet” type=”text/css”
/>
    <style type=”text/css”>
        .selectIndex
        {
            color: #000;
            font-weight: bold;
            text-decoration: none;
        }
        .unselectIndex
        {
            color: blue;
        }
    </style>
</head>
<body>
    <form id=”form1″ runat=”server”>
        <asp:ScriptManager ID=”sm” runat=”server”>
        </asp:ScriptManager>
        <asp:BulletedList ID=”jsFuncList” runat=”server”>
        </asp:BulletedList>
        <ajaxToolkit:PagingBulletedListExtender ID=”pble”
TargetControlID=”jsFuncList” ClientSort=”true”
            Height=”300″ IndexSize=”1″ Separator=” – ”
SelectIndexCssClass=”selectIndex”
            UnselectIndexCssClass=”unselectIndex” runat=”server” />
    </form>
</body>

        protected override void RenderContents(HtmlTextWriter writer)
        {
            BulletedList bl = Control as BulletedList;
            if (bl != null)
            {
                int i = 0;
                for (i = 0; i < bl.Items.Count; i++)
                {
                    writer.WriteBeginTag(“p”);
                    writer.Write(HtmlTextWriter.TagRightChar);
                    writer.Write(bl.Items[i].Text);
                    writer.WriteEndTag(“p”);
                }
            }

2.JavaScriptFunctions.txt
abs
acos
action
alert
alinkColor
anchor
anchor (anchors array)
anchors
appCodeName
appName
appVersion
asin
atan
back
bgColor
big
blink
blur
bold
button
ceil
charAt
checkbox
checked
clear
clearTimeout
click
close (document)
close (window)
confirm
cookie
cos
Date
defaultChecked
defaultSelected
defaultStatus
defaultValue
document
E
elements array
elements
encoding
escape
eval
exp
fgColor
fixed
floor
focus
fontcolor
fontsize
form (forms array)
forms
forward
frame (frames array)
frames
getDate
getDay
getHours
getMinutes
getMonth
getSeconds
getTime
getTimezoneOffset
getYear
go
hash
hidden
history
host
hostname
href
index
indexOf
isNaN
italics
lastIndexOf
lastModified
length
link
link (links array)
linkColor
links
LN2
LN10
location
location
log
LOG2E
LOG10E
Math
max
method
min
name
navigator
onBlur
onChange
onClick
onFocus
onLoad
onMouseOver
onSelect
onSubmit
onUnload
open (document)
open (window)
options
parent
parse
parseFloat
parseInt
password
pathname
PI
port
pow
prompt
protocol
radio
random
referrer
reset
round
search
select
select (options array)
selected
selectedIndex
self
setDate
setHours
setMinutes
setMonth
setSeconds
setTime
setTimeout
setYear
sin
small
sqrt
SQRT1_2
SQRT2
status
strike
string
sub
submit
submit
substring
sup
tan
target
text
text
textarea
title
toGMTString
toLocaleString
toLowerCase
top
toUpperCase
unescape
userAgent
UTC
value
vlinkColor
window
window
write
writeln

            //base.RenderContents(writer);
        }

        protected override void RenderEndTag(HtmlTextWriter writer)
        {
            //base.RenderEndTag(writer);
        }
    }
}

  • 类名随便起,但该类要继承于 WebControlAdapter,WebControlAdapter
    的名称空间是 System.Web.UI.WebControls.Adapters。
  • 重载三个函数:RenderBeginTag,RenderContents,RenderEndTag。
  • 由于我们要全部重写 BulletedList
    的输出,所以要在这三个函数中去掉对父类的调用,即程序中注释掉的部分。
  • p 和 ul 不一样,p 是一个项目一个,而 ul 下一级还需要
    li,所以我们只需要在 RenderContents 中增加内容。
  • BulletedList bl = Control as BulletedList; as
    用于在兼容的引用类型之间执行转换,详情参见 MSDN 的
    as(C#).aspx),Control
    也即要转换的控件。
  • writer.WriteBeginTag(“p”); 写开始标签,自动添加“<”。
  • writer.Write(HtmlTextWriter.TagRightChar); 写“>”,由于
    WriteBeginTag 不会自动添加“>”,所以这里要手动写“>”。
  • writer.Write(bl.Items[i].Text); 写每一个 item 的文字。
  • writer.WriteEndTag(“p”); 写结束标签,自动添加“<”和“>”。

然后

重载类已经写好了,放在 App_Code 目录下,但还需要进一步设置才有效。

新建一个 App_Browsers 文件夹,再新建一个 browser
文件,同样文件名并不重要(似乎放在 ASP.NET
文件夹(诸如:App_Browsers、App_Code、App_Themes、bin)下面的文件,其文件名都不重要,重要的是标识、ID、名称空间,并且
ASP.NET 会自动查找、自动更新,应用起来方便得不得了。)

browser 文件的代码如下:

<browsers>
    <browser refID=”Default”>
        <controlAdapters>
            <adapter
controlType=”System.Web.UI.WebControls.BulletedList”
                    
adapterType=”Cftea.BulletedListAdapter”></adapter>
        </controlAdapters>
    </browser>
</browsers>

  • <browser refID=”Default”> refID=”Default”
    表示对于所有的浏览器都应用其 controlAdapters。
  • adapter 的 controlType 表示要转换哪一类控件。
  • adapter 的 adapterType 格式为“名称空间 + 类名”,表示 controlType
    交由 adapterType 指示的类处理。

完成

此时我们再在 .aspx 中添加一个 BulletedList,输出时,就不再是 ul,而是 p
了。

利用适配器,我们可以把 ASP.NET 的控件映射到 HTML
中的某一类控件,也可以映射到一类我们自己设计的“控件”,比如带选择框的下拉列表框。

我们还将在后面的连载中具体讲解本节步骤的两点内容,尤其是第二点,可以根据不同的浏览器对控件进行不同的转换。

说明

上面 WriteBeginTag 更好的做法是使用 RenderBeginTag;而 “p” 也使用
HtmlTextWriterTag.P;WriteEndTag(“p”) 使用 RenderEndTag() 自动匹配。

  • 控件适配器-初步
  • 控件适配器-更高级一点的适配器
  • 控件适配器-.browser
    文件