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

本文关键字:文本 另一个 输入 gridview javascript 使用 于输入 一个 何更新 更新 | 更新日期: 2023-09-27 18:01:37

我有一个gridview,其中我有两个文本框。在这种情况下,我在一个文本框(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>

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

您可以为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进行必要的检查。

失败…缺乏以上的理解……把脚本放在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。

您也可以在服务器端这样做

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