Dynamic Setting ImageUrl In DataPager

本文目的：动态设置DataPager控件中页码的图片。

使用ListView+DataPager进行绑定数据时，遇到的一个问题？

      当使用DataPager时，NextPreviousPagerField有三个ButtonType 类型（Button\Image\Link），当使用ButtonType=Image时，会涉及做切换图片的问题？

        ps. 为什么要切换图片显示呢？是因为翻页时，如果翻到最后一页时，切换一张无效的图片，让用户感觉到已经不能再点击了。

那在程序中如何动态切换图片呢？

         早先，我一直以为使用DataPager自身的事件就可以搞定，玩了半天DataPager----OnDataBinding、OnInit、OnPreRender都是不可以了；

虽然其中OnInit、OnPreRender是可以动态改变图片的，但是在这个事件中无法取当数据的页码值，（就是不知道用户翻到几页了，是最后一页还是第一页）。

         其实，实现这个需求也蛮简单的，直接使用ListView中OnDataBinding事件就可以实现动态加载不同状态的图片了。

            （说白了DataPager还是围绕着ListView工作的，毕竟DataPager中PageControlID=ListViewID的）

　　最后

附上代码

Page:

<form id="form1" runat="server">
    <asp:ListView ID="ProductList" runat="server" OnDataBinding="ProductList_DataBinding"
        OnPagePropertiesChanging="ProductList_PagePropertiesChanging">
        <ItemTemplate>
            <%#Eval ( "Test" )%>
        </ItemTemplate>
    </asp:ListView>
    <br />
    <asp:DataPager ID="dpHotelInfoList" runat="server" PagedControlID="ProductList" PageSize="5">
        <Fields>
            <asp:NextPreviousPagerField ButtonType="Image" ShowFirstPageButton="true" ShowLastPageButton="true" />
        </Fields>
    </asp:DataPager>
    </form>


 

CodeFile:

/// <summary>
    /// Page_Load
    /// </summary>
    /// <param name="sender"></param>
    /// <param name="e"></param>
    protected void Page_Load ( object sender , EventArgs e ) {
        if ( !IsPostBack ) {
            //创建数据源
            var dataSource = new List<TestList> ();
            for ( int i = 0 ; i < 71 ; i++ ) {
                dataSource.Add ( new TestList () { Test=i } );
            }
            ViewState.Add ( "db" , dataSource );
            DBList = ViewState ["db"] as List<TestList>;

            //绑定数据到ListView
            ProductList.DataSource = DBList;
            ProductList.DataBind ();
        }
    }
    /// <summary>
    /// PagePropertiesChanging
    /// </summary>
    /// <param name="sender"></param>
    /// <param name="e"></param>
    protected void ProductList_PagePropertiesChanging ( object sender , PagePropertiesChangingEventArgs e ) {
        //设置页码
        dpHotelInfoList.SetPageProperties ( e.StartRowIndex , e.MaximumRows , false );

        //绑定数据到ListView
        ProductList.DataSource = DBList;
        ProductList.DataBind ();
    }

    /// <summary>
    /// 动态切换页码图片
    /// </summary>
    /// <param name="sender"></param>
    /// <param name="e"></param>
    protected void ProductList_DataBinding ( object sender , EventArgs e ) {
        //获取当前PageSize
        var curPageSize = ( dpHotelInfoList.StartRowIndex / dpHotelInfoList.PageSize ) + 1;

        var np = dpHotelInfoList.Fields [0] as NextPreviousPagerField;

        //如果是最后一页
        if ( curPageSize == 15 ) {
            //设置末页、下一页按钮为失效状态图片
            np.FirstPageImageUrl = "~/Enabled.gif";
            np.PreviousPageImageUrl = "~/Enabled.gif";
            np.NextPageImageUrl = "~/disabled.gif";
            np.LastPageImageUrl = "~/disabled.gif";
        }
        else if ( curPageSize == 1 ) {
            //设置首页、上一页按钮为失效状态图片
            np.FirstPageImageUrl = "~/disabled.gif";
            np.PreviousPageImageUrl = "~/disabled.gif";
            np.NextPageImageUrl = "~/Enabled.gif";
            np.LastPageImageUrl =  "~/Enabled.gif";
        }
        else {
            //设置所有按钮都为有效状态图片
            np.FirstPageImageUrl = "~/Enabled.gif";
            np.PreviousPageImageUrl = "~/Enabled.gif";
            np.NextPageImageUrl = "~/Enabled.gif";
            np.LastPageImageUrl = "~/Enabled.gif";
        }
    }

    private List<TestList> dbList;
    public List<TestList> DBList {
        get { return ViewState ["db"] as List<TestList>; }
        set {
            dbList = value;
        }
    }
}

/// <summary>
/// 创建数据序列
/// </summary>
[Serializable]
public class TestList {
    public int Test { get; set; }
}

 

代码下载：DynamicSettingImageUrlInDataPager