zoukankan      html  css  js  c++  java
  • FineUI之动态增加列及修改列的实现

    在FineUI的官方示例中有类似的实现。示例中实现了动态增加列,但有时我们可能需要动态修改列。先来看效果图




    下面是代码实现

    DynamicGrid.aspx

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="DynamicGrid.aspx.cs" Inherits="FineUITest.DynamicGrid" %>
    
    <%@ Register Assembly="FineUI" Namespace="FineUI" TagPrefix="f" %>
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
            <f:PageManager ID="PageManager1" runat="server" AutoSizePanelID="GridDemo" />
            <f:Grid runat="server" ID="GridDemo" Title="动态增加列及修改列标题示例">
                <Toolbars>
                    <f:Toolbar runat="server">
                        <Items>
                            <f:Button runat="server" ID="btnAdd" Text="增加列" OnClick="btnAdd_Click"></f:Button>
                            <f:Button runat="server" ID="btnEdit" Text="修改列" OnClick="btnEdit_Click"></f:Button>
                        </Items>
                    </f:Toolbar>
                </Toolbars>
            </f:Grid>
            <f:Window runat="server" ID="WindowEdit" Hidden="true" IsModal="true" Title="修改列名" Width="300" Height="200">
                <Toolbars>
                    <f:Toolbar runat="server">
                        <Items>
                            <f:Button runat="server" ID="btnOK" Text="确定" OnClick="btnOK_Click"></f:Button>
                            <f:Button runat="server" ID="btnCancel" Text="取消" OnClick="btnCancel_Click"></f:Button>
                        </Items>
                    </f:Toolbar>
                </Toolbars>
                <Items>
                    <f:DropDownList runat="server" ID="DropDownListHeaders" Label="原列名" ShowLabel="true"></f:DropDownList>
                    <f:TextBox runat="server" ID="TextBoxNewHeader" Label="新列名"></f:TextBox>
                </Items>
            </f:Window>
        </form>
    </body>
    </html>
    

    DynamicGrid.aspx.cs

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using FineUI;
    
    namespace FineUITest
    {
        public partial class DynamicGrid : System.Web.UI.Page
        {
            private const string GRID_COLUMN_HEADER = "GRID_COLUMN_HEADER";
            private const string UPDATE_HEADER = "UPDATE_HEADER";
    
            protected void Page_Load(object sender, EventArgs e)
            {
                if (!IsPostBack)
                {
                    InitLoad();
                }
            }
    
            private void InitLoad()
            {
                if (!NeedUpdateHeader())
                {
                    Session.Remove(GRID_COLUMN_HEADER);
                    return;
                }
    
                List<String> headers = Session[GRID_COLUMN_HEADER] as List<String>;
                if (headers == null)
                {
                    return;
                }
                FineUI.BoundField bf = null;
                foreach (String header in headers)
                {
                    bf = new FineUI.BoundField();
                    bf.HeaderText = header;
                    bf.DataFormatString = "{0}";
                    GridDemo.Columns.Add(bf);
                }
            }
    
            private bool NeedUpdateHeader()
            {
                if (Request == null)
                {
                    return false;
                }
    
                String updateHeader = Request.QueryString[UPDATE_HEADER];
    
                if (String.IsNullOrWhiteSpace(updateHeader) || updateHeader.ToUpper().Equals("FALSE"))
                {
                    return false;
                }
    
                return true;
            }
    
            protected void btnAdd_Click(object sender, EventArgs e)
            {
                List<String> headers = Session[GRID_COLUMN_HEADER] as List<String>;
                if (headers == null)
                {
                    headers = new List<String>();
                }
                String header = "列" + headers.Count.ToString();
                headers.Add(header);
                Session[GRID_COLUMN_HEADER] = headers;
                PageContext.Redirect(FetchRefreshUrl());
            }
    
            private String FetchRefreshUrl()
            {
                String url = "DynamicGrid.aspx";
                url += "?" + UPDATE_HEADER + "=TRUE";
                return url;
            }
    
            protected void btnEdit_Click(object sender, EventArgs e)
            {
                List<String> headers = Session[GRID_COLUMN_HEADER] as List<String>;
                if (headers == null || headers.Count <= 0)
                {
                    Alert.Show("暂无可供修改的列");
                    return;
                }
                WindowEdit.Hidden = false;
                DropDownListHeaders.DataSource = headers;
                DropDownListHeaders.DataBind();
                DropDownListHeaders.SelectedIndex = 0;
            }
    
            protected void btnOK_Click(object sender, EventArgs e)
            {
                List<String> headers = Session[GRID_COLUMN_HEADER] as List<String>;
                if (headers == null || headers.Count <= 0)
                {
                    Alert.Show("暂无可供修改的列");
                    return;
                }
    
                if (String.IsNullOrWhiteSpace(TextBoxNewHeader.Text))
                {
                    Alert.Show("请输入新列名");
                    return;
                }
    
                int index = DropDownListHeaders.SelectedIndex;
                headers[index] = TextBoxNewHeader.Text;
                Session[GRID_COLUMN_HEADER] = headers;
    
                PageContext.RegisterStartupScript(ActiveWindow.GetHideReference());
                PageContext.Redirect(FetchRefreshUrl());
            }
    
            protected void btnCancel_Click(object sender, EventArgs e)
            {
                PageContext.RegisterStartupScript(ActiveWindow.GetHideReference());
            }
        }
    }

    说明:

    1.从官方示例中可知,动态列的创建是在Page_Load或者Page_Init中完成的。为了触发这一事件,我们通过重定向Redirect来实现。

    2.创建及修改的列名称存在Session中。

    3.对于表格的中数据也可采用类似的方式实现,不过由于Session不能存太多的数据,所以数据量大时必须作相应的处理。比如借助数据库。

    4.不论后台如何处理,在前端上呈现的都只能是html和js的代码。所以后端修改了界面后,是必须要刷新界面才能上去的。只是有的采用了直接刷新,有的采用了异步AJAX刷新。所以我们这里修改界面的标题,采用重定向刷新界面的方式来实现。


    转载请注明出处http://blog.csdn.net/xxdddail/article/details/36378549

  • 相关阅读:
    Java实现 蓝桥杯VIP 算法训练 字符串逆序
    Java实现 蓝桥杯VIP 算法训练 字符串逆序
    Java实现 蓝桥杯VIP 算法训练 最长字符串
    Java实现 蓝桥杯VIP 算法训练 最长字符串
    Java实现 蓝桥杯VIP 算法训练 最长字符串
    Java实现 蓝桥杯VIP 算法训练 最长字符串
    Java实现 蓝桥杯VIP 算法训练 最长字符串
    Java实现 蓝桥杯VIP 算法训练 成绩的等级输出
    Java实现 蓝桥杯VIP 算法训练 成绩的等级输出
    Qt 自定义model实现文件系统的文件名排序
  • 原文地址:https://www.cnblogs.com/sparkleDai/p/7605002.html
Copyright © 2011-2022 走看看