JavaScript控件集WijmoFlexGrid教程-编辑

VBMSFlexGrid控件的几种使用方法'MSFlexGrid赋值的方法MSFlexGrid1.TextMatrix(0, 1) = "老师"MSFlexGrid1.TextMatrix(1, 2) = "学生"MSFlexGrid1.TextMatrix(2, 3) = "校长"MSFlexGrid1.TextMatrix(3, 4) = "班主任"MSFlexGrid1.TextMatrix(4, 5) = "教务主任"MSFlexGrid1.AddItem 2MSFlexGrid1.AddItem 4MSFlexGrid1.AddItem 6MSFlexGrid1.AddItem 8``MSFLEXGRID 中如何取的某个单元格的数据Private Sub MSFlexGrid1_Click()MsgBox MSFlexGrid1.TextMatrix(MSFlexGrid1.Row, MSFlexGrid1.Col), vbOKOnly, "提示消息"End SubMSFlexGrid1.Row,表格中的当前行MSFlexGrid1.Col,表格中的当前列'初始化MSFlexGridDim i As IntegerMSFlexGrid1.Rows = 0For i = 0 To 10MSFlexGrid1.AddItem "AA" + Str(i)'For i = 0 To 10MSFlexGrid1.Col = 1MSFlexGrid1.Row = iMSFlexGrid1.Text = CStr(i)MSFlexGrid1.Col = 2MSFlexGrid1.Row = iMSFlexGrid1.Text = CStr(i) & CStr(i)MSFlexGrid1.Col = 3MSFlexGrid1.Row = iMSFlexGrid1.Text = CStr(i) & CStr(i) & CStr(i)Next i'实现MSFlexGrid控件，单行背景为浅灰，双行为兰色Dim j As IntegerWith MSFlexGrid1.AllowBigSelection = True ' 设置网格样式.FillStyle = flexFillRepeatFor j = 0 To .Rows - 1.Row = j: .Col = .FixedCols.ColSel = .Cols() - .FixedCols - 1If j Mod 2 = 0 Then.CellBackColor = &HC0C0C0 ' 浅灰Else.CellBackColor = vbBlue ' 兰色End IfNext jEnd With'在MsFlexGrid控件单元格中插入背景图形Set MSFlexGrid1.CellPicture = LoadPicture("f:\temp\snow.bmp")'MSFlexGrid控件如何移到最后一行MSFlexGrid1.TopRow = MSFlexGrid1.Rows - 1'隐藏第一行'Private Sub Command1_Click1()'MSFlexGrid1.RowHeight(1) = 0'End Sub'隐藏第一列'Private Sub Command_Click2()'MSFlexGrid1.ColWidth(1) = 0'End Sub在MSFlexGrid上点击右键，选择属性，选择"选择模式",自己任选点击得到行代码msgrid1.Col就是你选择的列号msgrid1.Row 就是你选择的行号msgrid1.text就是你选择单元格的内容。

jqGrid是一个基于 jQuery 的表格插件，它提供了强大的功能，包括行编辑（form editing）模式。

行编辑模式允许用户通过表格中的表单直接编辑数据。

下面是一个简单的示例演示jqGrid的行编辑模式的基本用法。

首先，确保你已经引入了必要的 jQuery 和 jqGrid 的样式和脚本文件。

在上述示例中：
•jqGrid被创建并指定了数据源的 URL。

•colModel定义了表格的列。

•navGrid方法用于启用导航栏，并启用了编辑、添加、删除的功能。

•editurl指定了编辑操作的 URL。

在这个例子中，使用clientArray表示本地编辑。

请注意：在实际应用中，你需要将your_data_source_url替换为实际的数据源 URL，而且你需要根据需要配置和定制表格的其他属性。

MSFlexGrid控件概述1、作用：该控件以表格形式显示二维字符数组中每个单元的数据。

常用于处理复杂的二维数据表的问题。

如校历表、学生宿舍表、学生班级成绩表等。

2、添加到控件箱菜单命令：工程 | 部件，在部件对话框中选择：Microsoft FlexGrid Control 6.0 (SP6)。

3、主要属性（1）Rows与Cols属性：分别用于设置或返回MSFlexGrid控件的行数与列数。

（2）Row与Col属性：分别用于设置或返回MSFlexGrid控件中活动单元的行号与列号。

（3）TextMatrix属性：该属性用于表示MSFlexGrid控件中单元格的内容。

格式为：TextMatrix (Row, Col);其中Row与Col分别表示单元格在MSFlexGrid控件中的行号与列号。

（4）FixedRows属性：用于设置表格显示过程中固定不变的行数。

如FixedRows=1，则表示固定行为1，如图8.3中第1行。

（5）FixedCols属性：用于设置表格中固定不变的列数。

如FixedCols=1，则表示固定列为1，如图8.3中第1列。

（6）FixedColor属性：用于设置固定行与固定列的颜色。

（7）MouseRow与MouseCol属性：用于返回鼠标光标所在单元格的行号与列号。

（8） ColWidth（Col）、RowHigh(Row)属性：用于设置与返回第Col列的宽度与第Row 行的高度，例如设置第0列的宽度为1500，第0行的高度为300的赋值语句为：ColWidth(0) = 1500RowHeight(0) = 300（9）DataSource属性：用于选择数据表，只能通过Data数据源控件选择数据表。

说明，若要用ADO Data控件作为数据源，则应使用MSHFlexGrid控件。

（10）MousePointer属性：用于设置鼠标光标形状，属性取值与光标形状如表8.1所示。

【例8.1】编写程序，定义MSFlexGrid1控件为10行、5列表格，给每一个单元格赋值为Row+Col，其中Row与Col分别表示控件单元格的行号与列号。

jsgrid用法jsGrid是一个基于jQuery的轻量级、灵活的表格展示插件，提供了丰富的配置选项和API，可以方便地实现各种复杂的表格展示和操作功能。

以下是jsGrid的基本用法：1. 引入jsGrid的CSS和JS文件：```html<link rel="stylesheet" href="path/to/"><script src="path/to/"></script><script src="path/to/"></script>```2. 准备表格容器：```html<table id="myGrid"></table>```3. 初始化jsGrid：```javascript$("myGrid").jsGrid({width: "100%", // 表格宽度height: "400px", // 表格高度autoload: true, // 是否自动加载数据inserting: true, // 是否可以插入新数据editing: true, // 是否可以编辑数据sorting: true, // 是否可以排序数据paging: true, // 是否支持分页加载数据invalidNotify: $.noop, // 当无效输入时什么都不做fields: [ // 表头配置{ name: "id", type: "number", width: 20 },{ name: "name", type: "text", width: 50 },{ name: "age", type: "number", width: 20 },{ name: "email", type: "text", width: 50 },{ name: "isAdmin", type: "checkbox", title: "Is Admin" } ],controller: { // 数据控制方法，增删改查等操作loadData: function() { return $.ajax({ url: "./data" }); }, // 加载数据的方法insertItem: function(item) { return $.ajax({ url: "./insert", data: item }); }, // 插入数据的方法updateItem: function(item) { return $.ajax({ url: "./update", data: item }); }, // 更新数据的方法deleteItem: function(item) { return $.ajax({ url: "./delete", data: item }); } // 删除数据的方法}});```4. 使用jsGrid的API进行操作：可以通过jsGrid提供的API进行各种操作，例如：插入新行、编辑单元格、获取选中行、清空表格等。