1、控制元件功能
列表控制元件展示資料、彈框控制元件執行編輯操作、Tab控制元件實現多標籤編輯操官方說明
2、官方示例
列表控制元件展示資料、彈框控制元件執行編輯操作、Tab控制元件實現多標籤編輯操官方說明
2、官方示例
3、使用說明
3.1 aspx頁面說明
3.1 aspx頁面說明
<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="DemoGridView.aspx.cs" Inherits="Demo_DemoGridView" %> <asp:Content ID="Content1" ContentPlaceHolderID="cphJs" runat="Server"> <script type="text/javascript"> var key = "Id"; function Menu_Click(s, e) { if (e.item.name == "add") { grid.AddNewRow(); } } //自定義命令 function CustomButtonClick(s, e) { var value = s.GetRowKey(e.visibleIndex); AddCollection(key, value); if (e.buttonID == "SetPasswordButton") { //如果點選的是【重置密碼】連結，則開啟 PopupSetPassword.Show(); } } function SetPasswordClick(s, e) { if (true) { PopupSetPassword.PerformCallback(txtPwd.GetText()); //觸發後臺事件，並傳引數 } else { alert("兩次密碼不一致！"); } } //鍵值對，和伺服器端通訊 function AddCollection(key, value) { if (HiddenField.Get(key) == null) { HiddenField.Add(key, value); } else { HiddenField.Set(key, value); } } function PopupSetPassword_endCallback(s, e) { PopupSetPassword.Hide(); Toast.Show(s.cp_retValue); } //省市縣 var lastCountry = null; var lastCity = null; function OnCountryChanged(cmbCountry) { if (grid.GetEditor("CityCode").InCallback()) lastCountry = cmbCountry.GetValue().toString(); else { lastCountry = cmbCountry.GetValue().toString(); //觸發後臺的grid_CellEditorInitialize事件，重新繫結省市縣資訊 grid.GetEditor("CityCode").PerformCallback(cmbCountry.GetValue().toString()); grid.GetEditor("TownCode").PerformCallback(lastCountry + "," + lastCity); } } function OnCityChanged(cmbCity) { //Returns a value that determines whether a callback request sent by a web control is being currently processed on the server side. if (grid.GetEditor("TownCode").InCallback()) lastCity = cmbCity.GetValue().toString(); else { //觸發onchagne事件 grid.GetEditor("TownCode").PerformCallback(lastCountry + "," + cmbCity.GetValue().toString()); } } </script> </asp:Content> <asp:Content ID="Content2" ContentPlaceHolderID="c1" runat="Server"> </asp:Content> <asp:Content ID="Content3" ContentPlaceHolderID="c2" runat="Server"> <dx:ASPxGridView runat="server" ID="grid" Width="100%" ClientInstanceName="grid" KeyFieldName="Id" OnRowInserting="grid_RowInserting" OnRowDeleting="grid_RowDeleting" OnRowUpdating="grid_RowUpdating" AutoGenerateColumns="False" OnHtmlEditFormCreated="grid_HtmlEditFormCreated" OnCellEditorInitialize="grid_CellEditorInitialize"> <ClientSideEvents CustomButtonClick="CustomButtonClick" /> <Columns> <dx:GridViewDataTextColumn FieldName="TrueName" Caption="真實姓名" VisibleIndex="3"> </dx:GridViewDataTextColumn> <dx:GridViewDataTextColumn FieldName="EnterpriseName" Caption="企業" VisibleIndex="1"> <%--新增、編輯窗體不顯示該列--%> <EditFormSettings Visible="False" /> </dx:GridViewDataTextColumn> <dx:GridViewDataComboBoxColumn FieldName="UserTypeName" VisibleIndex="3" Caption="使用者型別"> <EditFormSettings Visible="False" /> </dx:GridViewDataComboBoxColumn> <%--該列在列表窗體不顯示--%> <dx:GridViewDataTextColumn FieldName="Tel" VisibleIndex="6" Caption="電話" Visible="false"> <EditFormSettings Visible="True" /> </dx:GridViewDataTextColumn> <%--省市縣聯動--%> <dx:GridViewDataComboBoxColumn FieldName="ProvinceCode" VisibleIndex="11" Caption="省編碼" Visible="false"> <EditFormSettings Visible="True" /> <PropertiesComboBox> <ClientSideEvents SelectedIndexChanged="function(s, e) { OnCountryChanged(s); }"> </ClientSideEvents> </PropertiesComboBox> </dx:GridViewDataComboBoxColumn> <dx:GridViewDataComboBoxColumn FieldName="CityCode" VisibleIndex="12" Caption="市編碼" Visible="false"> <EditFormSettings Visible="True" /> <PropertiesComboBox> <ClientSideEvents SelectedIndexChanged="function(s, e) { OnCityChanged(s); }"></ClientSideEvents> </PropertiesComboBox> </dx:GridViewDataComboBoxColumn> <dx:GridViewDataComboBoxColumn FieldName="TownCode" VisibleIndex="13" Caption="縣編碼" Visible="false"> <EditFormSettings Visible="True" /> </dx:GridViewDataComboBoxColumn> <%--省市縣聯動--%> <%--命令按鈕--%> <dx:GridViewCommandColumn VisibleIndex="17" Caption="操作" Width="120"> <EditButton Visible="true" Text="編輯"> </EditButton> <DeleteButton Visible="true" Text="刪除"> </DeleteButton> <CellStyle HorizontalAlign="Center"> </CellStyle> </dx:GridViewCommandColumn> <dx:GridViewCommandColumn Caption="重置密碼" VisibleIndex="18" AllowDragDrop="False"> <CustomButtons> <dx:GridViewCommandColumnCustomButton ID="SetPasswordButton" Text="重置密碼"> </dx:GridViewCommandColumnCustomButton> </CustomButtons> </dx:GridViewCommandColumn> </Columns> <GroupSummary> <dx:ASPxSummaryItem FieldName="EnterpriseCount" DisplayFormat="{0}數量" SummaryType="Count" /> </GroupSummary> <Templates> <%--新增、修改Tab控制元件--%> <EditForm> <div style="padding: 4px 4px 3px 4px"> <dx:ASPxPageControl runat="server" ID="pageControlUser" Width="100%"> <TabPages> <dx:TabPage Text=" 基本資訊" Visible="true"> <ContentCollection> <dx:ContentControl ID="ContentControl1" runat="server"> <dx:ASPxGridViewTemplateReplacement ID="Editors" ReplacementType="EditFormEditors" runat="server"></dx:ASPxGridViewTemplateReplacement> </dx:ContentControl> </ContentCollection> </dx:TabPage> <dx:TabPage Text="型別" Visible="true"> <ContentCollection> <dx:ContentControl ID="ContentControl2" runat="server"> <dx:ASPxTreeList ID="OrgUnitTree" runat="server" AutoGenerateColumns="False" Width="100%" KeyFieldName="OrgUnitId" ParentFieldName="ParentId" ClientInstanceName="OrgUnitTree"> <Columns> <dx:TreeListDataColumn FieldName="Name" Caption="名稱"> <CellStyle Wrap="True"> </CellStyle> </dx:TreeListDataColumn> <dx:TreeListComboBoxColumn FieldName="TypeName" Caption="型別名稱"> <EditFormSettings Visible="False" /> </dx:TreeListComboBoxColumn> <dx:TreeListDataColumn FieldName="LinkMan" Caption="聯絡人" /> </Columns> <SettingsBehavior AllowFocusedNode="True" AllowDragDrop="false" ProcessSelectionChangedOnServer="false" /> <Settings VerticalScrollBarMode="Auto" ShowTreeLines="true" GridLines="Horizontal" /> <SettingsPager PageSize="20" PageSizeItemSettings-Caption="每頁顯示:" AlwaysShowPager="True" CurrentPageNumberFormat="{0}" Mode="ShowPager"> <Summary AllPagesText="總頁數: {0} - {1} (共有 {2} 條資料)" Text="總頁數: {0} - {1} (共有 {2} 條資料)" /> </SettingsPager> </dx:ASPxTreeList> </dx:ContentControl> </ContentCollection> </dx:TabPage> </TabPages> </dx:ASPxPageControl> </div> <div style="text-align: right; padding: 2px 2px 2px 2px"> <dx:ASPxGridViewTemplateReplacement ID="UpdateButton" ReplacementType="EditFormUpdateButton" runat="server"></dx:ASPxGridViewTemplateReplacement> <dx:ASPxGridViewTemplateReplacement ID="CancelButton" ReplacementType="EditFormCancelButton" runat="server"></dx:ASPxGridViewTemplateReplacement> </div> </EditForm> </Templates> <SettingsPopup EditForm-Modal="true" EditForm-HorizontalAlign="WindowCenter" CustomizationWindow-HorizontalAlign="WindowCenter" CustomizationWindow-VerticalAlign="WindowCenter"> <EditForm Width="550px" Height="400px" HorizontalAlign="Center" Modal="True"></EditForm> </SettingsPopup> <Settings ShowGroupPanel="true" /> <SettingsEditing Mode="PopupEditForm" /> </dx:ASPxGridView> <dx:ASPxPopupControl ID="PopupSetPassword" runat="server" CloseAction="CloseButton" Modal="True" PopupVerticalAlign="WindowCenter" PopupHorizontalAlign="WindowCenter" AllowDragging="True" ShowFooter="True" Width="350px" Height="130px" HeaderText="重置密碼" ClientInstanceName="PopupSetPassword" OnWindowCallback="PopupSetPassword_WindowCallback"> <ClientSideEvents EndCallback="PopupSetPassword_endCallback" /> <ContentCollection> <dx:PopupControlContentControl ID="PopupControlContentControl2" runat="server"> <table class="dxgvEditFormTable_Glass"> <tr> <td style="white-space: nowrap"> 新密碼：<dx:ASPxHiddenField runat="server" ID="HiddenField" ClientInstanceName="HiddenField"> </dx:ASPxHiddenField> </td> <td class="dxgvEditFormCell_Glass"> <dx:ASPxTextBox ID="txtPwd" Password="true" runat="server" Width="200" ClientInstanceName="txtPwd"> </dx:ASPxTextBox> </td> </tr> </table> </dx:PopupControlContentControl> </ContentCollection> <FooterTemplate> <div style="float: right; margin: 3px;"> <dx:ASPxButton ID="RolesListButton" runat="server" Text=" 確認 " AutoPostBack="False" ClientSideEvents-Click="SetPasswordClick"> </dx:ASPxButton> </div> </FooterTemplate> </dx:ASPxPopupControl> </asp:Content>
3.2 cs程式碼說明
using System; using System.Collections.Generic; using System.Collections.Specialized; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using DevExpress.Web.ASPxGridView; using DevExpress.Web.ASPxTreeList; using PanPass.YDYX.Model; using PanPass.YDYX.BLL; using DevExpress.Web.ASPxEditors; using DevExpress.Web.ASPxTabControl; using DevExpress.Web.ASPxClasses; using PanPass.Commons; public partial class Demo_DemoGridView : System.Web.UI.Page { protected void AddError(Dictionary<GridViewColumn, string> errors, GridViewColumn column, string errorText) { if (errors.ContainsKey(column)) return; errors[column] = errorText; } protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { } } //新增修改驗證 public override void ValidateRow(DevExpress.Web.Data.ASPxDataValidationEventArgs e) { if (e.NewValues["TrueName"] == null) { AddError(e.Errors, grid.Columns["TrueName"], "真實姓名不能為空."); } if (e.NewValues["LoginName"] != null && e.NewValues["LoginName"].ToString().Trim().Length < 3) { AddError(e.Errors, grid.Columns["LoginName"], "登入名長度不能小於3."); } if (grid.IsEditing && grid.IsNewRowEditing) //新增驗證 { } else if (!grid.IsNewRowEditing) //修改驗證 { } if (string.IsNullOrEmpty(e.RowError) && e.Errors.Count > 0) e.RowError = "請改正錯誤."; } //進入新增、修改頁面時初始化或獲取資料 protected void grid_CellEditorInitialize(object sender, ASPxGridViewEditorEventArgs e) { if (grid.IsEditing) //編輯 { } else //新增 { } if (grid.IsEditing && e.Column.FieldName == "ProvinceCode") { ASPxComboBox combo = e.Editor as ASPxComboBox; //FillProvinceData(combo); 繫結省份資訊 } if (grid.IsEditing && e.Column.FieldName == "CityCode") { ASPxComboBox combo = e.Editor as ASPxComboBox; object val = grid.GetRowValuesByKeyValue(e.KeyValue, "ProvinceCode"); //BindCbCityByProvince(combo, val); 繫結城市資訊 } if (grid.IsEditing && e.Column.FieldName == "TownCode") { ASPxComboBox combo = e.Editor as ASPxComboBox; object ProvinceCode = grid.GetRowValuesByKeyValue(e.KeyValue, "ProvinceCode"); object CityCode = grid.GetRowValuesByKeyValue(e.KeyValue, "CityCode"); //BindCountyByCity(combo, ProvinceCode, CityCode); 繫結縣級資訊 } } void grid_CustomButtonCallback(object sender, ASPxGridViewCustomButtonCallbackEventArgs e) { if (e.ButtonID == "DeleteButtonID") { } } //繫結資料 public void bindData() { } #region grid事件 //初始化Page控制元件樹 protected void grid_HtmlEditFormCreated(object sender, ASPxGridViewEditFormEventArgs e) { } protected void grid_RowInserting(object sender, DevExpress.Web.Data.ASPxDataInsertingEventArgs e) { grid.CancelEdit(); e.Cancel = true; bindData(); //呼叫js方法 //String js = "gv.PerformCallback();"; //ScriptManager.RegisterStartupScript(Page, this.GetType(), "", js, true); } protected void grid_RowDeleting(object sender, DevExpress.Web.Data.ASPxDataDeletingEventArgs e) { grid.CancelEdit(); e.Cancel = true; bindData(); } protected void grid_RowUpdating(object sender, DevExpress.Web.Data.ASPxDataUpdatingEventArgs e) { grid.CancelEdit(); e.Cancel = true; bindData(); } #endregion protected void PopupSetPassword_WindowCallback(object source, DevExpress.Web.ASPxPopupControl.PopupWindowCallbackArgs e) { int userid = HiddenField.Get("UserId").ToInt().Value; //e.Parameter; 獲取傳遞的引數 //userid獲取在CustomButtonClick新增的隱藏內容 PopupSetPassword.JSProperties["cp_retValue"] = "密碼修改成功"; } }
Attachment List