[翻译]在GridView中针对鼠标单击的某同独立单元格进行编辑

初稿地址:http://www.codeproject.com/KB/webforms/EditGridviewCells.aspx
[初稿源码下载]
[翻译改后源码下载]

[翻译]于GridView中针对鼠标单击的之一同独自单元格进行编制

原稿发布日期:2007.04.07
作者:Declan
Bright
翻译:webabcd

介绍
ASP.NET的GridView控件允许而通过设置它的EditIndex属性来修数据实行,此时全体数据行都处于编辑模式。
如果您于EditItemTemplate的一部分列中使用了DropDownList控件,那么您可能不欲尽数据行都处于编辑模式。
因为,如果各一个DropDownList控件都产生为数不少精选的话,那么同样糟加载所有DropDownList控件的有选项就见面招页面执行款。

此外,如果您的数据行的编排模式需占用更多的上空吧,那么对各个一个独的唯有元格进行编辑而优于针对所有数据实施开展编制。
这里,我将示范怎么兑现这样的效用,又怎么样错过处理事件验证(event
validation)。

背景
本文基于自己事先写的均等篇稿子:GridView和DataList响应单击数据行和双击数据行事件。如果你莫掌握什么吃GridView响应单击数据行事件,那么您可在阅读本文之前先行看这篇稿子。

编排某一个单身的GridView单元格。
图片 1

自家所示范的此GridView有一个不可见的asp:ButtonField控件,它地处GridView的率先排,名吧“SingleClick”。
它用来受GridView的多寡实行多单击事件。

图片 2<Columns>                
图片 3    <asp:ButtonField Text=”SingleClick” CommandName=”SingleClick” Visible=”False” />
图片 4</Columns>

另各级一样排列的ItemTemplate中来一个可见的Label控件和一个不可见的TextBox或DropDownList控件。
为了便利,我们遂Label为显示控件,TextBox或DropDownList为编制控件。

图片 5    <asp:TemplateField HeaderText=”Task”>
图片 6        <ItemTemplate>
图片 7            <asp:Label ID=”DescriptionLabel” runat=”server” Text='<%# Eval(“Description”) %>’></asp:Label>
图片 8            <asp:TextBox ID=”Description” runat=”server” Text='<%# Eval(“Description”) %>’ Width=”175px” visible=”false”></asp:TextBox>
图片 9        </ItemTemplate>
图片 10    </asp:TemplateField>

此间的主意尽管是故示控件来展示数据,当单元格所富含的显示控件被单击的上,则将显示控件的Visible属性设置为false并且把编辑控件的Visible属性设置也true。
这里并非采用EditItemTemplat。

当RowDataBound事件外循环为各国一样反复据行的诸一样单元格增加单击事件。
使用单元格在数额行中的目录作为事件参数,这样于单元格触发了单击事件后我们便好掌握究竟是谁单元格被单击了。

图片 11    protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
图片 12图片 13    图片 14{
图片 15        if (e.Row.RowType == DataControlRowType.DataRow)
图片 16图片 17        图片 18{
图片 19            // 从第一单单元格内获得LinkButton控件
图片 20            LinkButton _singleClickButton = (LinkButton)e.Row.Cells[0].Controls[0];
图片 21            // 返回一个字符串,表示针对包含目标控件的 ID 和事件参数的回发函数的 JavaScript 调用
图片 22            string _jsSingle = ClientScript.GetPostBackClientHyperlink(_singleClickButton, “”);
图片 23
图片 24            // 给各级一个但编制的唯有元格增加事件
图片 25            for (int columnIndex = _firstEditCellIndex; columnIndex < e.Row.Cells.Count; columnIndex++)
图片 26图片 27            图片 28{
图片 29                // 增加列索引作为事件参数
图片 30                string js = _jsSingle.Insert(_jsSingle.Length – 2, columnIndex.ToString());
图片 31                // 给单元格增加onclick事件
图片 32                e.Row.Cells[columnIndex].Attributes[“onclick”] = js;
图片 33                // 给单元格增加鼠标经过时指针样式
图片 34                e.Row.Cells[columnIndex].Attributes[“style”] += “cursor:pointer;cursor:hand;”; 
图片 35            }     
图片 36        }
图片 37    }

当RowCommand事件外读来命令参数和波参数。
这会报我们吃入选的行和列的目录。

图片 38    int _rowIndex = int.Parse(e.CommandArgument.ToString());      
图片 39    int _columnIndex = int.Parse(Request.Form[“__EVENTARGUMENT”]);

因掌握了被入选的行和列的目录,所以可以通过将显示控件的Visible设置为false,编辑控件的Visible设置也true来把某部独立的单独元格设置为编写模式。
然后经过解除单元格的习性来删除被入选单元格的单击事件。

图片 40    // 获得被入选单元格的示控件并安装其不可见
图片 41    Control _displayControl = _gridView.Rows[_rowIndex].Cells[_columnIndex].Controls[1]; 
图片 42    _displayControl.Visible = false;
图片 43    // 获得被入选单元格的编撰控件并安装其可见
图片 44    Control _editControl = _gridView.Rows[_rowIndex].Cells[_columnIndex].Controls[3];
图片 45    _editControl.Visible = true;
图片 46    // 清除为入选单元格属性以去click事件
图片 47    _gridView.Rows[_rowIndex].Cells[_columnIndex].Attributes.Clear();

脚有部分代码用于回发服务器后安装要点到编辑控件,如果编辑控件是DropDownList的言辞,那么其的SelectedValue要安装也展示控件的价,如果编辑控件是TextBox的话语,那么为办好编辑的备即将使其的公文为选中。

图片 48    // 设置要点到于选中的编撰控件
图片 49    ClientScript.RegisterStartupScript(GetType(), “SetFocus”, 
图片 50        “<script>document.getElementById(‘” + _editControl.ClientID + “‘).focus();</script>”);
图片 51    // 如果编辑控件是DropDownList的讲话
图片 52    // SelectedValue设置也展示控件的价
图片 53    if (_editControl is DropDownList && _displayControl is Label)
图片 54图片 55    图片 56{
图片 57        ((DropDownList)_editControl).SelectedValue = ((Label)_displayControl).Text;
图片 58    }                 
图片 59    // 如果编辑控件是TextBox的口舌虽然选择中文本框内文本
图片 60    if (_editControl is TextBox)
图片 61图片 62    图片 63{
图片 64       ((TextBox)_editControl).Attributes.Add(“onfocus”, “this.select()”);
图片 65    }

当此Demo中,我将事件于点的历史记录也刻画及了页里。

一旦GridView处于编辑模式吧,那么只要以RowUpdating事件里去寻找被挑选中行的各个一个单元格。
如果发现单元格处于编辑模式吧,那么就算调用“更新”代码。
在此Demo中,数据保存在DataTable里,而者DataTable则储存在session中。

图片 66    // 循环每一样排列以找到远在编辑模式下之一味元格
图片 67    for (int i = 1; i < _gridView.Columns.Count; i++)
图片 68图片 69    图片 70{
图片 71        // 获得单元格的编纂控件
图片 72        Control _editControl = _gridView.Rows[e.RowIndex].Cells[i].Controls[3];
图片 73        if (_editControl.Visible)
图片 74图片 75        图片 76{
图片 77           图片 78. update the data
图片 79        }
图片 80    }

为确保RowUpdating事件于编排单元格后为鼓舞,要在Page_Load中来点这个波。
编辑了TextBox后,通过本掉车键或者单击另一样单元格来使页面做回发处理,下面的当下段代码就是用来确保其他数据的改都见面吃更新。

图片 81    if (this.GridView1.SelectedIndex > -1)
图片 82图片 83    图片 84{
图片 85        this.GridView1.UpdateRow(this.GridView1.SelectedIndex, false);
图片 86    }   

以印证而注册回发和回调数据
以RowDataBound中开创的自定义事件要使于页中登记。
通过再写Render方法来调用ClientScriptManager.RegisterForEventValidation。
通过GridViewRow.UniqueID返回行的唯一ID,按纽的唯一ID通过在行的唯一ID后附加“$ct100”而生成。

图片 87    protected override void Render(HtmlTextWriter writer)
图片 88图片 89    图片 90{
图片 91        foreach (GridViewRow r in GridView1.Rows)
图片 92图片 93        图片 94{
图片 95            if (r.RowType == DataControlRowType.DataRow)
图片 96图片 97            图片 98{
图片 99                for (int columnIndex = _firstEditCellIndex; columnIndex < r.Cells.Count; columnIndex++)
图片 100图片 101                图片 102{
图片 103                    Page.ClientScript.RegisterForEventValidation(r.UniqueID + “$ctl00”, columnIndex.ToString());
图片 104                }
图片 105            }
图片 106        }
图片 107      
图片 108        base.Render(writer);
图片 109    }

马上将预防其他“回发或回调参数无效”的谬误。

本条Demo中之另示例
下SQL数据源控件编辑某平等单身的GridView单元格
于是SqlDataSouce控件实现此技术需要针对GridView的RowUpdating事件做有修改。
当更新GridView的行的时候,SqlDataSource控件一般只要将价值(values)从EditItemTemplate转移到NewValues集合里。
因为我们没有利用EditItemTemplate,所以这种状态下值(values)不见面自行地转换到NewValues集合里。

图片 110    e.NewValues.Add(key, value);

我在App_Data文件夹下以了一个简单的SQL Server Express数据库。
(要使用你自己之数据库的话,你可修改web.config里的连续字符串)

应用对象数据源控件编辑某同单身的GridView单元格
本示例祭了App_Code文件夹内之少数个像样:
    ·Task.cs – 任务目标
    ·TaskDataAccess.cs – 管理任务目标

Aspx页的后置代码和SQL Data Source示例是一模一样的。
ObjectDataSource通过TaskDataAccess.cs类里的GetTasks和UpdateTask方法来管理数据。

负有电子数码表样式的GridView
此出一个同电子数据表的体非常像的GridView。
(虽然它们看起像一个电子数据表,但是连无是真有像电子数据表一样的功力,它还是一个GridView。)

这里虽然发出部分单击后变更单元格样式的叠加代码,但是要的代码还是与地方所述是千篇一律之。
图片 111

于是SQL数据源控件实现有电子数据表样式的GridView
本示例和方的基本相同,但是它们修改了GridView的RowUpdating事件归因于要该允许用SqlDataSource控件来行事。
 

参考
   
·GridView同DataList响应单击数据行和双击数据行事件
    ·ASP.NET
2.0数据教程

结论
假设你想以GridView中千篇一律次就对一个单元格进行编辑,那么这法子将会见指向您所有助。

翻译注:事件作证(EventValidation)。出于安全目的,此功效验证回发或回调事件之参数是否来自最初呈现这些事件的服务器控件。如果数额中又是意料的,则利用ClientScriptManager.RegisterForEventValidation方法来报回发或回调数据为开展验证。

相关文章