`
xufei0110
  • 浏览: 110643 次
  • 性别: Icon_minigender_1
  • 来自: 大连
社区版块
存档分类
最新评论

ajax gridview 嵌套

    博客分类:
  • .net
阅读更多

ajax GridView 嵌套 弹出模态窗口

 

 

页面结构 大体

第一层 updatepanel2

    第二层 GridView1

         GridView1的字段1

         GridView1的字段2

         GridView1的模板列1

               第三层 1 GridView2

         GridView1的模板列1

         GridView1的模板列2

               第三层 2 updatepanel1

                    第四层 GridView3    

               第三层 2 updatepanel1         

         GridView1的模板列2

    第二层 GridView1

第一层 updatepanel2

 

特别说明

    第四层的 GridView3 是由 GridView1 的模板列2 里 一个 LinkButton点击后填充的,

并由 AjaxControlToolkit ModalPopupExtender 控件的模态弹出窗口负责显示的

GridView3 里的数据是可以同时更新的。ModalPopupExtender 的显示控制是由后台负责的。

 

GridView 需要的数据 是由 linq提供的。所以这些代码拿过去是不能够直接使用的。

 

页面结构

<%@ Page Language="C#" MasterPageFile="~/Master/WareHouse.master" Theme="DataWebControls" AutoEventWireup="true" CodeFile="ProductionSearch.aspx.cs" Inherits="Pages_WareHouse_ProductionSearch" Title="Untitled Page" %>

<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="cc1" %>

<asp:Content ID="Content1" ContentPlaceHolderID="MasterContent" Runat="Server">
    <style type="text/css">
    <!--

    .modalBackground {
	    background-color:Gray;
	    filter:alpha(opacity=70);
	    opacity:0.7;
    }
    -->
    </style>
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    
    <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" 
            onrowdatabound="GridView1_RowDataBound" Width="700px" >
        <Columns>
            <asp:BoundField DataField="id" HeaderText="ID"  />
            <asp:BoundField DataField="name" HeaderText="Name" />
            <asp:TemplateField>
                <ItemTemplate>
                    <asp:GridView ID="GridView2" runat="server" AutoGenerateColumns="false" 
                        ShowHeader="false" 
                         
                        onrowediting="GridView2_RowEditing" 
                        OnRowUpdating="GridView2_RowUpdating"
                        OnRowCancelingEdit="GridView2_RowCancelingEdit"
                        OnRowDeleting="GridView2_RowDeleting">
                        <Columns>
                            <asp:BoundField DataField="id" >
                                <HeaderStyle Width="50px" />
                            </asp:BoundField>
                            <asp:BoundField DataField="name" >
                                <HeaderStyle Width="50px" />
                            </asp:BoundField>
                            <asp:CommandField ShowEditButton="True"  >
                                <HeaderStyle Width="100px" />
                            </asp:CommandField>
                            <asp:CommandField ShowDeleteButton="True" >
                                <HeaderStyle Width="50px" />
                            </asp:CommandField>
                        </Columns>
                    </asp:GridView>
                </ItemTemplate>
                <HeaderStyle Width="300px" />
            </asp:TemplateField>
            <asp:TemplateField>
                
                <ItemTemplate>
                    <asp:LinkButton ID="LinkButton1" runat="server" 
                        oncommand="LinkButton1_Command" 
                        CommandArgument='<%# Eval("id") %>'>修改</asp:LinkButton>
                    <cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server"
                            TargetControlID="LinkButton1"
                            PopupControlID="Panel1"
                            PopupDragHandleControlID="Panel2"                            
                            BackgroundCssClass="modalBackground"                            
                           
                            Enabled = "false"
                            
                            CancelControlID="CencelButton">
                    </cc1:ModalPopupExtender>
                    <asp:Panel ID="Panel1" runat="server" Width="300px" style="display:none; background-color:White;border:solid 1px black;">
                        <asp:Panel ID="Panel2" runat="server" Style="cursor: move;background-color:#DDDDDD;border:solid 1px Gray;color:Black">
                            fdsafsda</asp:Panel>
                        <asp:UpdatePanel ID="UpdatePanel1" runat="server" >
                            <ContentTemplate>
                                <asp:GridView ID="DetailGridView" runat="server"
                                    AutoGenerateColumns="false"
                                    >
                                    <Columns>
                                        <asp:TemplateField HeaderText="UserID">
                                            <ItemTemplate>
                                                <asp:CheckBox ID="CheckBox1" runat="server" />
                                            </ItemTemplate>
                                        </asp:TemplateField>
                                        <asp:TemplateField HeaderText="UserID">
                                            <ItemTemplate>
                                                <asp:TextBox ID="TB_UserID" runat="server" Text='<%# Eval("userid") %>' ReadOnly="true"></asp:TextBox>
                                            </ItemTemplate>
                                        </asp:TemplateField>
                                        <asp:TemplateField HeaderText="CarID">
                                            <ItemTemplate>
                                                <asp:TextBox ID="TB_CarID" runat="server" Text='<%# Eval("id") %>'></asp:TextBox>
                                            </ItemTemplate>
                                        </asp:TemplateField>
                                        <asp:TemplateField HeaderText="CarName">
                                            <ItemTemplate>
                                                <asp:TextBox ID="TB_CarName" runat="server" Text='<%# Eval("name") %>'></asp:TextBox>
                                            </ItemTemplate>
                                        </asp:TemplateField>                                        
                                    </Columns>
                                    <HeaderStyle ForeColor="#33CCFF" />
                                </asp:GridView>
                            </ContentTemplate>                            
                        </asp:UpdatePanel>
                            
                        
                        <p>
                            <asp:Button ID="UpdateButton" runat="server" Text="确定" OnClick="UserCarUpdateButton_OnClick" />
                            <asp:Button ID="CencelButton" runat="server" Text="取消" />
                        </p>
                    </asp:Panel>
                </ItemTemplate>
            </asp:TemplateField>
        </Columns>        
    </asp:GridView>
    </ContentTemplate>
    </asp:UpdatePanel>
</asp:Content>

 

后台代码

 

using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
using System.Collections.Generic;
using AjaxControlToolkit;

public partial class Pages_WareHouse_ProductionSearch : System.Web.UI.Page
{
    //  暂时使用的 userList 的缓存 key
    private string user_LIST_CACHE_KEY = "userListCache";

    private IUserService userService = null;
        
    protected void Page_Load(object sender, EventArgs e)
    {   
        
        if (!IsPostBack)
        {
            initPage();
        }
    }

    /// <summary>
    /// 页面初始化
    /// </summary>
    public void initPage() 
    {
        userService = ServiceFactory.getUserService();
        IList<user> userList = userService.getUser();
        //这个 将查出来的数据缓存一下 不应该写在这里
        HttpRuntime.Cache.Insert(user_LIST_CACHE_KEY, userList);
        this.GridView1.DataSource = userList;
        this.GridView1.DataKeyNames = new String[] { "id" };
        this.GridView1.DataBind();
    }

    /// <summary>
    /// 子GridView2的删除事件
    /// </summary>
    /// <param name="sender"></param>
    /// <param name="e"></param>
    protected void GridView2_RowDeleting(object sender, GridViewDeleteEventArgs e)
    {
        //这里 要有相应的代码
    }

    /// <summary>
    /// 外层GridView1的 行绑定事件
    /// 在这里绑定每行的 子 GridVeiw2
    /// </summary>
    /// <param name="sender"></param>
    /// <param name="e"></param>
    protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            int userID = int.Parse(GridView1.DataKeys[e.Row.RowIndex].Value.ToString());
            GridView gv = (GridView)e.Row.FindControl("GridView2");
            gv.DataSource = getCars(userID);
            gv.DataKeyNames = new string[] { "id", "userid" };
            gv.DataBind();

        }

    }

    /// <summary>
    /// 取得user的Car列表
    /// </summary>
    /// <param name="id">userID</param>
    /// <returns></returns>
    private IList getCars(int userID)
    {
        //IList<user> userList = ((IList<user>)Cache.Get(user_LIST_CACHE_KEY));
        userService = ServiceFactory.getUserService();
        IList<user> userList = userService.getUser();
        return (from u in userList where u.id == userID select u.Cars).ToList()[0];
    }

    /// <summary>
    /// 子GridView2的更新事件
    /// </summary>
    /// <param name="sender"></param>
    /// <param name="e"></param>
    protected void GridView2_RowUpdating(object sender, GridViewUpdateEventArgs e)
    {
        //dataBind();
        GridView gv2 = (GridView)sender;
        Car car = new Car();
        car.name = ((TextBox)gv2.Rows[e.RowIndex].Cells[1].Controls[0]).Text.ToString().Trim();
        car.id = int.Parse(gv2.DataKeys[e.RowIndex].Values["id"].ToString());
        int userID = int.Parse(gv2.DataKeys[e.RowIndex].Values["userid"].ToString());
        //这里调用更新Car的方法


        gv2.EditIndex = -1;

        gv2.DataSource = getCars(userID);
        gv2.DataBind();

    }


    /// <summary>
    /// 子GridView2的到切换的编辑状态的事件
    /// </summary>
    /// <param name="sender"></param>
    /// <param name="e"></param>
    protected void GridView2_RowEditing(object sender, GridViewEditEventArgs e)
    {

        GridView gv2 = (GridView)sender;
        gv2.EditIndex = e.NewEditIndex;

        int carID = int.Parse(gv2.DataKeys[e.NewEditIndex].Value.ToString());
        int userID = int.Parse(gv2.DataKeys[e.NewEditIndex].Values["userid"].ToString());

        gv2.DataSource = getCars(userID);
        gv2.DataBind();
    }

    /// <summary>
    /// 子GridView2的取消编辑状态
    /// </summary>
    /// <param name="sender"></param>
    /// <param name="e"></param>
    protected void GridView2_RowCancelingEdit(object sender, GridViewCancelEditEventArgs e)
    {
        GridView gv2 = (GridView)sender;
        gv2.EditIndex = -1;
        int userID = int.Parse(gv2.DataKeys[e.RowIndex].Values["userid"].ToString());

        gv2.DataSource = getCars(userID);
        gv2.DataBind();
    }

    /// <summary>
    /// 弹出详细页面的事件
    /// </summary>
    /// <param name="sender"></param>
    /// <param name="e"></param>
    protected void LinkButton1_Command(object sender, CommandEventArgs e)
    {
        int userID = int.Parse(e.CommandArgument.ToString());
        LinkButton lb = (LinkButton)sender;
        GridView detailGV = (GridView)lb.Parent.FindControl("DetailGridView");
        detailGV.DataSource = getCars(userID);
        detailGV.DataKeyNames = new string[] { "id", "userid" };
        detailGV.DataBind();
        ModalPopupExtender mpe = (ModalPopupExtender)lb.Parent.FindControl("ModalPopupExtender1");
        mpe.Enabled = true;
        mpe.Show();
    }



    /// <summary>
    /// 更新用户的汽车的事件
    /// </summary>
    /// <param name="sender"></param>
    /// <param name="e"></param>
    protected void UserCarUpdateButton_OnClick(object sender, EventArgs e) 
    {
        Button updateButton = (Button)sender;
        GridView gv = (GridView)updateButton.Parent.FindControl("DetailGridView");

        CarDao carDao = new CarDao();
        //取得全部的汽车的信息 逐个更新
        for (int i = 0; i < gv.Rows.Count; i++)
        {
            GridViewRow row = gv.Rows[i];
            string userID = ((TextBox)row.Cells[0].FindControl("TB_UserID")).Text.Trim();
            string carID = ((TextBox)row.Cells[1].FindControl("TB_CarID")).Text.Trim();
            string carName = ((TextBox)row.Cells[1].FindControl("TB_CarName")).Text.Trim();
            
            //这里应该作更新的操作
            carDao.updateCarLinq(new Car { id = int.Parse(carID), name = carName, userid = int.Parse(userID)});
        }

        ModalPopupExtender mpe = (ModalPopupExtender)gv.Parent.FindControl("ModalPopupExtender1");
        mpe.Enabled = false;

        //更新后 重新更新一下页面
        initPage();
        this.UpdatePanel2.Update();
    }


}

 vs 2008 下测试通过

分享到:
评论

相关推荐

    GridView嵌套应用实例

    在这个“GridView嵌套应用实例”中,我们将深入探讨如何实现GridView的嵌套使用,以达到更复杂的数据显示和交互效果。 首先,GridView控件的主要特点是易于使用和高度可定制化。它支持分页、排序、筛选、编辑和删除...

    .net GridView嵌套 EditNestedGridView

    在标题".net GridView嵌套 EditNestedGridView"中提到的概念,指的是在GridView内部嵌套另一个GridView,实现数据的多级展示和编辑功能。这种技术常用于处理具有层次结构的数据,例如员工与他们的下属、产品与子产品...

    简单三层GridView嵌套DropDownLis实列

    在本文中,我们将深入探讨如何实现一个简单的三层结构,即GridView嵌套DropDownList的实际案例。这个实例适用于那些希望在网页上展示分层数据,并允许用户通过下拉菜单进行交互的开发者。 首先,三层GridView嵌套...

    gridview 三重嵌套

    本主题将深入探讨如何实现“gridview”的三重嵌套,并通过C#编程语言来详细讲解Edit事件的运用,以实现点击展开下一层GridView的功能。 首先,我们需要理解GridView的基本用法。GridView是一个服务器控件,它可以...

    嵌套中的gridview单元格编辑

    然而,当需求变得更加复杂时,我们可能需要在一个GridView内嵌套另一个GridView,形成所谓的“嵌套GridView”,以此来展示层次化的数据结构。在这样的场景下,“嵌套中的gridview单元格编辑”就成为一个关键的技术点...

    asp.net可展开节点的GridView.rar

    在ASP.NET开发中,...这个实例"GridView嵌套应用实例"将提供具体的代码示例和详细说明,帮助开发者理解和实现这一功能。对于那些希望在ASP.NET项目中提供更丰富数据展示的开发者来说,这是一个非常有价值的资源。

    GridView的各种高级应用代码实例

    TemplateField可以包含HTML控件、服务器控件,甚至可以嵌套其他的GridView,从而提供丰富的布局和功能。 5. **分页和排序**: GridView支持内置的分页和排序功能。只需简单地设置AllowPaging和AllowSorting属性为...

    gridview控件详细使用

    10. **嵌套GridView**:在一个GridView内嵌套另一个GridView,以展示层次化数据。 综上所述,GridView控件提供了丰富的功能和灵活性,适用于各种数据展示和操作场景。通过熟练掌握其基本用法和进阶技巧,可以创建出...

    Gridview总结的源代码

    6. **多层嵌套**:在复杂的Web应用中,有时我们需要在GridView内部嵌套其他数据控件,如另一个GridView或DetailsView,以展示层级数据。这可以通过使用TemplateField和嵌套的数据绑定实现。 7. **自定义样式和模板*...

    GridView72般绝技

    11. **Ajax更新**:结合UpdatePanel和AJAX技术,GridView的更新可以不刷新整个页面,提供更好的用户体验。 12. **自定义行创建**:使用RowCreated事件,可以在GridView创建行时执行自定义逻辑,例如添加自定义属性...

    GridView 72般绝技

    可以在GridView的某一行中嵌套另一个GridView,展示子数据集。通过`TemplateField`的`ItemTemplate`添加子GridView,并在父GridView的`RowDataBound`事件中填充子数据。 8. **数据绑定优化** 对于大数据集,可...

    gridview的基本使用

    如果需要更高级的功能,比如条件格式化、嵌套GridView或使用Ajax进行异步操作,可以利用`RowCreated`、`RowDataBound`等事件编写自定义代码。 总之,GridView是ASP.NET中展示数据的强大工具,通过熟练掌握其基本...

    一个基于ASP.net+Jquery+GridView实现无刷新TreeGrid源码例子

    通过使用模板列和嵌套GridView,可以创建出具有层级关系的表格,模拟TreeGrid的效果。 4. **无刷新(Ajax)技术**:无刷新是现代Web应用的重要特性,它通过在后台更新数据,使用户无需等待整个页面刷新即可看到变化...

    Gridview中的textbox按回车或者上下键自动下移,无刷新弹出层

    "Gridview中的textbox按回车或者上下键自动下移,无刷新弹出层"这一技术点是提高用户体验的一种有效方法,它涉及到JavaScript、AJAX、HTML以及CSS等多个方面的知识。 首先,让我们详细了解这个功能的工作原理: 1....

    ASP.NET源码——Vs下GridView演示多层Demo.zip

    8. Ajax集成:如果项目使用了ASP.NET AJAX,GridView可以与UpdatePanel配合,实现部分页面更新,提高用户体验。 9. 绑定表达式:在GridView中,数据字段可以使用绑定表达式(例如 ("FieldName") %&gt;)来显示来自数据...

    GridView72绝技

    9. **AJAX集成**:探讨使用AJAX技术(如UpdatePanel或jQuery)增强GridView的用户体验,实现异步刷新和无刷新操作。 10. **数据导出**:学习将GridView的数据导出为Excel、CSV或其他格式,提供数据导出功能。 11. ...

    GridView+Jquery实现的TreeGrid

    在传统的GridView中,数据通常是二维的,但在结合了jQuery的TreeGrid中,我们可以展示层次化的数据,这在处理组织结构、目录树或有嵌套关系的数据时非常有用。 接下来,jQuery是一个轻量级的JavaScript库,它简化了...

    .net GridView 觉见操作

    在实际项目中,GridView控件通常与其他控件(如ButtonField、LinkButton等)和功能(如Ajax更新、模板列)结合使用,以提供丰富的用户体验。通过对这些知识点的深入理解和实践,开发者可以充分利用GridView的强大...

Global site tag (gtag.js) - Google Analytics