如何:创建可编辑网格

上次修改时间: 2011年6月23日

适用范围: SharePoint Foundation 2010

本操作方法文章演示如何对基本 JS 网格控件启用编辑功能。本操作方法文章是如何:创建基本 JS 网格如何:使用 JS 网格创建数据透视图的后续文章。

备注

对于下列说明中的一些 Visual Studio 用户界面元素,您的计算机可能显示不同的名称或位置。这些元素由您拥有的 Visual Studio 版本和使用的设置决定。

先决条件

  • Microsoft SharePoint Foundation 2010

  • Microsoft Visual Studio 2010

  • Microsoft Visual Studio 2010 中的 SharePoint 开发工具

  • 完成如何:创建基本 JS 网格

备注

尽管本演练无需使用 Visual Studio 2010 即可完成,但是使用 Visual Studio 2010 和 Microsoft Visual Studio 2010 中的 SharePoint 开发工具更简单。

创建可编辑网格

创建可编辑网格涉及几个步骤:

  • 在 ECMAScript(JavaScript、JScript)中切换读/写行为

  • 对行、字段或单元格启用读/写行为

  • 添加客户端错误检查

  • 编写回调以处理用户的更改

本操作方法文章演示如何创建可编辑网格并说明 JS 网格控件提供的客户端错误检查。写入用户更改不在本操作方法文章的范围之内。

使用 bEditingEnabled 启用编辑功能

  1. 打开在前面的操作方法文章中创建的 JSGrid 解决方案。

  2. 打开 JSGridWebPartUserControl.ascx。

  3. 在 JavaScript 代码中,在初始化 jsGridControl 之前,添加 jsGridParams.tableViewParams.bEditingEnabled = true;。

    代码应该如下所示。

    <script type="text/javascript">
        Type.registerNamespace("GridManager");
        GridManager = function () {
            this.Init = function (jsGridControl, initialData, props) {
                var dataSource = new SP.JsGrid.StaticDataSource(initialData);
                var jsGridParams = dataSource.InitJsGridParams();
    
                jsGridParams.tableViewParams.bEditingEnabled = true;
    
                jsGridControl.Init(jsGridParams);
            }
        };
    </script>
    

    请注意,bEditingEnabled 是一个开关,可用于在客户端代码中打开或关闭编辑功能。默认情况下,bEditingEnabled 设置为 false。

对行、字段或单元格启用读/写行为。

JS 网格控件EditMode 枚举指定包含在记录或文件中的单元格是否应该允许进行编辑。选项如下:

  • Defer   始终延迟处理读/写状态;控件无法控制它自己的状态。

  • ReadOnly   如果应用于记录或字段,则该记录或字段中的所有单元格都不可编辑;如果应用于行,请检查每个单元格的编辑模式。

  • ReadOnlyDefer   单元格是只读的,除非行、列或网格控件的设置指定了其他模式。如果应用于行,请检查每个单元格的编辑模式。

  • ReadWrite   单元格可编辑,除非行、列或网格控件的设置指定了其他模式。

  • ReadWriteDefer   单元格可编辑,除非行、列或网格控件的设置指定了其他模式。

使特定字段可编辑

  1. 在 JSGrid 解决方案中,打开 GridUtilities.cs。

  2. 找到 FormatGridField 类。

  3. 在 formatGridField 类中,将所有字段的 EditMode 属性设置为 ReadOnlyDefer。这会设置只读默认编辑模式,特定字段、行或单元格可以重写该默认模式。

    // When in doubt, set the edit mode to read-only and defer to others.
    gf.EditMode = EditMode.ReadOnlyDefer;
    
  4. 在 FormatGridField 类中上述代码的下面,将类型为 Int32 的所有字段的编辑模式设置为 ReadWrite。

    else if (dc.DataType == typeof(Int32))
        {
            gf.EditMode = EditMode.ReadWrite;
    
  5. 运行项目。编辑数字字段之一。

    如果在数字单元格中输入非数字字符,则会为单元格添加红色边框,并在行标题中显示红色图标。单击单元格将显示说明错误的图标。此行为随 JS 网格控件提供。

请参阅

概念

JS 网格控件的功能