DataGrid Web控件深度历险(三) 3

分类: asp.net   出处:iocblog整理  更新时间:2008-10-05   添加到收藏  


  在本文第二部分我们研究了如何通过buttoncolumn标记在datagrid中显示按钮。此外,我们考察了如何将事件处理程序与按钮的点击联系起来。下面我们将了解到如何判断datagrid中哪一行的按钮被点击并且基于这些信息执行相应的动作。
  
  判断哪一行的按钮被点击
  
  回想一下点击按钮的事件处理程序定义如下:
  
  sub eventhandlername(sender as object, e as datagridcommandeventargs)
  ...
  end sub
  
  datagridcommandeventargs类包含一个item属性,该属性包含了触发该事件的源对象。item属性是tablerow类的一个实例,它指向datagrid中被点击的那一行。可使用cells属性访问tablerow类中的列。例如有一个datagrid,它的列信息定义如下:
  
  <asp:datagrid runat="server" ... >
  <columns>
  <asp:buttoncolumn text="details" headertext="faq details" commandname="details" />
  <asp:boundcolumn datafield="faqid" headertext="faq id" />
  <asp:boundcolumn datafield="description" headertext="faq description" />
  </columns>
  </asp:datagrid>
  
  那么在点击按钮的事件处理程序中,可通过以下方法获得被点击行的某一列的值:
  
  sub detailsclicked(sender as object, e as datagridcommandeventargs)
  dim buttoncolumn as tablecell = e.item.cells(0)
  dim faqidcolumn as tablecell = e.item.cells(1)
  dim desccolumn as tablecell = e.item.cells(2)
  
  dim buttoncoltext as string = buttoncolumn.text
  dim faqidcoltext as string = faqidcolumn.text
  dim desccoltext as string = desccolumn.text
  end sub
  
  示例运行结果如下:
  
  更新按钮事件处理程序后的datagrid示例
  
  本示例展示了一个包含detail按钮的datagrid web控件并演示了当按下按钮时如何触发一段代码。注意点击某个detail按钮后你会看到被点击按钮所在行的信息。
  
  value of clicked button column text:
  value of faqid column text: 181
  value of clicked description column text: how can i format numbers and date/times using asp.net? for example, i want to format a number as a currency.
  
  faq details
  faq id
  faq description
  
  144
  where can i host my asp web site for free (similar to geocities or tripod or any of the many other free web site sites)?
  
  
  181
  how can i format numbers and date/times using asp.net? for example, i want to format a number as a currency.
  
  …
  
  源代码
  
  <% @import namespace="system.data" %>
  <% @import namespace="system.data.sqlclient" %>
  <script language="vb" runat="server">
  sub page_load(sender as object, e as eventargs)
  if not page.ispostback then
  binddata()
  end if
  end sub
  
  
  sub binddata()
  '1. create a connection
  dim myconnection as new sqlconnection(configurationsettings.appsettings("connectionstring"))
  
  '2. create the command object, passing in the sql string
  const strsql as string = "sp_popularity"
  dim mycommand as new sqlcommand(strsql, myconnection)
  
  'set the datagrid's datasource to the datareader and databind
  
  myconnection.open()
  dgpopularfaqs.datasource = mycommand.executereader(commandbehavior.closeconnection)
  dgpopularfaqs.databind()
  end sub
  
  
  sub dispdetails(sender as object, e as datagridcommandeventargs)
  dim buttoncolumn as tablecell = e.item.cells(0)
  dim faqidcolumn as tablecell = e.item.cells(1)
  dim desccolumn as tablecell = e.item.cells(2)
  
  dim buttoncoltext as string = buttoncolumn.text
  dim faqidcoltext as string = faqidcolumn.text
  dim desccoltext as string = desccolumn.text
  
  lblbct.text = buttoncoltext
  lblfct.text = faqidcoltext
  lbldct.text = desccoltext
  end sub
  </script>
  
  <form runat="server">
  <b>value of clicked button column text</b>:
  <asp:label id="lblbct" runat="server" /><br />
  
  <b>value of faqid column text</b>:
  <asp:label id="lblfct" runat="server" /><br />
  
  <b>value of clicked description column text</b>:
  <asp:label id="lbldct" runat="server" /><br />
  
  <asp:datagrid runat="server" id="dgpopularfaqs"
  backcolor="#eeeeee" width="85%"
  horizontalalign="center"
  font-name="verdana" cellpadding="4"
  font-size="10pt" autogeneratecolumns="false"
  onitemcommand="dispdetails">
  <headerstyle backcolor="black" forecolor="white" font-bold="true" horizontalalign="center" />
  <alternatingitemstyle backcolor="white" />
  
  <columns>
  <asp:buttoncolumn text="details" headertext="faq details" commandname="details" buttontype="pushbutton" />
  <asp:boundcolumn datafield="faqid" headertext="faq id" />
  <asp:boundcolumn datafield="description" headertext="faq description" />(来源www.iocblog.net)
  </columns>
  </asp:datagrid>
  </form>
  
  请仔细检查上面的示例。你可能注意到的第一件事就是按钮列不包含任何文本。这是因为仅需通过html即可显示按钮,因此tablecell的text属性返回了一个空字符串。
  
  在本文开始部分我讲述了一个电子商务公司的场景,该公司希望显示部分货运信息,但同时提供显示所有货运信息的选择。到目前为止的示例中,我们仅显示了sp_popularity存储过程返回列中的一小部分列。想象一下我们仅希望显示最受欢迎的常见问题的描述列,然后提供一个detail按钮允许用户查看某个常见问题的其余信息。
  
  虽然我们不希望在datagrid中显示faqid列,但是我们仍然需要为detialsclicked事件处理程序提供该信息,因为它数据库中表的关键字并唯一标识了每个常见问题。通过对datagrid标记进行小小的改动(在与数据库中faqid列对应的boundcolumn标记中增加visible= "false"),我们仍然能够传递该信息。此改动隐藏了faqid列,但仍然允许detailclicked事件处理程序访问某个常见问题的标识(通过e.item.cells(1).text)。
  
  因此我们所要做的就是改写detailsclicked事件处理程序,以便当它被触发时获得用户希望显示的那个常见问题的信息,然后再显示该常见问题的详细信息。在阅读了一系列关于如何使用datagrid的文章后,当需要显示数据库中的数据时,你的第一个想法应该就是使用datagrid。因此我们的页面看起来应该是这样:
  
  <script language="vb" runat="server">
  sub page_load(sender as object, e as eventargs)
  if not page.ispostback then
  binddata() 'only bind the data on the first page load
  end if
  end sub
  
  
  sub binddata()
  'make a connection to the database
  'databind the datareader results to the gpopularfaqs datagrid.
  end sub
  
  
  sub detailsclicked(sender as object, e as datagridcommandeventargs)
  'get detailed information about the selected faq and bind
  'the database results to the dgfaqdetails datagrid
  end sub
  </script>
  
  <form runat="server">
  <asp:datagrid runat="server" id="dgfaqdetails" ... >
  ...
  </asp:datagrid>
  
  <asp:datagrid runat="server" id="dgpopularfaqs" ... >
  <columns>
  <asp:buttoncolumn text="details" headertext="faq details"
  buttontype="pushbutton" />
  <asp:boundcolumn datafield="faqid" visible="false" />
  <asp:boundcolumn datafield="description" headertext="faq description" />
  </columns>
  </asp:datagrid>
  </form>
  
  示例运行结果如下:
  
  本示例展示了如何在datagrid的每一行中显示概要信息和一个detail按钮,当按钮被点击时,对所选择的数据项显示其余信息。
  
  category name
  faq description
  views
  author
  author's email
  date added
  
  getting started
  where can i host my asp web site for free (similar to geocities or tripod or any of the many other free web site sites)?
  163,148
  scott mitchell
  mitchell@4guysfromrolla.com
  03-20-2001
  
  faq details
  faq description
 (来源www.iocblog.net)


Tag: DataGrid ,Web控件