首页 文章

Gridview编辑更新删除按行单击Asp.net

提问于
浏览 次
3

更新和取消按钮不起作用，这些按钮在gridview外侧

Scenario: 默认的asp.net gridview设计的问题是GridView编辑列总是占用一些屏幕空间 . 此外，在编辑模式下，GridView会水平扩展，从而干扰页面布局 . 这就是为什么我想渲染一个可编辑的GridView而不显示默认的编辑，更新和取消按钮

Example:

enter image description here

What i have done already

当您看到Gridview的html源代码时，您会发现以下编辑，更新，取消链接按钮以及名为dopostback的事件

e.g

<a href="javascript:__doPostBack(ctl00$ContentPlaceHolder1$GridView2;Edit${1};)">Edit</a>

如果以某种方式生成相同的上述脚本并为某个客户端事件（例如单击按钮）执行它，那么您实际上可以将相同的命令发送到GridView控件 . 最简单的方法是处理GridView控件的RowDataBound事件，所以我决定在Gridview控件的RowDataBound事件中使用它，如下所示：

protected void GridView2_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            if (e.Row.RowIndex == GridView2.EditIndex)
            {
                //update or cancel buttons
                LinkButton updateBtn = (LinkButton)e.Row.Cells[0].Controls[0];
                string updateScript = ClientScript.GetPostBackClientHyperlink(updateBtn, "");
                Button1.Attributes["onclick"] = updateScript;

                string cancelScript = string.Format("javascript:__doPostBack('ctl00$ContentPlaceHolder1$GridView2','Cancel${1}')",
                                      GridView1.ID, e.Row.RowIndex);
                Button2.Attributes["onclick"] = cancelScript;
            }
            else
            {
                //edit button
                string editScript = string.Format("javascript:__doPostBack('ctl00$ContentPlaceHolder1$GridView2','Edit${1}')",
                                    GridView1.ID, e.Row.RowIndex);
                e.Row.Attributes["onclick"] = editScript;
            }

        }
        if (GridView2.EditIndex >= 0)
        {
            Button1.Enabled = true;
            Button2.Enabled = true;
        }
        else
        {
            Button1.Enabled = false;
            Button2.Enabled = false;
        }
    }

现在，当我点击gridview的任何一行时，它将成为一个可编辑的行，应取消并通过取消和更新按钮更新，这些按钮位于gridview之外，但它们不起作用...

任何帮助或建议将不胜感激 .

Note: 仍然需要在Gridview中包含编辑，更新，取消链接按钮，您可以使用下面的jquery等脚本隐藏在gridview中 .

例如

$(document).ready(function () {
    $("#GridView2 th:first-child").hide();
    $("#GridView2 td:first-child").hide();
});
c# asp.net gridview

2 回答

  • 0

    据我所知，您只是想从网格内部删除编辑/更新按钮到外部位置 .

    您可以以编程方式设置网格的编辑索引by setting it's EditIndex property to the index you want . 您当然可以将此决策基于当前选定的网格行 .

    之后，您需要对网格进行数据绑定，并将按钮从“编辑”更改为“更新”（如果您使用类似解决方案的切换）或根据需要启用/禁用它们 .

    然后，更新的逻辑可以使用网格上的 UpdateRow 方法来保留更改 . 您可以按照示例here查看如何以编程方式强制编辑 . 在您的情况下，在按钮单击时，您需要传入当前编辑索引，如下所示：

    myGrid.UpdateRow(myGrid.EditIndex, true);

    编辑：

    我完全绕过了你想要在行单击时进行编辑的事实，这并不容易，因为单击该行不会导致回发 . 你可以使用像this这样的效果 . 它基本上归结为在服务器上创建时在整行上设置客户端事件 . 我没有测试过，我个人认为这部分应该完全是另一个问题，因为它可以被隔离到"how to cause a postback from a row click of a gridview" .

    回复于
  • 0

    我找到了解决方案 . 用以下内容替换GridView1_RowDataBound函数体：

    protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            if (e.Row.RowIndex == GridView1.EditIndex)
            {
                //update or cancel buttons
                LinkButton updateBtn = (LinkButton)e.Row.Cells[0].Controls[0];
                string updateScript = string.Format("document.getElementById('{0}').click(); return false;", updateBtn.ClientID);
                Button1.OnClientClick = updateScript;

                LinkButton cancelBtn = (LinkButton)e.Row.Cells[0].Controls[2];
                string cancelScript = string.Format("document.getElementById('{0}').click(); return false;", cancelBtn.ClientID);
                Button2.OnClientClick = cancelScript;
            }
            else
            {
                //edit button
                LinkButton editBtn = (LinkButton)e.Row.Cells[0].Controls[0];
                string editScript = string.Format("document.getElementById('{0}').click();", editBtn.ClientID);
                e.Row.Attributes["onclick"] = editScript;
            }

        }
        if (GridView1.EditIndex >= 0)
        {
            Button1.Enabled = true;
            Button2.Enabled = true;
        }
        else
        {
            Button1.Enabled = false;
            Button2.Enabled = false;
        }
    }

    首先，我删除了对__doPostBack的js调用，这不是一个好的做法，因为评论中提到了julealgon . 而不是我构建getElementById的脚本，通过唯一的客户端ID搜索特定的链接按钮，并模拟该链接上的“点击” . 所有链接按钮仍然在表单上，但在您调用document.ready脚本时隐藏，因此您不会收到js错误'item not found ...'

    第二个非常重要的是在OnClientClick脚本的最后为Button1和Button2返回'false'（OnClientClick的工作方式与Attributes [“onclick”]相同） .

    这是为了防止按钮回发，没有按钮本身触发另一个回发，并且因为没有OnClick事件实现服务器端重新绑定网格并设置editindex一些信息丢失以及何时触发'网格'回发（正确的一个，引起通过链接按钮）它不起作用 .

    我的答案假设所有网格的服务器端事件（如RowUpdating，RowCancelingEdit和RowEditing）都工作，或者您的网格具有相关的SqlDataSource或ObjectDataSource来实现这些事件 . 换句话说，我假设如果您在网格行中使用生成的编辑，更新，取消按钮，它们都按预期工作 .

    回复于

相关问题