Question

我有一个gridview，其中有两个文本框。 senarios是这样的，我输入一个（txtCharges）的值应该在另一个文本框（txtTotalCharges）中为* 10。如何使用javascript实现这一目标？ gridview的标记代码如下：

<asp:GridView ID="grdFixedMontlhy" CssClass="gridview" runat="server" AutoGenerateColumns="False"
        Width="100%">
        <RowStyle CssClass="gridviewItemStyle" HorizontalAlign="center" />
        <Columns>
            <asp:CheckBoxField Text="Select" />
            <asp:BoundField DataField="Bill_HeadName" HeaderText="Head" />
            <asp:BoundField DataField="Applicable_Charges_Category_Text" HeaderText="Type" />
            <asp:TemplateField HeaderText="Charges" ItemStyle-CssClass="gridviewColumnControls">
                <ItemTemplate>
                    <asp:TextBox ID="txtCharges" runat="server" Text='<%# Bind("Charges") %>'></asp:TextBox>
                    <asp:FilteredTextBoxExtender ID="txtCharges_FilteredTextBoxExtender" runat="server"
                        Enabled="True" TargetControlID="txtCharges" ValidChars="0123456789.">
                    </asp:FilteredTextBoxExtender>
                </ItemTemplate>
                <ItemStyle CssClass="gridviewColumnControls" />
            </asp:TemplateField>
            <asp:TemplateField HeaderText="Days" ItemStyle-CssClass="gridviewColumnControls">
                <asp:TemplateField HeaderText="Total Charges" ItemStyle-CssClass="gridviewColumnControls">
                    <itemtemplate>
                        <asp:TextBox ID="txtTotalCharges" runat="server" Text=""></asp:TextBox>
                        <asp:FilteredTextBoxExtender ID="txtTotalCharges_FilteredTextBoxExtender" 
                            runat="server" Enabled="True" TargetControlID="txtTotalCharges" 
                            ValidChars="0123456789.">
                        </asp:FilteredTextBoxExtender>
                    </itemtemplate>
                    <itemstyle cssclass="gridviewColumnControls" />
                </asp:TemplateField>
        </Columns>
    </asp:GridView>

提前致谢。

Answer 1

您可以为txtCharges添加onKeyUp javascript事件，如下所示

<asp:TextBox ID="txtCharges" runat="server" Text='<%# Bind("Charges")%>' onkeyup="calculateTotalCharge(this);"></asp:TextBox>

现在Javascript如下

<script type="text/javascript">
function calculateTotalCharge(elem)
{
       var totChargeid = $(elem).attr("id").replace('_txtCharges', '_txtTotalCharges');
       $('#' + totChargeid).val(parseInt($(elem).val())*10);
}
</script>

此外，您必须为NAN进行必要的检查。希望这对你有所帮助。

Answer 2

失败......上面缺乏理解...... 将脚本放在suryakiran建议的页面上（略有改动）......

<script type="text/javascript">
function calculateTotalCharge(charge, total)
{
       $(total).val(parseInt($(charge).val())*10);
}
</script>

// in grid template
<asp:Textbox onkeyup='calculateTotalCharge(this, <%= totalchargestextbox.clientid %>)' ... />

作为txtCharges框的属性。这样，总计框的每个行动态id在被调用时传递给客户端上的js。

Answer 3

您也可以在服务器端执行此操作

<asp:TextBox ID="txtTotalCharges" runat="server" Text='<%# Convert.ToString(Convert.ToInt32(DataBinder.Eval(Container.DataItem, "Charges"))*10 )></asp:TextBox>

如何使用javascript更新基于gridview中另一个文本框输入的文本框的值？

3 个答案: