如何在javascript中清除包含gridview行编辑值的文本框

时间:2011-07-04 10:40:19

标签: javascript asp.net asp.net-3.5 asp.net-4.0

我有以下ASP控件:文本框,网格视图,更新按钮和重置按钮。

当我点击gridview行的行编辑按钮时,它会填充文本框中的相应值。

我的问题是,当我点击重置按钮时,它不会清除来自gridview行的文本框值。

function btnReset_onclick() {
   document.getElementById("<%= txtDescription.ClientID %>").value = "";
}

protected void GridViewExpenses_RowEditing(object sender, GridViewEditEventArgs e)
{
     lblExpenseDesc = GridViewExpenses.Rows[e.NewEditIndex].FindControl("lblDescription") as Label;
     txtDescription.Text = lblExpenseDesc.Text;
}

如何清除文本字段?

2 个答案:

答案 0 :(得分:2)

<script type="text/javascript">
    function clearTextBox() {
        document.getElementById('<%= txtTest.ClientID %>').value = "";
    }
</script>
<asp:TextBox ID="txtTest" runat="server" Text="blah blah blah" />
<input type="button" value="Clear" onclick="clearTextBox()" />

这对我有用......

答案 1 :(得分:0)

<强>更新

删除网格的默认编辑按钮(删除CommandField的ShowEditButton =“True”)并在另一个 itemTemplate 中添加链接按钮。同时设置编辑链接按钮的 CommandName属性 进行编辑(这将有助于编辑按钮作为网格的默认编辑)。然后在编辑链接按钮的OnClientClick事件上调用javascript 并在那里执行您的逻辑。另外还有两个链接按钮用于更新和取消,应放在 EditItemTemplate CommandName属性中,每个按钮应设置为<强>更新和取消相应..

请参阅下面的代码以查看实施,

Aspx部门,

     <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" OnRowCancelingEdit="GridView1_RowCancelingEdit"
        OnRowUpdating="GridView1_RowUpdating" OnRowEditing="GridView1_RowEditing">
        <Columns>
            <asp:TemplateField>
                <ItemTemplate>
                    <%# Eval("sample1")%>
                </ItemTemplate>
                <EditItemTemplate>
                    <asp:TextBox ID="txtValue" runat="server"></asp:TextBox>
                </EditItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField>
                <ItemTemplate>
                    <asp:LinkButton ID="lnkBtnEdit" runat="server" Text="Edit" CommandName="edit" OnClientClick="return ClearText(this.id)"></asp:LinkButton>
                </ItemTemplate>
                <EditItemTemplate>
                    <asp:LinkButton ID="lnkBtnUpdate" runat="server" Text="Update" CommandName="update"></asp:LinkButton>
                    &nbsp;
                    <asp:LinkButton ID="lnkBtnCancel" runat="server" Text="Cancel" CommandName="cancel"></asp:LinkButton>
                </EditItemTemplate>
            </asp:TemplateField>
        </Columns>
    </asp:GridView>

Java Script部分,

 <script language="javascript" type="text/javascript">
    function ClearText(btnID)
    { 
        var txtID=btnID.replace("lnkBtnEdit","txtValue");          
        var txtValue=document.getElementById(txtID);            

        alert(txtID);

        txtValue.value="";

        return true;
    }
</script>

代码背后,

    protected void GridView1_RowCancelingEdit(object sender, GridViewCancelEditEventArgs e)
    {
        GridView1.EditIndex = -1;
        populate();
    }

    protected void GridView1_RowUpdating(object sender, GridViewUpdateEventArgs e)
    {
        //do update logic here
        GridView1.EditIndex = -1;
        populate();
    }

    protected void GridView1_RowEditing(object sender, GridViewEditEventArgs e)
    {
        GridView1.EditIndex = e.NewEditIndex;
        populate();
    }

希望这可以帮助你...