zoukankan      html  css  js  c++  java
  • PagingBulletedList

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

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

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

    <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>

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

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <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"));
            }

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

    <html xmlns="http://www.w3.org/1999/xhtml">
    <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>

    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

  • 相关阅读:
    Navicat 回复 psc 文件 Mysql
    android SDK 更新问题完美解决 http://dl-ssl.google.com refused
    利用android来赚钱
    苹果应用 Windows 申请 普通证书 和Push 证书 Hbuilder 个推(2)
    苹果应用 Windows 申请 普通证书 和Push 证书 Hbuilder 个推
    Java version 32转64位
    浅谈Jquery中的bind()、live()、delegate()、on()绑定事件方式
    JavaScript之深浅拷贝
    关于一道JS面试题的思考
    EasyUI-Tooltip(提示框)学习
  • 原文地址:https://www.cnblogs.com/astar/p/967985.html
Copyright © 2011-2022 走看看