Question

这是对我上一个问题的跟进： link text

在gridview的列中，我有一个linkbutton和一个标签。

我想在点击链接按钮时隐藏/取消隐藏标签。我使用javascript，因为我不想要任何回发。代码：

protected void gvwComments_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            LinkButton lButton =  ((LinkButton)e.Row.Cells[2].FindControl("lbtnExpand"));
            Label label = ((Label)e.Row.Cells[2].FindControl("lblBody"));
            lButton.Attributes.Add("onclick",  string.Format("HideLabel('{0}'); return false;", label.ClientID));

        }
    }



function HideLabel(button) {

            var rowObj = document.getElementById(button);


            if (rowObj.style.display == "none") {
                rowObj.style.display = "block";

            }
            else {
                rowObj.style.display = "none";

            }

        }

问题在于，当我通过单击按钮取消隐藏标签时，链接按钮会在单元格中的原始位置稍微移位一点。是否可以在gridviews单元格中保留linkbutton的位置？

Answer 1

我建议你改变你的CSS从display：none to display：hidden会隐藏控件但保留空间以防止跳转。

Answer 2

诀窍是使用关键字“this”，然后获取对该行的引用并从那里更改标签。

我有一个帖子here，其中我有一个带有CheckBox列和Name列的GridView。选中CheckBox时，该行上Name的背景颜色会发生变化。我从CheckBox的列中的这个属性开始这样做：

onclick="toggleSelected(this)"

然后我有一个JavaScript函数找到行并更改下一个单元格：

function toggleSelected(sender) {
    // note that at this point the "this" is now "sender" -which is the checkbox
    // get a reference to the row using the helper function - see below.
    var row = GetParentElementByTagName(sender, "TR");

    if (sender.checked)
        row.cells[1].className = "selected";
    else
        row.cells[1].className = '';

}

这使用辅助函数：

function GetParentElementByTagName(element, tagName) {
    var element = element;
    while (element.tagName != tagName)
        element = element.parentNode;
    return element;
}

您的要求略有不同，因此您可以使用以下内容：

var lbl = row.cells[1].childNodes[0].getElementsByTagName('label')

获取对您的标签的引用。

在Gridview列中隐藏/取消隐藏控制 - 移位问题

2 个答案: