昨天研究GridView的结果

GridView自定义实现

最新推荐文章于 2025-09-09 16:53:48 发布

转载最新推荐文章于 2025-09-09 16:53:48 发布 · 58 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/xxpyeippx/archive/2007/09/06/884662.html

文章标签：

#ui #javascript #c# #ViewUI

本文介绍了一种使用ASP.NET中的GridView控件实现自定义功能的方法，包括如何通过JavaScript使其具备树形展开折叠效果、主从表单联动全选及取消等功能，并提供了完整的前后端代码示例。

昨天研究了下GridView，结果客户的要求又变化了，现在不需要这样的Grid了。不过还是把我的研究成功贴出来了。。。

1.使GridView看起来像树形的js：要注意大小写

2.单击主表的一行，对应子表全部选中

一个子表的选项没有选中，主表对应的勾勾取消

调用方法：

< asp:TemplateField >

             < ItemTemplate >
                 < input type ="checkbox"   id ="<%#Eval(" ORDER_ID")% > " onclick="CheckAll(this)" />

             </ ItemTemplate >
         </ asp:TemplateField >

< asp:TemplateField >
                 < ItemTemplate >
                     < a href ="#" id ="herf<%#Eval(" ORDER_ID")% > " onclick="display( < %#Eval ("ORDER_ID")% > )">+ </ a >
                 </ ItemTemplate >
             </ asp:TemplateField >

前台：

< %@ Page Language ="C#" AutoEventWireup ="true" CodeFile ="WorkOrderNewV4.aspx.cs" Inherits ="Back4_WorkOrderNewV4" % >

< html >
< head id ="Head1" runat ="server" >
     < title ></ title >
     < LINK href ="JS/movegrid.css" type ="text/css" rel ="stylesheet" >

     < script src ="JS/GridOption.js" type ="text/javascript" language ="javascript" ></ script >
     < script type ="text/javascript" >

  function display(id){
        changePlug(id);
        id="divDetail"+id;

      var traget=document.getElementById(id);
       if(traget.style.display=="none"){
               traget.style.display="";
       }else{
               traget.style.display="none";
     }



  }
  function changePlug(id)
  {

    id="herf"+id;

    var target=document.getElementById(id);
//    alert(target.innerText);
//    alert(id);
    if(target.innerText=="+")
        target.innerText="-";
    else
        target.innerText="+";
  }

    // <![CDATA[
  function CheckAll(ocheckeBox)
  {
     //alert(id.parentNode.innerHTML);
    var a=ocheckeBox.parentNode.parentNode.getElementsByTagName("INPUT");
    for(i=0;i<a.length;i++)
    {
        if(a[i].id!=ocheckeBox.id)
        {
            //alert("a");
            a[i].checked=ocheckeBox.checked;
        }
    }

  }

    function CheckDetail(ocheckeBox)
    {
       var orderContainer =ocheckeBox.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode;
       // alert(orderContainer.innerHTML);
      var OrderLever = orderContainer.getElementsByTagName("INPUT");

      var a =  ocheckeBox.parentNode.getElementsByTagName("INPUT");
      // alert(a.length);
       var isChange=true;
       for(i=0;i<a.length;i++)
       {
       // alert("xunhuan");
        if(a[i].checked==false)
        {
           //alert("nocheck==false");
            isChange=false;
            break;
        }
       }

       if(isChange==false)
       {
        OrderLever[0].checked=false;
       }
//       else
//       {
//        OrderLever[0].checked=true;
//       }

    }
  // ]]>

</ script >

</ head >
< body >
     < form id ="form1" runat ="server" >
     < h1 > Work Order Assign </ h1 >
     < h2 > --Setp 1.Please Choose Order </ h2 >
     < asp:GridView runat ="server" ID ="Master"   AutoGenerateColumns ="False" OnRowDataBound ="Master_RowDataBound" DataKeyNames ="ORDER_ID" EmptyDataText ="No Order to be Assigned!" OnRowCommand ="Master_RowCommand" AllowPaging ="True" OnPageIndexChanging ="Master_PageIndexChanging" >
         < Columns >
         < asp:TemplateField >

             < ItemTemplate >
                 < input type ="checkbox"   id ="<%#Eval(" ORDER_ID")% > " onclick="CheckAll(this)" />

             </ ItemTemplate >
         </ asp:TemplateField >
             < asp:TemplateField >
                 < ItemTemplate >
                     < a href ="#" id ="herf<%#Eval(" ORDER_ID")% > " onclick="display( < %#Eval ("ORDER_ID")% > )">+ </ a >
                 </ ItemTemplate >
             </ asp:TemplateField >
             < asp:BoundField DataField ="ORDER_ID" HeaderText ="Order ID" />
             < asp:TemplateField >
                 < HeaderTemplate >< a href ="#" onclick ="sort_tab(Master,3,true)" > CompanyID </ a ></ HeaderTemplate >
                 < ItemTemplate >< %#Eval ("COMPANY_ID") % ></ ItemTemplate >
             </ asp:TemplateField >
             < asp:BoundField DataField ="COMPANY_ID" HeaderText ="Company ID" />
             < asp:BoundField DataField ="SUB_ID" HeaderText ="Sub ID" />
             < asp:TemplateField >
                 < ItemTemplate >
                     < div id ="divDetail<%#Eval(" ORDER_ID")% > " style="display:none;">
                     < asp:GridView runat ="server" ID ="Detail" DataKeyNames ="ORDER_ID,ORDER_LINE_ID"   AutoGenerateColumns ="false" EmptyDataText ="No Order Lines For this Order" >
                         < Columns >
                             < asp:BoundField DataField ="ORDER_LINE_ID" HeaderText ="ORDER_LINE_ID" />
                             < asp:TemplateField HeaderText ="Pick" >
                                 < ItemTemplate >

                                     < asp:CheckBox   runat ="server" ID ="CheckOrderLine" onclick ="CheckDetail(this);" />
                                 </ ItemTemplate >

                             </ asp:TemplateField >
                         </ Columns >
                     </ asp:GridView >
                     </ div >
                 </ ItemTemplate >
             </ asp:TemplateField >
             < asp:ButtonField CommandName ="create" Text ="CREATE" />

         </ Columns >
     </ asp:GridView >

     </ form >
     </ body >
</ html >

后台：

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class Back4_WorkOrderNewV4 : System.Web.UI.Page
{
     const String SESSOINSTR = " WORK_ORDER_NEW_1 " ;
     const string NEXTURL = " WorkOrderNew2.aspx " ;
     protected void Page_Load( object sender, EventArgs e)
    {
         if ( ! this .IsPostBack)
        {
            BindMaster();
        }
    }

     private void BindMaster()
    {
        Vtek.MHT.BLL.Order o = new Vtek.MHT.BLL.Order();
         this .Master.DataSource = o.GetOrderCanAssignWT();
        Master.DataBind();
    }
     protected void Master_RowDataBound( object sender, GridViewRowEventArgs e)
    {
         if (e.Row.RowType == DataControlRowType.DataRow)
        {
             int index = e.Row.DataItemIndex;
            index = index % Master.PageSize;

             int Order_ID = Convert.ToInt32(Master.DataKeys[index].Values[ " ORDER_ID " ].ToString());

            Vtek.MHT.BLL.WorkTickets w = new Vtek.MHT.BLL.WorkTickets();

            GridView Detail = (GridView)e.Row.FindControl( " Detail " );
            Detail.DataSource = w.GetOrderLineNotInWorkOrderLine(Order_ID);
            Detail.DataBind();

            w = null ;
        }

    }
     protected void Master_RowCommand( object sender, GridViewCommandEventArgs e)
    {

         if (e.CommandName == " create " )
        {
             int [] result = new int [ 100 ];

             int rowIndex = Convert.ToInt32(e.CommandArgument);
            GridViewRow row = Master.Rows[rowIndex];

             int OrderID = Convert.ToInt32(Master.DataKeys[rowIndex].Values[ " ORDER_ID " ].ToString());
            result[ 0 ] = OrderID;

            GridView Detail = (GridView)row.FindControl( " Detail " );
             for ( int i = 0 ; i < Detail.Rows.Count; i ++ )
            {
                CheckBox chbPick = (CheckBox)Detail.Rows[i].FindControl( " CheckOrderLine " );
                 if (chbPick.Checked)
                {
                    {
                         int detailIndex = int .Parse(Detail.DataKeys[i][ " ORDER_LINE_ID " ].ToString());
                        result[i + 1 ] = detailIndex;
                    }
                }
            }

            Session[SESSOINSTR] = result;
             // Response.Write(result.Length.ToString() +"

"+result[0].ToString()+".."+ result[1].ToString());
            Response.Redirect(NEXTURL);

        }
    }
     protected void Master_PageIndexChanging( object sender, GridViewPageEventArgs e)
    {
         this .Master.PageIndex = e.NewPageIndex;
        BindMaster();
    }
}

========================
另外附加可以前台排序，分页，左右移动GridView的东西：
http://files.cnblogs.com/xxpyeippx/movegrid.zip

转载于:https://www.cnblogs.com/xxpyeippx/archive/2007/09/06/884662.html