【玩转GridView】之让GridView动起来(一)

概述：

    这次，小编带大家看看如何让你的gridview动起来.整个功能大概流程是;当点击左侧gridview中某一行，查询相应的12月数据显示到右侧gridview中，对于没有数据的，显示默认数据。之后可对右侧gridview数据进行编辑，再保存。

            如下图：就是右侧gridview，也是这篇博客的主角.

    说明：这里直接用文本框代替了那些需要编辑数据的列。当前两列金额数发生变化时，对应的总额会自动更新。根据实际需求，复制按钮可将12列数据同时填充。方便用户进行相同数据的输入操作。

    接下来看看，界面是如何拼出来的.

前台代码：

<asp:AdvGridView ID="grvDetail" runat="server" CssClass="QueryList" ShowHeaderWhenEmpty="true"       OnRowDataBound="grvDetail_RowDataBound" OnRowUpdating="grvDetail_RowUpdating"      OnRowCommand="grvDetail_RowCommand" HeaderStyle-CssClass="QueryTop" Width="99%">    <Columns>        <asp:BoundField DataField="SYearMonth" ItemStyle-Width="70" HeaderText="**" SortExpression="t.S_YEAR_MONTH"/>        <asp:TemplateField HeaderText="**" ItemStyle-CssClass="tcTdLeftWrap" HeaderStyle-CssClass="TdLeft" SortExpression="t.N_FEE_QUOTA">           <ItemTemplate>             <asp:TextBox ID="feeQuota" runat="server" CssClass="numTxt" MaxLength="12" Width="100px"                   Text='<%# Bind("NFeeQuota") %>'></asp:TextBox>             <asp:LinkButton ID="lblCopy" Text="复制" runat="server" Width="35px" CausesValidation="False"                   CommandName="LoadData" Visible="false"></asp:LinkButton>          </ItemTemplate>      </asp:TemplateField>      <asp:TemplateField HeaderText="**" ItemStyle-CssClass="tcTdLeftWrap" HeaderStyle-CssClass="TdLeft">           <ItemTemplate>              <asp:TextBox ID="adjQuota" runat="server" CssClass="numTxt" MaxLength="12" Width="100px"                   Text='<%# Bind("NAdjQuota") %>'></asp:TextBox>           </ItemTemplate>      </asp:TemplateField>     <asp:TemplateField HeaderText="**" ItemStyle-CssClass="tcTdLeftWrap" HeaderStyle-CssClass="TdLeft">          <ItemTemplate>              <asp:TextBox ID="adjComment" runat="server" CssClass="numTxt" MaxLength="12" Width="200px"                    Text='<%# Bind("SAdjComment") %>'></asp:TextBox>          </ItemTemplate>     </asp:TemplateField>     <asp:BoundField runat="server" DataField="NCost" ItemStyle-Width="70" HeaderText="**" />     <asp:TemplateField HeaderText="**" ItemStyle-CssClass="tcTdLeftWrap" HeaderStyle-CssClass="TdLeft">         <ItemTemplate>             <asp:AdvDropDownList ID="level" runat="server" Height="16px" Width="100" Text='<%# Bind("SLevel") %>'>                   <asp:ListItem Text="**" Value="0"></asp:ListItem>                   <asp:ListItem Text="**" Value="1"></asp:ListItem>                   <asp:ListItem Text="**" Value="2"></asp:ListItem>             </asp:AdvDropDownList>             <asp:LinkButton ID="lbCopy" runat="server" Width="35px" Text="复制" CausesValidation="False"                   CommandName="Load" Visible="false"></asp:LinkButton>             <asp:HiddenField ID="FqID" runat="server" Value='<%#Eval("SFqId") %>'></asp:HiddenField>         </ItemTemplate>     </asp:TemplateField>   </Columns></asp:AdvGridView>

说明: 

      1.上述代码中，主要用到了上篇博客所述的TemplateField模板.在模板中嵌入需要的文本框和LinkButton，下拉框等，来完成相关编辑操作.

      2.将查询结果用以下语句绑定在模板中的文本框上，就使得查询结果直接在文本框中显示了.

                    Text='<%# Bind("SAdjComment") %>'>

    

   再看看，嵌入Griview中的"复制"按钮是如何在后台完成复制操作的.

后台代码：

    #region 设置"复制"按钮只在第一行显示    /// <summary>    /// gridview行绑定事件    /// </summary>    /// <param name="sender"></param>    /// <param name="e"></param>    protected void grvDetail_RowDataBound(object sender, GridViewRowEventArgs e)    {        if (e.Row.RowType == DataControlRowType.DataRow && e.Row.RowIndex == 0)        {            LinkButton btCopy = (LinkButton)e.Row.FindControl("lblCopy");            btCopy.Visible = true;            btCopy.CommandName = "Load";            LinkButton btnCopy = (LinkButton)e.Row.FindControl("lbCopy");            btnCopy.Visible = true;            btnCopy.CommandName = "LoadData";        }    }    #endregion    #region "复制"按钮事件    /// <summary>    /// gridview行命令事件    /// </summary>    /// <param name="sender"></param>    /// <param name="e"></param>    protected void grvDetail_RowCommand(object sender, GridViewCommandEventArgs e)    {        if (e.CommandName == "Load")        {            #region 获取第一行文本框的金额数            TextBox FeeQuota = (TextBox)grvDetail.Rows[0].FindControl("feeQuota");            string fee = FeeQuota.Text.Replace(" ", "").Trim();            for (int i = 0; i < grvDetail.Rows.Count; i++)            {                //将第一行获得的金额数复制到12个月中                TextBox txtFee = (TextBox)grvDetail.Rows[i].FindControl("feeQuota");                txtFee.Text = fee;                TextBox txtAll = (TextBox)grvDetail.Rows[i].FindControl("adjQuota");                String allFee=txtAll.Text;                grvDetail.Rows[i].Cells[4].Text = Convert.ToString(Convert.ToDouble(fee) + Convert.ToDouble(allFee));            }            #endregion        }        if (e.CommandName == "LoadData")        {            #region 获取第一行下拉框的值            DropDownList Level = (DropDownList)grvDetail.Rows[0].FindControl("level");            string slevel = Level.Text.Replace(" ", "").Trim();            int num = 0;            num = Level.SelectedIndex;            for (int i = 0; i < grvDetail.Rows.Count; i++)            {                //将一行的下拉框值填充到12个月数据                DropDownList ddlLevel = (DropDownList)grvDetail.Rows[i].FindControl("level");                ddlLevel.SelectedIndex = num;            }            #endregion        }    }    #endregion

说明: 

      上述代码中，使用的方法都是gridview本身所拥有的方法和属性.除此之外，gridview还有好多常用属性(RowDataBound.RowUpdating.RowEditing.RowDeleting.Sorting)等，在下篇博客中我们会接触到这些.

总结：

    这篇博客主要是讲：当需要在gridview 中直接对数据进行操作，可用TemplateField模板和gridview的属性进行结合，来达到所需要的效果.

    这种方式是最初做的时候，自己的一个思路和实现方式.在之后的项目过程中，发现了一种更加方便用户，界面友好的方式来实现同样效果.
    下篇博客，继续这个话题~~