关于GridView的应用<附了图片效果>,这个效果有点难,请求高手帮助!

--------------------编程问答-------------------- 图片看不了 --------------------编程问答-------------------- 的确有难度。 --------------------编程问答-------------------- 图片显示不出来?重新发过啊 --------------------编程问答-------------------- 我的理解是将将GridView(B)嵌套在 GridView(A)中,如果选中了A中的一行,那个加号的图片变为减号,然后展开B. 有兴趣的来讨论一下.
                                    后生有礼---谢谢各位 --------------------编程问答-------------------- 别人都能看到,刷一下,应该没问题,有兴趣的话加我QQ:77856977 --------------------编程问答-------------------- 很简单，不过你贴的图看不到 --------------------编程问答-------------------- LZ解决了不要忘了告诉我们，关注，也想做这个效果 --------------------编程问答-------------------- Repeater --------------------编程问答-------------------- 简单，用js和gridview结合 --------------------编程问答-------------------- 下面的内容可以看成是记录的备注 --------------------编程问答-------------------- 看不到图片的可以去这个地址看,帖子加100分,有源码的或是有什么看发的都贴出来大家同进取,同分享
/upload/20131225/48394eae463970e0fbed50ea.gif --------------------编程问答-------------------- 先找找第三方控件吧,有的话就不用自己那么麻烦去做了 --------------------编程问答-------------------- <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title></title>
<style type="text/css">
body{text-align:center;}
td {font-size: 12px;line-height:160%}
.dotline{background-image:url(images/dot_line.gif);background-repeat: repeat-x;background-position: bottom;}
</style>
</head>

<body>
<script language=JavaScript src="js/js.js"></script>
<table width="600" border="0" cellspacing="2" cellpadding="0">
  <tr>
    <td width="56" height="40" align="right" class="dotline"><img src="images/ico_q.gif" width="47" height="29"></td>
    <td width="544" height="40" class="dotline"><a onClick=javascript:ShowFLT(1) href="javascript:void(null)">1.为什么我在加入购物车的时候提示“数量已超过该物品库存”？</a></td>
  </tr>
  <tr id=LM1 style="DISPLAY: none">
    <td height="30" align="right" bgcolor="#f5f9ed"><img src="images/ico_a.gif" width="14" height="14" hspace="5"></td>
    <td height="30" bgcolor="#f5f9ed">这是因为您要购买的数量超过了我们目前仓库中该物品的数量。比如说您想购物10件物品，而我们目前只有5件库存，所以系统会出现该提示，并会把尽可能多的物品加入您的购物车。</td>
  </tr>
  <tr>
    <td height="40" align="right" class="dotline"><img src="images/ico_q.gif" width="47" height="29"></td>
    <td height="40" class="dotline"><a onClick=javascript:ShowFLT(2) href="javascript:void(null)">2.“下次自动登录”有什么用？</a></td>
  </tr>
  <tr id=LM2 style="DISPLAY: none">
    <td height="30" align="right" bgcolor="#f5f9ed"><img src="images/ico_a.gif" width="14" height="14" hspace="5"></td>
    <td height="30" bgcolor="#f5f9ed"><p>如果您是我们的会员，在您登录的时候，会有一个下次自动登录选项。如果您是在家或者办公室上网的话，您可以选中它，这样当您下次再来的时候，就不用再手工登录了，会自动识别出您，并自动登录。</p>
    </td>
  </tr>

  <tr>
    <td height="40" align="right" class="dotline"><img src="images/ico_q.gif" width="47" height="29"></td>
    <td height="40" class="dotline"><a onClick=javascript:ShowFLT(3) href="javascript:void(null)">3.为什么在付款的时候要“多加一个尾数”？</a></td>
  </tr>
  <tr id=LM3 style="DISPLAY: none">
    <td height="30" align="right" bgcolor="#f5f9ed"><img src="images/ico_a.gif" width="14" height="14" hspace="5"></td>
    <td height="30" bgcolor="#f5f9ed">因为我们的定单较多，难免会出现多个顾客同时汇款的情况。加个尾数可以方便我们识别您的汇款，以减少不必要的麻烦，并第一时间给您发货。如果有可能的话，我们还建议在您的汇款或者转帐附言中写明您的订单号。当然，您在付款后及时的通知我们也是必不可少的。</td>
  </tr>

  <tr>
    <td height="40" align="right" class="dotline"><img src="images/ico_q.gif" width="47" height="29"></td>
    <td height="40" class="dotline"><a onClick=javascript:ShowFLT(4) href="javascript:void(null)">4.什么是TrackBack，对我而言有何意义？</a></td>
  </tr>
  <tr id=LM4 style="DISPLAY: none">
    <td height="30" align="right" bgcolor="#f5f9ed"><img src="images/ico_a.gif" width="14" height="14" hspace="5"></td>
    <td height="30" bgcolor="#f5f9ed">简单说来，TrackBack 被设计用来提供一种方法以实现网站之间的互相通告。利用这种简单使用的方式，可以让您实现主动推送(Push)一条相关信息加进产品页面内。这样，不仅使用户在访问我们的网站时得到的高价值信息量更多，更能使您的 Blog 吸引到与您志同道合的朋友。</td>
  </tr>

  <tr>
    <td height="40" align="right" class="dotline"><img src="images/ico_q.gif" width="47" height="29"></td>
    <td height="40" class="dotline"><a onClick=javascript:ShowFLT(5) href="javascript:void(null)">5.我的 Blog 是否也支持 Trackback？</a></td>
  </tr>
  <tr id=LM5 style="DISPLAY: none">
    <td height="30" align="right" bgcolor="#f5f9ed"><img src="images/ico_a.gif" width="14" height="14" hspace="5"></td>
    <td height="30" bgcolor="#f5f9ed">作为一种协议和一项功能对其进行了实现，这是 TrackBack 的第一个实现。由于只有众多的站点都支持TrackBack，它的真正价值才能得以体现，所以 TrackBack 从一开始就被设计为一个开放系统：一个其它的 blog 工具能很简单地实现的开放系统。</td>
  </tr>
</table>
</body>
</html>
--------------------编程问答-------------------- 以上是一个js的效果，结合到gridview里就行了，你说的这种隐藏一条备注信息的做法不难，难得是隐藏一个相关的表，也就是表格套表格 --------------------编程问答-------------------- 呵呵,谢谢你,是不是忘了给js文件了? --------------------编程问答-------------------- var number=5; //定义条目数

function LMYC() {
var lbmc;
    for (i=1;i<=number;i++) {
        lbmc = eval('LM' + i);
        lbmc.style.display = 'none';
    }
}

function ShowFLT(i) {
    lbmc = eval('LM' + i);
    if (lbmc.style.display == 'none') {
        LMYC();
        lbmc.style.display = '';
    }
    else {
        lbmc.style.display = 'none';
    }
} --------------------编程问答-------------------- gridview里每条记录要生成一个号，就是要有一个自增长的列，再结合以上的来做 --------------------编程问答-------------------- 收藏，等高手。。。。 --------------------编程问答-------------------- 做一个隐藏层不就可以了...

选中的时候显示层..

--------------------编程问答-------------------- 嵌套？网上有例子啊 --------------------编程问答-------------------- repeater来重复需要的tr，ItemTemplate里面需两个tr

然后写些js就搞定了

生成的html大概如下，需要注意的是不要改动table的id，要不你需要更改js对应的table的id

<html> 

<head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 

<title></title> 

<style type="text/css"> 

#MyTable{background:#9891C4}

#MyTable thead{background:#B7BAE7}

#MyTable tbody tr{background:#ffffff}

#MyTable tbody tr td.plus{background:#ffffff url(plus.png) no-repeat center;cursor:pointer;}

#MyTable tbody tr td.minus{background:#ffffff url(minus.png) no-repeat center;cursor:pointer;}

#MyTable tbody tr.hide{display:none;}

#MyTable tbody tr.focus{background:#DDDEF3}

</style> 

</head> 

<body> 

<script>

function $(Id){return document.getElementById(Id);}

function $s(o,tagName){return o.getElementsByTagName(tagName);}

function CKALL(checked){

  var cbs=$s($s($('MyTable'),"tbody")[0],"input");

  for(var i=0;i<cbs.length;i++){

    cbs[i].checked=checked;

    cbs[i].parentNode.parentNode.className=checked?"focus":"";

  }

}

function resetClass(o){

  var tbody=$s($('MyTable'),"tbody")[0],tr,trPre;

  var showTr=o.parentNode.nextSibling;

  while(showTr.nodeType!=1)showTr=showTr.nextSibling;//for firefox

  for(var i=1;i<tbody.rows.length;i=i+2){

    tr=tbody.rows[i];

    if(showTr!=tr&&tr.className!='hide'){

      trPre=tr.previousSibling;

      while(trPre.nodeType!=1)trPre=trPre.previousSibling;//for firefox

      trPre.cells[1].className='plus';

      tr.className='hide';

    }

  }

  tr=o.parentNode.nextSibling;

  while(tr.nodeType!=1)tr=tr.nextSibling;//for firefox

  tr.className=o.className=="plus"?"":"hide";

  o.className=o.className=="plus"?"minus":"plus";

}

document.onclick=function(e){

  e=e||window.event;

  var o=e.srcElement||e.target;

  if(o.id=="ckall")CKALL(o.checked);

  else if(o.name=='cb')o.parentNode.parentNode.className=o.checked?"focus":"";

  else if(o.className=="plus"||o.className=="minus")resetClass(o);

}

</script>





<table  width="600" border="0" cellspacing="1" cellpadding="0" id="MyTable"> 

  <thead><tr><td style='width:25px'><input type='checkbox' id='ckall'/></td><td style='width:17px'></td><td>承运人</td><td>转运属性</td><td>离港班期</td></tr></thead>

  <tbody>

  <!--repeater放tbody里面，重复下面说明的两列，绑定下就可以了-->

  <!----需要重复的tr-->

    <tr><td><input type='checkbox' name='cb'/></td><td class='plus'></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

 <!----到此结束-->

    <tr><td><input type='checkbox' name='cb'/></td><td class="plus"></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>   

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

    <tr><td><input type='checkbox' name='cb'/></td><td class="plus"></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

    <tr><td><input type='checkbox' name='cb'/></td><td class="plus"></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

    <tr><td><input type='checkbox' name='cb'/></td><td class="plus"></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

    <tr><td><input type='checkbox' name='cb'/></td><td class="plus"></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

    <tr><td><input type='checkbox' name='cb'/></td><td class="plus"></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

    <tr><td><input type='checkbox' name='cb'/></td><td class="plus"></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

    <tr><td><input type='checkbox' name='cb'/></td><td class="plus"></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

    <tr><td><input type='checkbox' name='cb'/></td><td class="plus"></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

    <tr><td><input type='checkbox' name='cb'/></td><td class="plus"></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

    <tr><td><input type='checkbox' name='cb'/></td><td class="plus"></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

 </tbody>

</table> 

</body> 

</html>

--------------------编程问答-------------------- 发个最终版本，全选的勾选取消，单个触发的全选以及+/-列背景颜色的问题

为了看到效果，图片使用了网络图片

如果改过表格的id的话，样式表的表格id也要改 :-)

<html> 

<head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 

<title></title> 

<style type="text/css"> 

#MyTable{background:#9891C4}

#MyTable thead{background:#B7BAE7}

#MyTable tbody tr{background:#ffffff}

#MyTable tbody tr td.plus{background:#ffffff url(http://country.lvyou168.cn/flashwariii/plus.png) no-repeat center;cursor:pointer;}

#MyTable tbody tr td.minus{background:#ffffff url(http://country.lvyou168.cn/flashwariii/minus.png) no-repeat center;cursor:pointer;}

#MyTable tbody tr.hide{display:none;}

#MyTable tbody tr.focus td{background-color:#DDDEF3;}

</style> 

</head> 

<body> 

<script>

function $(Id){return document.getElementById(Id);}

function $s(o,tagName){return o.getElementsByTagName(tagName);}

function CKALL(checked){

  var cbs=$s($s($('MyTable'),"tbody")[0],"input");

  for(var i=0;i<cbs.length;i++){

    cbs[i].checked=checked;

    cbs[i].parentNode.parentNode.className=checked?"focus":"";

  }

}

function resetClass(o){

  var tbody=$s($('MyTable'),"tbody")[0],tr,trPre;

  var showTr=o.parentNode.nextSibling;

  while(showTr.nodeType!=1)showTr=showTr.nextSibling;//for firefox

  for(var i=1;i<tbody.rows.length;i=i+2){

    tr=tbody.rows[i];

    if(showTr!=tr&&tr.className!='hide'){

      trPre=tr.previousSibling;

      while(trPre.nodeType!=1)trPre=trPre.previousSibling;//for firefox

      trPre.cells[1].className='plus';

      tr.className='hide';

    }

  }

  tr=o.parentNode.nextSibling;

  while(tr.nodeType!=1)tr=tr.nextSibling;//for firefox

  tr.className=o.className=="plus"?"":"hide";

  o.className=o.className=="plus"?"minus":"plus";

}

function rootCheck(){

  var tbody=$s($('MyTable'),"tbody")[0];

  var cka=true;

  for(var i=0;i<tbody.rows.length;i=i+2)

    if($s(tbody.rows[i].cells[0],"input")[0].checked==false){

      cka=false;break;

    }

   $('ckall').checked=cka;

}

document.onclick=function(e){

  e=e||window.event;

  var o=e.srcElement||e.target;

  if(o.id=="ckall")CKALL(o.checked);

  else if(o.name=='cb'){

    o.parentNode.parentNode.className=o.checked?"focus":"";

    if(o.checked)rootCheck();

    else $('ckall').checked=false;

  }

  else if(o.className=="plus"||o.className=="minus")resetClass(o);

}

</script>





<table  width="600" border="0" cellspacing="1" cellpadding="0" id="MyTable"> 

  <thead><tr><td style='width:25px'><input type='checkbox' id='ckall'/></td><td style='width:17px'></td><td>承运人</td><td>转运属性</td><td>离港班期</td></tr></thead>

  <tbody>

  <!--repeater放tbody里面，重复下面说明的两行，绑定下就可以了-->

  <!----需要重复的tr-->

    <tr><td><input type='checkbox' name='cb'/></td><td class='plus'></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

 <!----到此结束-->

    <tr><td><input type='checkbox' name='cb'/></td><td class="plus"></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>   

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

    <tr><td><input type='checkbox' name='cb'/></td><td class="plus"></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

    <tr><td><input type='checkbox' name='cb'/></td><td class="plus"></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

    <tr><td><input type='checkbox' name='cb'/></td><td class="plus"></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

    <tr><td><input type='checkbox' name='cb'/></td><td class="plus"></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

    <tr><td><input type='checkbox' name='cb'/></td><td class="plus"></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

    <tr><td><input type='checkbox' name='cb'/></td><td class="plus"></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

    <tr><td><input type='checkbox' name='cb'/></td><td class="plus"></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

    <tr><td><input type='checkbox' name='cb'/></td><td class="plus"></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

    <tr><td><input type='checkbox' name='cb'/></td><td class="plus"></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

    <tr><td><input type='checkbox' name='cb'/></td><td class="plus"></td><td>ShowBo</td><td>海运直达</td><td>周一</td></tr>

    <tr class='hide'><td colspan='2'></td><td colspan='3'><br/>介绍信息<br/></td></tr>

 </tbody>

</table> 

</body> 

</html>

--------------------编程问答-------------------- 顶 --------------------编程问答-------------------- 大家都是html和js高手,没有一个能用两个GridView嵌套,通过SelectedIndexChanged事件实现的吗? --------------------编程问答--------------------

引用 24 楼 lim62008 的回复:

大家都是html和js高手,没有一个能用两个GridView嵌套,通过SelectedIndexChanged事件实现的吗?

你说的这个方法不建议使用，你可以参考22楼的 --------------------编程问答-------------------- 图片看不到..用客户端实现更合理 --------------------编程问答-------------------- 这个还要等高手.........................

这个太容易了，只要会用repeater or datalist + html +js

很容易搞定的 --------------------编程问答-------------------- 这个是显示+ -图片



<asp:TemplateField>

                    <ItemTemplate>

                        <a href="javascript:expandcollapse('div<%# Eval("CustomerID") %>', 'one');">

                            <img id="imgdiv<%# Eval("CustomerID") %>" alt="Click to show/hide Orders for Customer <%# Eval("CustomerID") %>"  width="9px" border="0" src="plus.gif"/>

                        </a>

                    </ItemTemplate>

</asp:TemplateField>



<asp:TemplateField>

<ItemTemplate>

	<tr>

        <td colspan="100%">

                                <div id="div<%# Eval("CustomerID") %>" style="display:none;position:relative;left:15px;OVERFLOW: auto;WIDTH:97%" >

                                   //这里放一个GRID

                                </div>

                           </ItemTemplate>			       

			    </asp:TemplateField>



function expandcollapse(obj,row)

    {

        var div = document.getElementById(obj);

        var img = document.getElementById('img' + obj);

        

        if (div.style.display == "none")

        {

            div.style.display = "block";

            if (row == 'alt')

            {

                img.src = "minus.gif";

            }

            else

            {

                img.src = "minus.gif";

            }

            img.alt = "Close to view other Customers";

        }

        else

        {

            div.style.display = "none";

            if (row == 'alt')

            {

                img.src = "plus.gif";

            }

            else

            {

                img.src = "plus.gif";

            }

            img.alt = "Expand to show Orders";

        }

    }

--------------------编程问答-------------------- 用ajax就行了 --------------------编程问答-------------------- 我记得孟子做过,他网站上有 --------------------编程问答-------------------- 　　本文描述如何使用嵌套的Repeater 控件来显示分级数据。当然了，你也可以将这一技术应用到其他的列表绑定控件上去，比如DataGrid包含DataGrid，DataList包含DataList等等的组合。

　　绑定到父表

　　1.添加一个新的Web Form 到应用程序项目中，名称为Nestedrepeater.aspx.
　　2.从工具箱托动一个Repeater 控件到这个页面上, 设定其ID 属性为 parent .
　　3.切换到HTML 视图.
　　4.选中下列＜itemtemplate＞代码,复制到Repeater 控件对应的位置。注意，粘贴的时候请使用“粘贴为html”功能。这些语句包含了数据绑定语法，很简单。

＜itemtemplate＞＜b＞＜%# DataBinder.Eval(Container.DataItem, "au_id") %＞＜/b＞＜br＞＜/itemtemplate＞

　　5.打开Nestedrepeater.aspx.cs 这个代码分离文件。降下列代码添加到Page_Load 事件中，其作用是建立一个到 Pubs (这个数据库是sql server的演示数据库。另外在安装.net framework sdk的时候也会安装这个数据库)数据库的连接，并绑定Authors 表到Repeater 控件

public void Page_Load(){　SqlConnection cnn = new SqlConnection("server=(local);database=pubs;uid=sa;pwd=;");　SqlDataAdapter cmd1 = new SqlDataAdapter("select * from authors",cnn);　 DataSet ds = new DataSet();　 cmd1.Fill(ds,"authors");
　 //这里将要插入子表的数据绑定
　 parent.DataSource = ds.Tables["authors"];　 Page.DataBind();　cnn.Close();}

　　6.在文件的头部添加下面的名称空间
　　using System.Data.SqlClient;
　　7.根据你自己的情况修改一下连接字符串
　　8.保存并编译应用程序
　　9.在浏览器中打开这个页面，输出结果类似于下面的格式

172-32-1176 213-46-8915 238-95-7766 267-41-2394 ...

　　绑定到子表

　　1.在页面的HTML视图中，添加下列代码。其目的是增加子Repeater 控件到父Repeater的项目模板中，形成嵌套。

＜asp:repeater id="child" runat="server"＞＜itemtemplate＞＜%# DataBinder.Eval(Container.DataItem, "["title_id"]") %＞＜br＞＜/itemtemplate＞＜/asp:repeater＞

　　2.设置子Repeater 控件的DataSource 属性:

＜asp:repeater ... datasource=’＜%# ((DataRowView)Container.DataItem).Row.GetChildRows("myrelation") %＞’＞

　　3.在页面顶部添加下列指令（请注意，是在.aspx文件中）:

　　＜%@ Import Namespace="System.Data" %＞
　　在.cs文件中,将Page_Load中的注释部分（//这里将要插入子表的数据绑定）替换成下列代码:

SqlDataAdapter cmd2 = new SqlDataAdapter("select * from titleauthor",cnn);cmd2.Fill(ds,"titles");ds.Relations.Add("myrelation",ds.Tables["authors"].Columns["au_id"],ds.Tables["titles"].Columns["au_id"]);

　　4.保存并编译应用程序。
　　.在浏览器中察看修改后的页面。显示格式类似于下面的格式:

172-32-1176 PS3333 213-46-8915 BU1032 BU2075 238-95-7766 PC1035 267-41-2394 BU1111 TC7777 ...

完整的代码

Nestedrepeater.aspx ＜%@ Page Language=C# Inherits="yourprojectname.nestedrepeater" %＞＜%@ Import Namespace="System.Data" %＞
＜html＞＜body＞＜form runat=server＞
＜!-- start parent repeater --＞＜asp:repeater id="parent" runat="server"＞　＜itemtemplate＞　　　＜b＞＜%# DataBinder.Eval(Container.DataItem,"au_id") %＞＜/b＞＜br＞
　　　＜!-- start child repeater --＞　　　＜asp:repeater id="child" datasource=’＜%# ((DataRowView)Container.DataItem).Row.GetChildRows("myrelation") %＞’ runat="server"＞　　　　＜itemtemplate＞　　　　　　＜%# DataBinder.Eval(Container.DataItem, "["title_id"]")%＞＜br＞　　　　＜/itemtemplate＞　　　＜/asp:repeater＞　　　＜!-- end child repeater --＞
　＜/itemtemplate＞＜/asp:repeater＞＜!-- end parent repeater --＞
＜/form＞＜/body＞＜/html＞Nestedrepeater.aspx.cs using System;using System.Data;using System.Data.SqlClient;using System.Web;using System.Web.SessionState;using System.Web.UI;using System.Web.UI.WebControls;
namespace yourprojectname{　public class nestedrepeater : System.Web.UI.Page　 {　　　protected System.Web.UI.WebControls.Repeater parent;　　　public nestedrepeater()　　　{　　　　 Page.Init += new System.EventHandler(Page_Init);　　　}　　　public void Page_Load(object sender, EventArgs e)　　　{　　　　 //Create the connection and DataAdapter for the Authors table.　　　　 SqlConnection cnn = new SqlConnection("server=(local);database=pubs;uid=sa;pwd=;");　　　　 SqlDataAdapter cmd1 = new SqlDataAdapter("select * from authors",cnn);
　　　　 //Create and fill the DataSet.　　　　 DataSet ds = new DataSet();　　　　 cmd1.Fill(ds,"authors");
　　　　 //Create a second DataAdapter for the Titles table.　　　　 SqlDataAdapter cmd2 = new SqlDataAdapter("select * from titleauthor",cnn);　　　　 cmd2.Fill(ds,"titles");
　　　　 //Create the relation bewtween the Authors and Titles tables.　　　　 ds.Relations.Add("myrelation",　　　　 ds.Tables["authors"].Columns["au_id"],　　　　 ds.Tables["titles"].Columns["au_id"]);
　　　　 //Bind the Authors table to the parent Repeater control, and call DataBind.　　　　 parent.DataSource = ds.Tables["authors"];　　　　 Page.DataBind();
　　　　 //Close the connection.　　　　 cnn.Close();　　　}　　　private void Page_Init(object sender, EventArgs e)　　　{　　　　 InitializeComponent();　　　}　　　private void InitializeComponent()　　　{ 　　　　this.Load += new System.EventHandler(this.Page_Load);　　 }　 }}

--------------------编程问答--------------------

引用 9 楼 loverdotnet 的回复:

简单，用js和gridview结合

贴代码哈！ --------------------编程问答-------------------- up --------------------编程问答-------------------- 关注
--------------------编程问答-------------------- 做过,有空再帮你找找代码 --------------------编程问答-------------------- 我想你是要一个GridView嵌套的吧。给你一个我做过的例子。把GridView2放在GridView的一个模板列里面，然后做个换行。
通过div来控制GirdView2的隐藏和显示。



//一张图片是显示的“+”，一张是显示的“-”

function expandcollapse(obj,row)

        {

            var div = document.getElementById(obj);

            var img = document.getElementById('img' + obj);

            

            if (div.style.display == "none")

            {

                div.style.display = "block";

                if (row == 'alt')

                {

                    img.src = "../images/minus.gif";

                }

                else

                {

                    img.src = "../images/minus.gif";

                }

            }

            else

            {

                div.style.display = "none";

                if (row == 'alt')

                {

                    img.src = "../images/plus.gif";

                }

                else

                {

                    img.src = "../images/plus.gif";

                }

            }

        }



<asp:GridView ID="GridView1" Width="100%" AutoGenerateColumns="false" DataKeyNames="id" CssClass="Grid1"

                         ShowFooter="true" runat="server" OnRowDataBound="GridView1_RowDataBound" AllowSorting="true">

                        <Columns>

                            <asp:TemplateField>

                                <ItemTemplate>

                                    <div id="divimg_<%# Eval("id") %>">

                                    <img id="imgdiv<%# Eval("id") %>"  style="cursor:hand" alt="" onclick="expandcollapse('div<%# Eval("id") %>', 'one');" width="9" border="0" src="../images/plus.gif"/>

                                    </div>

                                </ItemTemplate>

                            </asp:TemplateField>

			                <asp:TemplateField>

			                    <ItemTemplate>

			                        <tr>

                                        <td colspan="100%">

                                            <div id="div<%# Eval("id") %>" align="Left" style="display:none;left:15px;position:relative;" >

                                                <asp:GridView ID="GridView2"  Width="670px"

                                                    AutoGenerateColumns="false" runat="server" DataKeyNames="id2" 

                                                     OnRowDataBound="GridView2_RowDataBound">

                                                    <Columns>

                                                        <asp:TemplateField HeaderText="ID2" >

                                                            <ItemTemplate><%# Eval("id2")%></ItemTemplate>

                                                        </asp:TemplateField>

                                                        <asp:TemplateField HeaderText="右闭区间" >

                                                            <ItemTemplate><%# Eval("right_scale")%></ItemTemplate>

                                                        </asp:TemplateField>

                                                        <asp:TemplateField HeaderText="返还值">

                                                            <ItemTemplate><%# Eval("rebate_value")%></ItemTemplate>

                                                        </asp:TemplateField>

                                                    </Columns>

                                               </asp:GridView>

                                            </div>

                                         </td>

                                    </tr>

			                    </ItemTemplate>			       

			                </asp:TemplateField>			    

			            </Columns>

                    </asp:GridView>



           protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)

	   {

	     GridViewRow row = e.Row;

             string strSort = string.Empty;

             if (row.DataItem == null)

             {

                return;

             }



             GridView gv = new GridView();

             gv = (GridView)row.FindControl("GridView2");



             string id = ((DataRowView)e.Row.DataItem)["id"].ToString();//获取GridView当前行的id字段的值

               if (gv.UniqueID == String.Empty)

             {

                gv.PageIndex = 0;

                gv.EditIndex = -1;

                ClientScript.RegisterStartupScript(GetType(), "Expand", "<SCRIPT LANGUAGE='javascript'>expandcollapse('div"

                    + id + "','one');</script>");

             }

             //此处代码是根据id获取要绑定到第二个GridView上的DataTable。

               DataTable dt = table;

             gv.DataSource = dt;

             gv.DataBind();

	  }

补充：.NET技术 ,  ASP.NET