[ASP.NET]C1Webgrid中实现编辑和计算

在WebGrid/GridView等控件中，经常遇到需要编辑列，然后计算的应用，以下是一些经验。

应用需求

下面的代码可能与实际不符，因使用的本来是C1WebGrid和C1WebNumbericEdit。

<C1WebGrid:C1WebGrid ID="cwgRealSingle" runat="server"
                                AutoGenerateColumns="False" BackColor="White"
                                BorderStyle="Solid" BorderWidth="1px" BorderColor="ActiveBorder" CallbackOptions="Sorting" CellPadding="3"
                                Font-Names="Verdana" Font-Size="11px" Width="100%" Height="100%"
                                CssClass="gridView" onitemcreated="cwgRealSingle_ItemCreated"
                                oneditingcommand="cwgRealSingle_EditingCommand"
                                oncancelingcommand="cwgRealSingle_CancelingCommand"
                                onupdatingcommand="cwgRealSingle_UpdatingCommand">
                                <footerstyle backcolor="White" />
                                <selecteditemstyle backcolor="#669999" forecolor="White" BorderColor="AliceBlue" BorderWidth="1px" BorderStyle="Solid"/>
                                <Columns>
                                    <C1WebGrid:C1TemplateColumn Visible="False" HeaderText="项目代码">
                                        <ItemTemplate>
                                            <asp:Label ID="lblItemName" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.itemname") %>' Width="80%"></asp:Label>
                                        </ItemTemplate>
                                    </C1WebGrid:C1TemplateColumn>
                                    <C1WebGrid:C1BoundColumn DataField="workProcId" Visible="False" HeaderText="工序名称"></C1WebGrid:C1BoundColumn>
                                    <C1WebGrid:C1BoundColumn DataField="workprocname" HeaderText="工序名称"
                                        RowMerge="Free" ReadOnly="True"></C1WebGrid:C1BoundColumn>
                                    <C1WebGrid:C1TemplateColumn HeaderText="计划产量" RowMerge="Restricted">
                                        <EditItemTemplate>
                                           <c1i:c1webnumericedit id="txtOutput" runat="server" width="92%" updownalign="None" text='<%# DataBinder.Eval(Container, "DataItem.Output") %>'
                                            maxvalue="1E+28" height="22px" __designer:wfdid="w2" OnClientTextChanged="calcTotal(this);" ></c1i:c1webnumericedit>
                                        </EditItemTemplate>
                                        <ItemTemplate>
                                           <asp:Label ID="lblOutput" runat="server" Width ="80%" Text='<%# DataBinder.Eval(Container, "DataItem.Output") %>'></asp:Label>
                                        </ItemTemplate>
                                    </C1WebGrid:C1TemplateColumn>
                                    <C1WebGrid:C1BoundColumn DataField="energyid" HeaderText="能介代码" Visible="False"></C1WebGrid:C1BoundColumn>
                                    <C1WebGrid:C1BoundColumn DataField="energyname" HeaderText="能介名称"
                                        ReadOnly="True"></C1WebGrid:C1BoundColumn>
                                    <C1WebGrid:C1BoundColumn DataField="keyname" HeaderText="属性代码" Visible="False"></C1WebGrid:C1BoundColumn>
                                    <C1WebGrid:C1BoundColumn DataField="Propertyname" HeaderText="属性"
                                        ReadOnly="True"></C1WebGrid:C1BoundColumn>
                                    <C1WebGrid:C1BoundColumn DataField="Compute_Consingel" DataFormatString="{0:0.00}"
                                        HeaderText="推荐单耗" ReadOnly="True">
                                    </C1WebGrid:C1BoundColumn>
                                    <C1WebGrid:C1TemplateColumn HeaderText="修正单耗">
                                        <EditItemTemplate>
                                            <table>
                                               <tr>
                                                   <td>
                                                         <asp:DropDownList ID="ddlConsumpt" runat="server" OnSelectedIndexChanged="ddlConsumpt_SelectedIndexChanged" AutoPostBack="true" Width="120px"></asp:DropDownList>
                                                   </td>
                                                   <td>
                                                          <c1i:c1webnumericedit id="txtConsumpt" runat="server" width="92%" updownalign="None" text='<%# DataBinder.Eval(Container, "DataItem.Plan_Consingel") %>'
                                            maxvalue="1E+28" height="22px" __designer:wfdid="w2" OnClientTextChanged="calcTotal(this);" ></c1i:c1webnumericedit>
                                                    </td>
                                                </tr>
                                            </table>
                                        </EditItemTemplate>
                                        <ItemTemplate>
                                           <asp:Label ID="lblPlan_cons" runat="server" Width ="80%" Text='<%# DataBinder.Eval(Container, "DataItem.Plan_Consingel") %>'></asp:Label>
                                        </ItemTemplate>
                                    </C1WebGrid:C1TemplateColumn>
                                    <C1WebGrid:C1TemplateColumn HeaderText="计划量">
                                        <EditItemTemplate>
                                            <asp:TextBox ID="txtValues" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.Values") %>' Width="80%"></asp:TextBox>
                                        </EditItemTemplate>
                                        <ItemTemplate>
                                            <asp:Label ID="lblValues" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.Values") %>' Width="80%"></asp:Label>
                                        </ItemTemplate>
                                    </C1WebGrid:C1TemplateColumn>
                                    <C1WebGrid:C1EditCommandColumn EditText="修改" HeaderText="修改" CancelText="取消"
                                        UpdateText="保存">
                                    </C1WebGrid:C1EditCommandColumn>
                                </Columns>
                                <itemstyle verticalalign="Middle" horizontalalign="Center" BorderColor="Control" />
                                <pagerstyle backcolor="White" horizontalalign="Left" />
                                <headerstyle font-bold="True" forecolor="White" verticalalign="Middle" cssclass="gt" />
                            </C1WebGrid:C1WebGrid>

触发计算

在C1WebGrid中，可直接使用C1WebNumbericEdit控件的OnClientValueChanged事件，代码如下：

OnClientTextChanged="calcTotal(this);"

处理的JS脚本如下：

<script type="text/javascript">
        function calcTotal(source )
        {
            var row_id = source.id.substr(0, source.id.lastIndexOf('_') + 1);
            var textbox1 = document.getElementById(row_id + 'txtOutput');
            var textbox2 = document.getElementById(row_id + 'txtConsumpt');
            var label = document.getElementById(row_id + 'txtValues');
            label.value = Number(textbox1.value) * Number(textbox2.value);
        }
    </script>

否则的话，需要处理TextBox的客户端事件（实际上此时TextBox已经被替换为Input标签了，也只能使用Input的事件，据说可以直接使用OnTextChanged事件），即处理GridView的RowDataBound事件。下面的代码是在编辑时，如果需要为下拉框绑定值时使用的。如果只是添加TextBox的值改变，可以如下面注释的代码一样，添加txtUnit.Attributes.Add(“onblur”,"'onblur”)。

     protected void cwgRealSingle_ItemCreated(object sender, C1ItemEventArgs e)
     {
         if (e.Item.ItemType == C1.Web.C1WebGrid.C1ListItemType.EditItem)
         {
             DropDownList ddl = e.Item.Cells[9].FindControl("ddlConsumpt") as DropDownList;
             if (ddl == null) return;

             // 添加事件
             //ddl.Attributes.Add("onchange","changeddl(this);");

             // 添加下拉框数据和绑定默认值
             PlanComputeV compute = e.Item.DataItem as PlanComputeV;

             BindDropDown(ddl, compute);
         }
     }

在下拉框的处理事件中，因为SelectedIndexChanged事件只有在点击保存按钮中提交回发时才会触发，为了简便，使用了以下方法：

1.  设置C1WebGrid的AutoPostBack事件为True；

2.  为了保存滚动条位置，设置了页面的MaintainScrollPositionOnPostback为True。

这样下拉的时候会有明显的刷新页面操作，在数据量大或者网络差得情况下性能很成问题，有待完善。可以用Updatepanel包含GridView，临时解决。

遗留问题

1. RowDataBound和RowCreated事件的区别？
2. 对于非编辑字段，需要将Readonly设置为True才能在编辑时查看数据？
3. 在VS2008中，RowUpdating事件中无法取到Label的值（TextBox等可以），使用Request.Form也不能获取，据说VS2005中可以？