GridView中录入数量及单价的时候自动算出金额

 

在DataGrid中有3个模板列包含Textbox分别为 DG_ShuLiang (数量) DG_DanJian(单价) DG_JinE(金额)分别在5.6.7列，要求在录入数量及单价的时候自动算出金额即:数量*单价=金额还要求录入时限制为 数值型.我如何用客户端脚本实现这个功能?

<asp:GridView ID="GridView1" runat="server" BackColor="White" BorderColor="#CC9966"

            BorderStyle="None" BorderWidth="1px" CellPadding="4" AutoGenerateColumns="False" Width="440px">

<Columns>

<asp:TemplateField HeaderText="数量">

 <ItemTemplate>

  <asp:TextBox id="ShuLiang" runat='server' Text='<%# DataBinder.Eval(Container.DataItem,"DG_ShuLiang")%>'

        onkeyup="javascrip:DoCal()"/>

  <asp:RegularExpressionValidator id="revS" runat="server"

           ControlToValidate="ShuLiang" ErrorMessage="must be integer" ValidationExpression="^/d+$" />

</ItemTemplate>

</asp:TemplateField>

<asp:TemplateField HeaderText="单价">

 <ItemTemplate>

  <asp:TextBox id="DanJian" runat='server' Text='<%# DataBinder.Eval(Container.DataItem,"DG_DanJian")%>' 

        onkeyup="javascrip:DoCal()"/>

  <asp:RegularExpressionValidator id="revS2" runat="server"

        ControlToValidate="DanJian" ErrorMessage="must be numeric" ValidationExpression="^/d+(/./d*)?$" />

 </ItemTemplate>

</asp:TemplateField>

<asp:TemplateField HeaderText="金额">

 <ItemTemplate>

  <asp:TextBox id="JinE" runat='server' Text='<%# DataBinder.Eval(Container.DataItem,"DG_JinE")%>'/>

 </ItemTemplate>

</asp:TemplateField>

 

 

</Columns>

</asp:gridview>

    </div>

    </form>

<script language="javascript">

function DoCal()

{

  var e = event.srcElement;

  var row = e.parentNode.parentNode;

  var txts = row.all.tags("INPUT");

  if (!txts.length || txts.length < 3)

     return;

  var q = txts[txts.length-3].value;

  var p = txts[txts.length-2].value;

  if (isNaN(q) || isNaN(p))

     return;

  q = parseInt(q);

  p = parseFloat(p);

  txts[txts.length-1].value = (q * p).toFixed(2);

}

</script>