老高哥

每天进步一点点...
  博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

DevExpress ASPxGridView 使用文档二:列

Posted on 2010-09-20 10:14  老高哥  阅读(3066)  评论(1编辑  收藏  举报

转载请注明出处:http://surfsky.cnblogs.com/

---------------------------------------------------------
-- ASPxGridView 列
---------------------------------------------------------
基本列(GridViewDataColumn)
    <dxwgv:GridViewDataColumn FieldName="Country" VisibleIndex="5" />

其他列
    <dx:GridViewDataTextColumn />          : 文本列
    <dx:GridViewDataMemoColumn />          : 长文本列
    <dx:GridViewDataImageColumn />         : 图像列
    <dx:GridViewDataBinaryImageColumn />   : 二进制图像列
    <dx:GridViewDataDateColumn />          : 日期列
    <dx:GridViewDataTimeEditColumn />      : 时间列
    <dx:GridViewDataComboBoxColumn />      : 组合框列
    <dx:GridViewDataDropDownEditColumn />  : 下拉框编辑列?
    <dx:GridViewCommandColumn />           : 命令按钮列
    <dx:GridViewDataButtonEditColumn />    : 编辑按钮列?
    <dx:GridViewDataCheckColumn />         : 复选框列
    <dx:GridViewDataColorEditColumn />     : 色彩列
    <dx:GridViewDataHyperLinkColumn />     : 超链接列
    <dx:GridViewDataProgressBarColumn />   : 进度条列
    <dx:GridViewDataSpinEditColumn />      : SpinEdit列


长文本列(GridViewDataMemoColumn)
    编辑时展现为多行文本框
    <dx:GridViewDataMemoColumn  FieldName="ED_CMT" Caption="政企部核对结果"  
        EditCellStyle-BackColor="Yellow" 
        PropertiesMemoEdit-Rows="4" 
        EditFormSettings-ColumnSpan="2"  
        />

超链接列(GridViewDataHyperLinkColumn)
    <dx:GridViewDataHyperLinkColumn FieldName="ArticleId" Caption="查看"  >
         <PropertiesHyperLinkEdit Text="查看" TextFormatString="" />
    </dx:GridViewDataHyperLinkColumn>

组合框列(GridViewDataComboBoxColumn)
    <dx:ASPxGridView OnCellEditorInitialize="grid_CellEditorInitialize">
        <dxwgv:GridViewDataComboBoxColumn FieldName="City" VisibleIndex="2">
            <PropertiesComboBox EnableSynchronization="False" EnableIncrementalFiltering="True"  DropDownStyle="DropDown" />
        </dxwgv:GridViewDataComboBoxColumn>
    </dx:ASPxGridView>
    protected void grid_CellEditorInitialize(object sender, ASPxGridViewEditorEventArgs e) 
    {
        // 用下拉框展示国家下的所有城市
        if(grid.IsEditing && e.Column.FieldName != "City" && !grid.IsNewRowEditing)
        {
            ASPxComboBox combo = e.Editor as ASPxComboBox;
            string country = (string)grid.GetRowValuesByKeyValue(e.KeyValue, "Country");
            FillCityCombo(combo, country);
        }
    }

命令按钮列(GridViewCommandColumn)
    标准按钮
        <dx:ASPxGridView runat="server" KeyFieldName="ID" 
            OnRowDeleting="gv_RowDeleting" OnRowUpdating="gv_RowUpdating" OnRowInserting="gv_RowInserting"
            <Columns>
                <dxwgv:GridViewCommandColumn>
                    <EditButton   Visible="True" Text="修改" />
                    <DeleteButton Visible="true" Text="删除" />
                    <NewButton    Visible="True" Text="新建" />
                    <CancelButton Visible="true" Text="取消" />
                    <UpdateButton Visible="true" Text="保存" />
                    <ClearFilterButton Visible="true" Text="取消过滤" />
                </dxwgv:GridViewCommandColumn>
            </Columns>
        </dx:ASPxGridView>
        代码详见《ASPxGridView.DataBind》
    复选框列
        <dxwgv:GridViewCommandColumn ShowSelectCheckbox="True"/>
        <dxwgv:GridViewCommandColumn ShowSelectCheckbox="True">
             <HeaderTemplate>
                 <input type="checkbox" onclick="grid.SelectAllRowsOnPage(this.checked);" title="选择/放弃选择本页的所有行" />
             </HeaderTemplate>
             <HeaderStyle HorizontalAlign="Center" />
        </dxwgv:GridViewCommandColumn>
    自定义按钮
        “删除”按钮
            <dx:GridViewCommandColumn Caption="删除">
                <CustomButtons>
                    <dx:GridViewCommandColumnCustomButton ID="DeleteFile" Text="删除" />
                </CustomButtons>
            </dx:GridViewCommandColumn>
            protected void gv_CustomButtonCallback(object sender, ASPxGridViewCustomButtonCallbackEventArgs e)
            {
                if (e.ButtonID == "DeleteFile")
                {
                    long fileId = Convert.ToInt64(gv.GetRowValues(e.VisibleIndex, "FileId"));
                    string fileName = gv.GetRowValues(e.VisibleIndex, "FileName").ToString();
                    string filePath = Common.Config.Path.PhysicalUploadFolder + gv.GetRowValues(e.VisibleIndex, "FilePath").ToString();
                    System.IO.File.Delete(filePath);
                    using (DbFile db = new DbFile())
                        db.DelFile(fileId);
                    ShowData(this.FileBatchId);
                }
            }
        “复制行”按钮
            <dx:ASPxGridView runat="server" OnCustomButtonCallback="grid_CustomButtonCallback">
                <Columns>
                    <dxwgv:GridViewCommandColumn VisibleIndex="0">
                        <CustomButtons>
                            <dxwgv:GridViewCommandColumnCustomButton Text="复制行" ID="Copy" />
                        </CustomButtons>
                    </dxwgv:GridViewCommandColumn>
                </Columns>
            </dx:ASPxGridView>
            Hashtable copiedValues;
            protected void grid_CustomButtonCallback(object sender, ASPxGridViewCustomButtonCallbackEventArgs e) 
            {
                if(e.ButtonID == "Copy")
                {
                    copiedValues = new Hashtable();
                    foreach(string fieldName in copiedFields)
                        copiedValues[fieldName] = grid.GetRowValues(e.VisibleIndex, fieldName);
                    grid.AddNewRow();
                }
            }
            protected void grid_InitNewRow(object sender, DevExpress.Web.Data.ASPxDataInitNewRowEventArgs e) 
            {
                if(copiedValues != null)
                  foreach(string fieldName in copiedFields)
                      e.NewValues[fieldName] = copiedValues[fieldName];
            }


非绑定列(GridViewDataTextColumn)
    <dxwgv:GridViewDataTextColumn FieldName="Total" UnboundType="Decimal" />
    protected void grid_CustomUnboundColumnData(object sender, DevExpress.Web.ASPxGridView.ASPxGridViewColumnDataEventArgs e) 
    {
        // Total = UnitPrice * Quantity
        if(e.Column.FieldName == "Total") 
        {
            decimal price = (decimal)e.GetListSourceFieldValue("UnitPrice");
            int quantity = Convert.ToInt32(e.GetListSourceFieldValue("Quantity"));
            e.Value = price * quantity;
        }
    }

模板列(GridViewDataTextColumn)
    onhtmlrowcreated="grid_HtmlRowCreated" 
    <dxwgv:GridViewDataTextColumn Name="Percent" Caption="Change" FieldName="Change">
        <DataItemTemplate>
            <asp:Image ID="changeImage" runat="server" ImageUrl="~/Images/arGreen.gif" Visible="false" GenerateEmptyAlternateText="True" />
            <asp:Label ID="changePercent" runat="server" Text="" />
            <a href="javascript:void(0);" onclick="OnMoreInfoClick(this, '<%# Container.KeyValue %>')">更多...</a>
            <a href="../pages/download.ashx?path=../uploads/<%#Eval("FilePath")%>&name=<%#Eval("FileName") %> " >下载</a>
        </DataItemTemplate>
    </dxwgv:GridViewDataTextColumn>
    protected void grid_HtmlRowCreated(object sender, ASPxGridViewTableRowEventArgs e)
    {
        if (!grid.IsEditing && e.RowType == DevExpress.Web.ASPxGridView.GridViewRowType.Data)
        {
            // 操作 Label 控件
            Label label = grid.FindRowCellTemplateControl(e.VisibleIndex, null, "changePercent") as Label;
            decimal change = (decimal)grid.GetRowValues(e.VisibleIndex, "Change");
            label.Text = string.Format("{0:p}", change);
            // 操作 Image 控件
            System.Web.UI.WebControls.Image img = (System.Web.UI.WebControls.Image)grid.FindRowCellTemplateControl(e.VisibleIndex, null, "changeImage");
            img.Visible = false;
            if(change != 0) 
            {
                img.Visible = true;
                img.ImageUrl = change < 0 ? "~/Images/arRed.gif" : "~/Images/arGreen.gif";
                label.ForeColor = change < 0 ? Color.Red : Color.Green;
            }
        }
    }
    注:模板列中的事件如何写?手工写事件,如btn.OnClick += ...;
    注:视图模板请参考文档《ASPxGridView.Templates》

 

------------------------------------------
-- 定制窗口
------------------------------------------
定制窗口(CustomizationWindow)
    说明:一个小窗口,展示隐藏的列,可供用户选择,拖动到表格中就会显示,反之则隐藏
    展示定制窗口(隐藏列为Region)
        <dxwgv:ASPxGridView ID="grid" ClientInstanceName="grid" runat="server" KeyFieldName="CustomerID" >
            <Columns>
                <dxwgv:GridViewDataColumn FieldName="ContactName" />
                <dxwgv:GridViewDataColumn FieldName="CompanyName" />
                <dxwgv:GridViewDataColumn FieldName="City"  />
                <dxwgv:GridViewDataColumn FieldName="Region" Visible="false" />
                <dxwgv:GridViewDataColumn FieldName="Country" />
            </Columns>
            <SettingsCustomizationWindow Enabled="True"  />
            <ClientSideEvents CustomizationWindowCloseUp="grid_CustomizationWindowCloseUp" />
        </dxwgv:ASPxGridView>
    在客户端控制显隐定制窗口
        function button1_Click(s, e) {
            if(grid.IsCustomizationWindowVisible())
                grid.HideCustomizationWindow();
            else 
                grid.ShowCustomizationWindow();
            UpdateButtonText();    
        }
        function grid_CustomizationWindowCloseUp(s, e) {
            UpdateButtonText();
        }
        function UpdateButtonText() {
            var text = grid.IsCustomizationWindowVisible() ? "Hide" : "Show";
            text += " Customization Window";
            button1.SetText(text);
        }
    相关的 Client API:
        ShowCustomizationWindow() 
        HideCustomizationWindow() 
        IsCustomizationWindowVisible()