Question

尝试使用以下脚本隐藏文本框：

function EnableTextBox(clientId2, clientId1) {

        var label = eval("document.getElementById('" + clientId2 + "')");
        var textBox = eval("document.getElementById('" + clientId1 + "')");

        if (label.Visible == true) {
            label.Visible = false;
            textBox.Visible = true;
        }
        else {
            label.Visible = true;
            textBox.Visible = false;
        }
    }

文本框与标签位于同一单元格中，并且在gridview_ondatabound事件期间在后面的代码中创建事件：

if (e.Row.RowType == DataControlRowType.DataRow)
        {
            Label lblNotes = (Label)(e.Row.Cells[1].Controls[1]);
            TextBox tbNotes = (TextBox)(e.Row.Cells[1].Controls[3]);

            if (lblNotes != null)
            {

                lblNotes.Attributes.Add("methodstring", string.Format("EnableTextBox('{0}', '{1}')", lblNotes.ClientID, tbNotes.ClientID));
                lblNotes.Attributes.Add("onClick", "eval(this.methodstring)");
            }
        }

我还没有解决的问题是我的脚本中的变量tbNotes仍处于null状态。有什么建议吗？

由于

Answer 1

你几乎就在那里，你只需要使用style.display来显示/隐藏元素。

在以下代码中，将显示一个文本框，如果单击该标签，则会隐藏标签。

根据你的逻辑，我不知道隐藏后如何显示标签。

ASPX

<asp:GridView runat="server" ID="GridView1"
    AutoGenerateColumns="False" OnRowDataBound="GridView1_RowDataBound">
    <Columns>
        <asp:TemplateField>
            <ItemTemplate>
                <asp:Label runat="server" ID="NotesLabel" 
                    Text='<%# Eval("Notes") %>' />
                <asp:TextBox runat="server" ID="NotesTextBox" 
                    Text='<%# Eval("Notes") %>' />
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>
<script type="text/javascript">
    function enableTextBox(label, textbox) {
        var lbl = document.getElementById(label);
        var txt = document.getElementById(textbox);

        if (lbl.style.display == "" || lbl.style.display == "block") {
            lbl.style.display = "none";
            txt.style.display = "block";

        } else {
            lbl.style.display = "block";
            txt.style.display = "none";
        }
    }
</script>

代码背后

protected override void OnLoad(EventArgs e)
{
    if (!IsPostBack)
    {
        GridView1.DataSource = new List<Something>
        {
            new Something {Id = 1, Notes = "One"},
            new Something {Id = 2, Notes = "Two"},
        };
        GridView1.DataBind();
    }
}

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        var notesLabel = e.Row.FindControl("NotesLabel") as Label;
        var notesTextBox = e.Row.FindControl("NotesTextBox") as TextBox;

        notesLabel.Attributes.Add("onclick", 
            string.Format("enableTextBox('{0}', '{1}')", 
            notesLabel.ClientID, notesTextBox.ClientID));
    }
}

public class Something
{
    public string Notes { get; set; }
    public int Id { get; set; }
}

注意： jQuery可能更容易，但它超出了范围。

Answer 2

使用e.Row.FindControl("ID_OF_CONTROL")而非尝试浏览子集合。

if (e.Row.RowType == DataControlRowType.DataRow)
{
     Label lblNotes = e.Row.FindControl("lblNotes") AS Label; // Proper Id of the control
     TextBox tbNotes = e.Row.FindControl("tbNotes ") AS TextBox; // Proper Id of the control

     if (lblNotes != null && tbNotes !=null)
     {
         lblNotes.Attributes.Add("methodstring", string.Format("EnableTextBox('{0}', '{1}')", lblNotes.ClientID, tbNotes.ClientID));
         lblNotes.Attributes.Add("onClick", "eval(this.methodstring)");
     }
 }

在javascript中隐藏文本框

2 个答案:

ASPX

代码背后