• ReorderList


    ReorderList控件是一个多功能的可拖动的数据控件,类似于DataList,GridView,Repeater等数据控件。都可以绑定数据,并支持模板并允许自定义显示行即用户可以任意拖动行到其它位置。同时还支持客户端排序。

    属性列表:
    DataSourceID:绑定的数据源控件的ID
    DragHandleAlignment:可拖动控件显示的位置
    ItemInsertLocation:插入数据后数据的显示位置
    DataKeyField:数据源的主键
    SortOrderField:排序的字段
    AllowReorder:是否支持记录的拖动,如果已经设置了ReorderTemplate,此属性默认为TRUE.
    ItemTemplate:显示数据的模板
    ReorderTemplate:用户选择了拖动记录后的模板
    DragHandleTemplate:显示拖动位置的模板
    InsertItemTemplate:添加记录时的模板
    EmptyListTemplate:空记录时的模板
    PostbackOnReorder:页面是否回调,如果执行添加和删除操作时,此属性必须为enabled.


    实例解析一、实现数据的绑定和添加
    注意(数据表上ID必须是主键,必须提供排序字段TITLE。排序字段必须在EditItemTemplate模板中绑定。)

    <head runat="server">
        <title>无标题页</title>
        <style>
          .droptemplate{
            border:dashed thin black;
            100%;
            heigth:25px
          }
          .draghandle{
             10px;
             height:15px;
             background-color:Blue;
             cursor:move;
             border:outset thin white;
          }
          .item{
            margin-left:15px;
            font-family:Arial,Verdana,sans-serif;
            font-size:lem;
            text-align:left;
          }
        </style>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
            <asp:ScriptManager ID="ScriptManager1" runat="server">
            </asp:ScriptManager>
       
        </div>
            <cc1:ReorderList ID="ReorderList1" runat="server" AllowReorder="True" DataSourceID="SqlDataSource1"
                PostBackOnReorder="False" DataKeyField="id" SortOrderField="title">
                <ItemTemplate>
                  <div class="item"> <asp:Label ID="Label1" runat="server" Text='<%# Bind("id") %>'></asp:Label>
                  <asp:Label ID="Label2" runat="server" Text='<%# Bind("title") %>'></asp:Label></div>
                </ItemTemplate>
                <EditItemTemplate>
                  <div class="item"><asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("id") %>'></asp:TextBox>
                  <asp:TextBox ID="TextBox2" runat="server" Text='<%# Bind("title") %>'></asp:TextBox></div>
                </EditItemTemplate>
                <ReorderTemplate>
                  <asp:Panel ID="Panel1" runat="server" CssClass="droptemplate"></asp:Panel>
                </ReorderTemplate>
                <DragHandleTemplate>
                  <div class="draghandle"></div>
                </DragHandleTemplate>
                <InsertItemTemplate>
                  <div>
                    <asp:Panel ID="Panel2" runat="server" DefaultButton="Button1">
                       <asp:TextBox ID="TextBox4" runat="server" Text='<%# Bind("title") %>'></asp:TextBox>
                       <asp:Button ID="Button1" runat="server" CommandName="Insert" Text="add" />                
                    </asp:Panel>
                  </div>
                </InsertItemTemplate>
            </cc1:ReorderList>
            <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:myworkdataConnectionString %>"
                DeleteCommand="DELETE FROM [news] WHERE [id] = @id" InsertCommand="INSERT INTO [news] ([title]) VALUES (@title)"
                SelectCommand="SELECT [id], [title] FROM [news]" UpdateCommand="UPDATE [news] SET [title] = @title WHERE [id] = @id">
                <DeleteParameters>
                    <asp:Parameter Name="id" Type="Int32" />
                </DeleteParameters>
                <UpdateParameters>
                    <asp:Parameter Name="title" Type="String" />
                    <asp:Parameter Name="id" Type="Int32" />
                </UpdateParameters>
                <InsertParameters>
                    <asp:Parameter Name="title" Type="String" />
                </InsertParameters>
            </asp:SqlDataSource>
        </form>
    </body>

  • 相关阅读:
    20155239 2016-2017-2 《Java程序设计》第7周学习总结
    20155231 2016-2017-2 《Java程序设计》第4周学习总结
    20155231 2016-2017-2 《Java程序设计》第3周学习总结
    20155231 2016-2017-2 《Java程序设计》第2周学习总结
    20155231 2016-2017-2 《Java程序设计》第1周学习总结
    第三次预作业20155231邵煜楠:虚拟机上的Linux学习
    预备作业2:阅读心得(20155231邵煜楠)
    博客初体验:我期望的师生关系
    安装虚拟机
    20155227第二次预备作业
  • 原文地址:https://www.cnblogs.com/astar/p/967987.html
Copyright © 2020-2023  润新知