DNN常用控件总结

DNN常用控件总结

——DNN 学习

 

1. 1.    Calendar

一般属性配置：

<dnn:DnnCalendar ID="dcEvent" runat="server" CssClass="Calendar" Skin="Windows7"

                                AutoPostBack="true" DayNameFormat="Short" DefaultCellPadding="10" EnableMonthYearFastNavigation="true"

                                OtherMonthDayStyle-CssClass="otherDays" ShowOtherMonthsDays="true" ShowFastNavigationButtons="false"

                                OnDefaultViewChanged="calender_DefaultViewChanged" OnDayRender="calender_DayRender"

                                PresentationType="Preview">

</dnn:DnnCalendar>

 

特殊日期标记：

<SpecialDays>

<dnn:DnnCalendarDayRepeatable="Today"IsToday="true"Date=""ItemStyle-BackColor="Yellow"

                                        ItemStyle-CssClass="cellToday"ToolTip="Today">

    </dnn:DnnCalendarDay>

</SpecialDays>

 

通过编写ItemStyle-CssClass类的样式来把特殊日期进行标示出来。

 

1. 2.    Editor

一般属性配置：

<dnn:DnnEditor ID="ddeTermsM" runat="server" AllowScripts="true" StripFormattingOnPaste="All" ToolbarMode="Default" Width="100%" Visible="false" ImageManager-UploadPaths = "/Portals/0/Newsletter" ImageManager-EnableImageEditor="true" ImageManager-MaxUploadFileSize="1000000" ImageManager-ViewMode="Grid" ImageManager-ViewPaths="/Portals/0/Newsletter" />

 

属性说明：

ImageManager-EnableImageEditor="true"：启用图片管理。

ImageManager-ViewPaths="/Portals/0/Newsletter" /：图片管理默认路径。

ImageManager-MaxUploadFileSize="1000000"：允许上传图片的最大值（byte）。

 

1. 3.    Grid

Grid界面配置与结构

<dnn:DnnGrid ID="dgEvents" runat="server" OnNeedDataSource="dgEvents_NeedDataSource"

                CssClass="IRedeemGrid dgEvents" AutoGenerateColumns="false" AllowPaging="true"

                OnItemCreated="dgEvents_ItemCreated" OnUpdateCommand="dgEvents_UpdateCommand"

                OnInsertCommand="dgEvents_InsertCommand" OnDeleteCommand="dgEvents_DeleteCommand"

                EditItemStyle-CssClass="dgEventsEdit" OnDetailTableDataBind="dgEvents_DetailTableDataBind">

                <MasterTableView EditMode="EditForms" CommandItemDisplay="Bottom" InsertItemDisplay="Bottom"

                    DataKeyNames="Id" EditFormSettings-EditColumn-CancelText="Cancel" EditFormSettings-EditColumn-ButtonType="ImageButton"

                    EditFormSettings-EditColumn-ItemStyle-CssClass="dgEventsEdit" CommandItemSettings-ShowRefreshButton="false"

                    CommandItemSettings-AddNewRecordText="Add New Event" ExpandCollapseColumn-ButtonType="SpriteButton"

                    ExpandCollapseColumn-Display="true" ExpandCollapseColumn-Visible="false">

                    <Columns>

                       

                    </Columns>

                    <DetailTables>

                        <dnn:DnnGridTableView DataKeyNames="Id" Name="EventDateTime" EditMode="InPlace" CommandItemDisplay="Bottom"

                            AllowPaging="true" InsertItemDisplay="Bottom" CommandItemSettings-ShowRefreshButton="false"

                            CommandItemSettings-AddNewRecordText="Add Date & Time">

                            <Columns>

                               

                            </Columns>

                        </dnn:DnnGridTableView>

                    </DetailTables>

                </MasterTableView>

            </dnn:DnnGrid>

 

1. 属性说明：

AutoGenerateColumns: 允许自动生成列表。

AllowPaging：允许分页。

EditFormSettings-EditColumn-ButtonType：button显示类型。

CommandItemDisplay：命令栏显示位置。

MasterTableView： 主表

DetailTables： 从表

1. 常用函数方法：

1)       OnNeedDataSource="dgEvents_NeedDataSource"

数据绑定

protected void dgEvents_NeedDataSource(object sender, EventArgs e)

        {

           

        }

 

2)       OnItemCreated="dgEvents_ItemCreated"

列表创建

protected void dgEvents_ItemCreated(object sender, GridItemEventArgs e)

        {

            if (e.Item is GridEditableItem && e.Item.IsInEditMode)

            {

                    var iredeemEvent = e.Item.DataItem as IRedeemEvent;

            }

}

在ItemCreated事件中，能够将绑定到该行的数据还原成数据源实体进行数据操作:

var iredeemEvent = e.Item.DataItem as IRedeemEvent;

 

3)       OnUpdateCommand="dgEvents_UpdateCommand"

数据更新事件

protected void dgEvents_UpdateCommand(object source, GridCommandEventArgs e)

        {

            if (e.CommandArgument.ToString() == "SaveDetailTable")

            {

               

            }

            else

            {

               

            }

        }

        当有主从表时，需要判断数据更新是否为从表的数据更新：

        if (e.CommandArgument.ToString() == "SaveDetailTable")

 

4)       OnInsertCommand="dgEvents_InsertCommand"

数据插入事件

protected void dgEvents_InsertCommand(object source, GridCommandEventArgs e)

       {

}

 

5)       OnDeleteCommand="dgEvents_DeleteCommand"

数据删除事件

protected void dgEvents_DeleteCommand(object source, GridCommandEventArgs e)

{

 if (e.CommandArgument.ToString() == "DeleteDetailTable")

 {

 }

 else

 {

Var eventId =

editedItem.OwnerTableView.DataKeyValues[e.Item.ItemIndex]["Id"].ToString();

}

当有主从表时，需要判断数据更新是否为从表的数据删除：

if (e.CommandArgument.ToString() == "DeleteDetailTable")

 

当要进行数据删除时，我们往往需要找到删除该数据的主键：

前台：DataKeyNames="Id"

后台：Var eventId =

editedItem.OwnerTableView.DataKeyValues[e.Item.ItemIndex]["Id"].ToString();

 

1. Grid 有用方法。

protected void dgInvoices_ItemCommand(object sender, GridCommandEventArgs e)

{

if (e.CommandName == "Edit")

{

     dgInvoices.MasterTableView.IsItemInserted = false;

}

if (e.CommandName == "InitInsert")

{

dgInvoices.EditIndexes.Clear();

}

}

 

当在点击编辑修改按钮时，关闭新增数据表格：

dgInvoices.MasterTableView.IsItemInserted = false;

 

当在点击添加新数据时，关闭打开的编辑数据行：

dgInvoices.EditIndexes.Clear();

 

1. 4.    ListView

常用界面配置

<dnn:DnnListView ID="dlvMyPoints" runat="server" PageSize="1" AllowPaging="true"

                                ItemPlaceholderID="MyPointsPlaceHolder" OnNeedDataSource="DlvMyPointsNeedDataSource">

                                <LayoutTemplate>

                                    <div id="myPointsContent">

                                        <asp:Panel runat="server" ID="MyPointsPlaceHolder">

                                        </asp:Panel>

                                        <div class="clear_float">

                                        </div>

                                    </div>

                                    <dnn:DnnDataPager ID="ddpMyPoints" runat="server" PageSize="30">

                                        <Fields>

                                            <dnn:DnnDataPagerButtonField FieldType="Numeric" />

                                            <dnn:DnnDataPagerTemplatePageField>

                                                <PagerTemplate>

                                                    <div>

                                                        <b>Showing

                                                            <asp:Label runat="server" ID="CurrentPageLabel" Text="<%# Container.Owner.StartRowIndex+1%>" />

                                                            -

                                                            <asp:Label runat="server" ID="TotalPagesLabel" Text="<%# Container.Owner.TotalRowCount > (Container.Owner.StartRowIndex+Container.Owner.PageSize) ? Container.Owner.StartRowIndex+Container.Owner.PageSize : Container.Owner.TotalRowCount %>" />

                                                            of

                                                            <asp:Label runat="server" ID="TotalItemsLabel" Text="<%# Container.Owner.TotalRowCount%>" />

                                                            items

                                                            <br />

                                                        </b>

                                                    </div>

                                                </PagerTemplate>

                                            </dnn:DnnDataPagerTemplatePageField>

                                        </Fields>

                                    </dnn:DnnDataPager>

                                </LayoutTemplate>

                                <EmptyDataTemplate>

 

                                </EmptyDataTemplate>

                                <ItemTemplate>

 

                                </ItemTemplate>

                            </dnn:DnnListView>

 

1)       ItemTemplate

数据显示模板

2)       EmptyDataTemplate

当数据源为空时，界面上显示内容的模板

3)       LayoutTemplate

当有数据源时，ListView内容显示模板。

有时候在模板中可以灵和添加许多额外的数据显示信息，使显示内容更丰富。

在LayoutTemplate中，往往使用DataPager控件配合ListView控件使用，来实现数据分页的功能。

1. 5.    TabStrip

常用界面属性配置

<div id="LearnMoreDiv">

                <dnn:DnnTabStrip ID="dtsLearnMore" runat="server" MultiPageID="dmpLearnMore">

                    <TabTemplate>

                       

                    </TabTemplate>

                </dnn:DnnTabStrip>

            </div>

            <dnn:DnnMultiPage ID="dmpLearnMore" runat="server">

                <dnn:DnnPageView TabIndex="0" runat="server">

                    <div id="FAQContent">

                        <dnn:DnnTabStrip ID="dtsFAQ" runat="server">

                            <TabTemplate>

                               

                            </TabTemplate>

                        </dnn:DnnTabStrip>

                    </div>

                </dnn:DnnPageView>

                <dnn:DnnPageView TabIndex="1" runat="server">

                    <div id="YourAccountContent">

                        <dnn:DnnTabStrip ID="dtsYourAccount" runat="server">

                            <TabTemplate>

                               

                            </TabTemplate>

                        </dnn:DnnTabStrip>

                    </div>

                </dnn:DnnPageView>

                <dnn:DnnPageView TabIndex="2" runat="server">

                   

                </dnn:DnnPageView>

            </dnn:DnnMultiPage>

 

TabStrip控件往往需要与MultiPage控件联合使用，达到tab间切换进行数据的分类显示。

 

TabStrip控件与MutiPage关联属性：MultiPageID="dmpLearnMore"

 

MultiPage控件的Page与TabStrip控件的Tab相关联的属性：

TabStrip: PageViewID=" "

MutiPage: TabIndex=””

转载于:https://www.cnblogs.com/perfectlife/archive/2013/01/20/2868907.html