原创文章,转载请注明出处
作者: BoyLee 出处: Http://BoyLee.net
ActiveReports和UltraWebGrid都是使用较为广泛.Net控件,有着方便,简单,强大等特点.
但是网上相关的中文资料很少,几乎没有,想想自己刚用这两工具时候的痛苦,一直有写个简单的入门级的使用指南.后来在博客园看到不少大大用ActiveReports,也写了不少文章,于是俺决定写个WebGrid的.
首先安装NetAdvantage,买商业版的朋友可以输入注册码,俺用未注册的,直接下一步跳过.未注册的同样可以使用,只是过了试用期后会跳出提示注册窗口.
安装好后,可以开始我们的WebGrid之旅啦,今天先来个最简单的
1. 建立一个你自己的工程,添加Infragistics.WebUI.UltraWebGrid.v3.1.dll到引用中.这里*.dll文件名可能因为 版本问题,会不一样.请自行修改(我的示例环境为xp+vs2003+PowerTools NetAdvantage 2004 Vol.2 トライアル版,以实际项目中用的一个WebGrid为例进行说明)
2.在*.aspx页面最上面添加如下代码,注册UltraWebGrid控件
其 中Assembly="Infragistics.WebUI.UltraWebGrid.v3.1, Version=3.1.20042.1046, Culture=neutral, PublicKeyToken=7dd5c3163f2cd0cb" 具体内容取决于NetAdvantage 2004 的版本.其他具体的意思相信大家自己应该看的懂哦,俺就不多说啦.
3.WebGrid的前台代码:
< DisplayLayout StationaryMargins = " Header " AllowSortingDefault = " Yes " RowHeightDefault = " 21px " Version = " 4.00 "
BorderCollapseDefault = " Separate " Name = " uwgCustomer " TableLayout = " Fixed " NoDataMessage = " 表示するデータがありません " >
< AddNewBox Prompt = " 追加 " >
< Style BorderWidth = " 1px " BorderStyle = " Solid " BackColor = " LightGray " >
< BorderDetails ColorTop = " White " WidthLeft = " 1px " WidthTop = " 1px " ColorLeft = " White " ></ BorderDetails >
</ Style >
< ButtonStyle Cursor = " Hand " ></ ButtonStyle >
</ AddNewBox >
< Pager PrevText = " 前へ " NextText = " 次 " >
< Style BorderWidth = " 1px " BorderStyle = " Solid " BackColor = " LightGray " >
< BorderDetails ColorTop = " White " WidthLeft = " 1px " WidthTop = " 1px " ColorLeft = " White " ></ BorderDetails >
</ Style >
</ Pager >
< HeaderStyleDefault VerticalAlign = " Bottom " BorderStyle = " Solid " HorizontalAlign = " Center " BackColor = " LightGray " >
< BorderDetails ColorTop = " White " WidthLeft = " 1px " WidthTop = " 1px " ColorLeft = " White " ></ BorderDetails >
</ HeaderStyleDefault >
< FrameStyle Width = " 830px " BorderWidth = " 1px " Font - Size = " 10pt " Font - Names = " MS ゴシック " BorderStyle = " Solid "
Height = " 188px " ></ FrameStyle >
< FooterStyleDefault BorderWidth = " 1px " BorderStyle = " Solid " BackColor = " LightGray " >
< BorderDetails ColorTop = " White " WidthLeft = " 1px " WidthTop = " 1px " ColorLeft = " White " ></ BorderDetails >
</ FooterStyleDefault >
< ClientSideEvents ClickCellButtonHandler = " GetAddr " BeforeCellUpdateHandler = " BeforeCellUpdate " AfterSelectChangeHandler = " uwgCustomer_AfterSelectChangeHandler "
BeforeEnterEditModeHandler = " BeforeEnterEditMode " AfterEnterEditModeHandler = " AfterEnterEditMode " ></ ClientSideEvents >
< GroupByBox Prompt = " 列ごとにグループ分けするときは、ここに列ヘッダーをドラックします。 " ></ GroupByBox >
< SelectedRowStyleDefault ForeColor = " Black " BackColor = " Cyan " ></ SelectedRowStyleDefault >
< RowStyleDefault BorderWidth = " 1px " BorderColor = " Gray " BorderStyle = " Solid " >
< Padding Left = " 3px " ></ Padding >
< BorderDetails WidthLeft = " 0px " WidthTop = " 0px " ></ BorderDetails >
</ RowStyleDefault >
< Strings DownLevelDeletePrompt = " 削除 " DownLevelCancelPrompt = " キャンセル " DownLevelDeleteColumnHeader = " 列の削除 "
DownLevelEditColumnHeader = " 列の編集 " DownLevelEditPrompt = " 編集 " DownLevelUpdatePrompt = " 更新 " ></ Strings >
</ DisplayLayout >
< Bands >
< igtbl:UltraGridBand AllowAdd = " Yes " ></ igtbl:UltraGridBand >
</ Bands >
</ igtbl:ultrawebgrid >
表格中无数据时候显示的提示信息
<DisplayLayout ............NoDataMessage="表示するデータがありません">
定义编辑,改变选择等客户端JS
<ClientSideEvents ClickCellButtonHandler="GetAddr" BeforeCellUpdateHandler="BeforeCellUpdate" AfterSelectChangeHandler="uwgCustomer_AfterSelectChangeHandler" BeforeEnterEditModeHandler="BeforeEnterEditMode" AfterEnterEditModeHandler="AfterEnterEditMode"></ClientSideEvents>
允许在符合一定条件时候,自动增加新的空行
<Bands>
<igtbl:UltraGridBand AllowAdd="Yes"></igtbl:UltraGridBand>
</Bands>
其他的大部分为表格的样式,另外一些也可以根据英文意思看懂,不再赘述
4.后台*.vb中WebGrid初始化的代码
On Error GoTo ERR_FLAG
Dim strSQL As String
Dim strErrMsg As String
Dim objConn As New clsAdoNetSql
Dim rdrAddr As SqlDataReader
Dim sel_addr As ValueList
Dim intI, intJ As Int16
Me.uwgCustomer.Columns( 0 ).HeaderText = " お客様コード "
Me.uwgCustomer.Columns( 1 ).HeaderText = " 来場日 "
Me.uwgCustomer.Columns( 2 ).HeaderText = " 名前(姓)<font color=red>※</font> "
Me.uwgCustomer.Columns( 3 ).HeaderText = " 名前(名) "
Me.uwgCustomer.Columns( 4 ).HeaderText = " 名前(せい)<font color=red>※</font> "
Me.uwgCustomer.Columns( 5 ).HeaderText = " 名前(めい) "
Me.uwgCustomer.Columns( 6 ).HeaderText = " 電話番号 "
Me.uwgCustomer.Columns( 7 ).HeaderText = " 郵便 "
Me.uwgCustomer.Columns( 8 ).HeaderText = " 番号 "
Me.uwgCustomer.Columns( 9 ).HeaderText = ""
Me.uwgCustomer.Columns( 10 ).HeaderText = " 都道府県 "
Me.uwgCustomer.Columns( 11 ).HeaderText = " 市区町村 "
Me.uwgCustomer.Columns( 12 ).HeaderText = " 町域 "
Me.uwgCustomer.Columns( 0 ).Width = Unit.Pixel( 90 )
Me.uwgCustomer.Columns( 1 ).Width = Unit.Pixel( 75 )
Me.uwgCustomer.Columns( 2 ).Width = Unit.Pixel( 75 )
Me.uwgCustomer.Columns( 3 ).Width = Unit.Pixel( 72 )
Me.uwgCustomer.Columns( 4 ).Width = Unit.Pixel( 94 )
Me.uwgCustomer.Columns( 5 ).Width = Unit.Pixel( 74 )
Me.uwgCustomer.Columns( 6 ).Width = Unit.Pixel( 90 )
Me.uwgCustomer.Columns( 7 ).Width = Unit.Pixel( 35 )
Me.uwgCustomer.Columns( 8 ).Width = Unit.Pixel( 40 )
Me.uwgCustomer.Columns( 9 ).Type = ColumnType.Button
Me.uwgCustomer.Columns( 9 ).CellButtonDisplay = CellButtonDisplay.Always
Me.uwgCustomer.Columns( 9 ).Width = Unit.Pixel( 50 )
Me.uwgCustomer.Columns( 9 ).DefaultValue = " 検索 "
Me.uwgCustomer.Columns( 10 ).Width = Unit.Pixel( 70 )
Me.uwgCustomer.Columns( 10 ).Type = ColumnType.DropDownList
Me.uwgCustomer.Columns( 11 ).Width = Unit.Pixel( 87 )
Me.uwgCustomer.Columns( 12 ).Width = Unit.Pixel( 77 )
strSQL = " SELECT PREFECTURES_CODE, "
strSQL &= " PREFECTURES_NAME "
strSQL &= " FROM CM_PREFECTURES "
rdrAddr = objConn.RunQueryCmd(strSQL)
sel_addr = Me.uwgCustomer.Columns( 10 ).ValueList
While rdrAddr.Read
sel_addr.ValueListItems.Add(New ValueListItem)
sel_addr.ValueListItems(sel_addr.ValueListItems.Count - 1 ).DisplayText = rdrAddr( " PREFECTURES_NAME " )
sel_addr.ValueListItems(sel_addr.ValueListItems.Count - 1 ).DataValue = rdrAddr( " PREFECTURES_CODE " )
End While
rdrAddr.Close()
objConn.CloseConnection()
Exit Sub
ERR_FLAG:
' デバッグ用の
strErrMsg = Err.Description
Exit Sub
End Sub
通过设置ColumnType来改变列属性,有Button,DropDownList等,普通列为可编辑的TextBox
这里比较简单,不再废话耽误大家时间了,下边讲如何绑定数据
讲了WebGrid的建立.这次到大家都关心的问题啦
如果不绑定数据,那么再漂亮,再好的Grid也没用,也只显示一句"表示するデータがありません"而已
其实WebGrid的数据绑定很简单,只要设置一个和Grid列数相同的DataTable就OK了
DataTable中的数据OK后,和DataGrid/GridView一样,就是xxx.databind()就可以了
不过和DataGrid/GridView不同的是,WebGrid是自动绑定的,不用设置
所以DataTable列对应的顺序一定要和WebGrid完全一样,而且列数也要相等.
On Error GoTo Err_handler
Dim objConn As New clsAdoNetSql
Dim rdrCus As SqlDataReader
Dim strSQL As String
Dim tblCus As New DataTable
Dim rowTemp As DataRow
Dim intI As Int32
strSQL = " SELECT F.CUSTOMERS_CODE, "
strSQL &= " F.FAMILY_NAME, "
strSQL &= " F.ONES_NAME, "
strSQL &= " F.FAMILY_NAME_KANA, "
strSQL &= " F.ONES_NAME_KANA, "
strSQL &= " F.TELEPHONE_NUMBER, "
strSQL &= " F.POSTAL_CODE1, "
strSQL &= " F.POSTAL_CODE2, "
strSQL &= " F.PREFECTURES_CODE, "
strSQL &= " F.ADDRESS1, "
strSQL &= " F.ADDRESS2 "
strSQL &= " FROM CT_CUSTOMERS_BASIC F, "
strSQL &= " CT_ACTION_RECORD A, "
strSQL &= " CT_EVENT_CUSTOMERS B "
strSQL &= " WHERE B.EVENT_NAME=A.ACTION_ITEMS_TITLE "
strSQL &= " AND A.ACTION_RECORD_CODE=' " & strItemCode & " ' "
strSQL &= " AND F.CUSTOMERS_CODE=B.CUSTOMERS_CODE "
rdrCus = objConn.RunQueryCmd(strSQL)
With tblCus.Columns
.Add(New DataColumn( " CUSTOMERS_CODE " , GetType(String)))
.Add(New DataColumn( " ATTEND_DATE " , GetType(String))) ' 来場日
.Add(New DataColumn( " CUSTOMERS_FIRST_NAME " , GetType(String)))
.Add(New DataColumn( " CUSTOMERS_LAST_NAME " , GetType(String)))
.Add(New DataColumn( " CUSTOMERS_FIRST_NAME_KANA " , GetType(String)))
.Add(New DataColumn( " CUSTOMERS_LAST_NAME_KANA " , GetType(String)))
.Add(New DataColumn( " TEL_NUMBER " , GetType(String)))
.Add(New DataColumn( " POSTAL_CODE1 " , GetType(String)))
.Add(New DataColumn( " POSTAL_CODE2 " , GetType(String)))
.Add(New DataColumn( " BTN_SEARCH " ))
.Add(New DataColumn( " SEL_ADDR " , GetType(String)))
.Add(New DataColumn( " ADDR1 " , GetType(String)))
.Add(New DataColumn( " ADDR2 " , GetType(String)))
End With
tblCus.Columns( 9 ).DefaultValue = " 検索 "
While rdrCus.Read
rowTemp = tblCus.NewRow
rowTemp( " CUSTOMERS_CODE " ) = rdrCus( " CUSTOMERS_CODE " )
rowTemp( " ATTEND_DATE " ) = "" ' 来場日
rowTemp( " CUSTOMERS_FIRST_NAME " ) = rdrCus( " FAMILY_NAME " )
rowTemp( " CUSTOMERS_LAST_NAME " ) = rdrCus( " ONES_NAME " )
rowTemp( " CUSTOMERS_FIRST_NAME_KANA " ) = rdrCus( " FAMILY_NAME_KANA " )
rowTemp( " CUSTOMERS_LAST_NAME_KANA " ) = rdrCus( " ONES_NAME_KANA " )
rowTemp( " TEL_NUMBER " ) = rdrCus( " TELEPHONE_NUMBER " )
rowTemp( " POSTAL_CODE1 " ) = rdrCus( " POSTAL_CODE1 " )
rowTemp( " POSTAL_CODE2 " ) = rdrCus( " POSTAL_CODE2 " )
rowTemp( " SEL_ADDR " ) = rdrCus( " PREFECTURES_CODE " )
rowTemp( " ADDR1 " ) = rdrCus( " ADDRESS1 " )
rowTemp( " ADDR2 " ) = rdrCus( " ADDRESS2 " )
tblCus.Rows.Add(rowTemp)
End While
rdrCus.Close()
objConn.CloseConnection()
' To record how many exsiting customers.
Me.Controls.Add(New LiteralControl( " <form name=frmPara><input name=hdnEx type=hidden value= " & _
Me.m_ExsitCusNum.ToString & " ></form> " ))
Me.hdnEx.Value = Me.m_ExsitCusNum.ToString
' For new customers
rowTemp = tblCus.NewRow
rowTemp( " CUSTOMERS_CODE " ) = ""
rowTemp( " ATTEND_DATE " ) = ""
rowTemp( " CUSTOMERS_FIRST_NAME " ) = ""
rowTemp( " CUSTOMERS_LAST_NAME " ) = ""
rowTemp( " CUSTOMERS_FIRST_NAME_KANA " ) = ""
rowTemp( " CUSTOMERS_LAST_NAME_KANA " ) = ""
rowTemp( " TEL_NUMBER " ) = ""
rowTemp( " POSTAL_CODE1 " ) = ""
rowTemp( " POSTAL_CODE2 " ) = ""
rowTemp( " SEL_ADDR " ) = ""
rowTemp( " ADDR1 " ) = ""
rowTemp( " ADDR2 " ) = ""
tblCus.Rows.Add(rowTemp)
Me.uwgCustomer.DisplayLayout.AllowAddNewDefault = AllowAddNew.Yes
Me.uwgCustomer.DisplayLayout.AllowUpdateDefault = AllowUpdate.Yes
Me.uwgCustomer.DisplayLayout.CellClickActionDefault = CellClickAction.Edit
uwgCustomer.DisplayLayout.SelectTypeRowDefault = SelectType.Single
Me.uwgCustomer.DataSource = tblCus
Me.uwgCustomer.DataBind()
Exit Function
Err_handler:
objConn.CloseConnection()
strMsg = getErrMessage(Err.Description)
Controls.Add(New LiteralControl( " <script language=javascript>alert( """ & strMsg & """ )</script> " ))
End Function
是不是觉得很简单啊,嘿嘿.
下一次讲的是WebGrid操作的属性和方法
这次讲的主要是一些前台/后台事件,属性,相关方法等.
文中一些日文汉字应该能认识不少的,懒的翻译了,大家BS我吧(日文汉字,加英文,差不多也能知道意思了,嘿嘿).
前台事件:
Me.vldRaiJyo.ClientValidationFunction = " checkRaiJyo "
{
var gn='uwgCustomer';
var g=igtbl_getGridById(gn);
var table=g.Bands[0].curTable;
var rows=table.tBodies[0].rows;
var rows_num=rows.length-1; // Check range: All of them except the last item.
var cell;
var cell_value;
//for(var i=document.frmPara.hdnEx.value; i<rows_num; i++){ // The exsiting customer data won't be checked.
for(var i=document.frmEvent.hdnEx.value; i<rows_num; i++){ // The exsiting customer data won't be checked.
cell=igtbl_getCellById(gn+'rc_'+i+'_'+1);
cell_value=cell.getValue();
if(cell_value!='' && cell_value!=null){
if(!chkDate(cell_value)){
arguments.IsValid=false;
return;
}
}
}
arguments.IsValid=true;
}
一个简单的小例子,其实就是和DataGrid前台操作的方法差不多了
一些属性可以自己查看上一章的一些说明
2.其实后台我不知道该说些什么.建议大家自己多动手尝试.
后台和DataGrid一样,写个WebGrid的ID,然后后面加个".",然后就出来了,自己看吧,很多属性和方法的
rowCus( " CUSTOMERS_FIRST_NAME " ) = Me.uwgCustomer.Rows(intI).Cells( 2 ).Value
rowCus( " CUSTOMERS_LAST_NAME " ) = Me.uwgCustomer.Rows(intI).Cells( 3 ).Value
rowCus( " CUSTOMERS_FIRST_NAME_KANA " ) = Me.uwgCustomer.Rows(intI).Cells( 4 ).Value
rowCus( " CUSTOMERS_LAST_NAME_KANA " ) = Me.uwgCustomer.Rows(intI).Cells( 5 ).Value
rowCus( " TEL_NUMBER " ) = Me.uwgCustomer.Rows(intI).Cells( 6 ).Value
rowCus( " POSTAL_CODE1 " ) = Me.uwgCustomer.Rows(intI).Cells( 7 ).Value
rowCus( " POSTAL_CODE2 " ) = Me.uwgCustomer.Rows(intI).Cells( 8 ).Value
rowCus( " BTN_SEARCH " ) = " 検索 "
rowCus( " SEL_ADDR " ) = Me.uwgCustomer.Rows(intI).Cells( 10 ).Value
rowCus( " ADDR1 " ) = Me.uwgCustomer.Rows(intI).Cells( 11 ).Value
rowCus( " ADDR2 " ) = Me.uwgCustomer.Rows(intI).Cells( 12 ).Value
OK,全部结束啦.
当然,我只是讲了一点点基本的东西,WebGrid的强大和便捷还是要靠大家自己去发现
其实写这几篇的目的,主要是因为自己用的时候,很多东西不熟悉,而搜索的结果是根本没几篇中文的文章
也难怪,WebGrid主要是日本用的多,所以文档也是日文的居多.抛砖引玉,写了点简单的,希望能对用到WebGrid的新手朋友们有点点帮助,不要象俺开始做WebGrid时一样痛苦.相信有了这几篇入门级的文章,下面的开发对大家来说,应该要容易多了.
抛砖引玉,写了点简单的,希望能对用到WebGrid的新手朋友们有点点帮助,不要象俺开始做WebGrid时一样痛苦.相信有了这几篇入门级的文章,后续的开发对大家来说,应该要容易多了.
<ClientSideEvents
ColumnHeaderClickHandler="UltraWebGrid1_ColumnHeaderClickHandler" BeforeCellChangeHandler="UltraWebGrid1_BeforeCellChangeHandler"
BeforeColumnSizeChangeHandler="UltraWebGrid1_BeforeColumnSizeChangeHandler" KeyDownHandler="UltraWebGrid1_KeyDownHandler"
BeforeRowTemplateCloseHandler="UltraWebGrid1_BeforeRowTemplateCloseHandler" ColumnDragHandler="UltraWebGrid1_ColumnDragHandler"
KeyUpHandler="UltraWebGrid1_KeyUpHandler"
BeforeRowExpandedHandler="UltraWebGrid1_BeforeRowExpandedHandler"
GridCornerImageClickHandler="UltraWebGrid1_GridCornerImageClickHandler" BeforeRowSizeChangeHandler="UltraWebGrid1_BeforeRowSizeChangeHandler"
BeforeRowCollapsedHandler="UltraWebGrid1_BeforeRowCollapsedHandler" BeforeRowInsertHandler="UltraWebGrid1_BeforeRowInsertHandler"
RowSelectorClickHandler="UltraWebGrid1_RowSelectorClickHandler" AfterRowSizeChangeHandler="UltraWebGrid1_AfterRowSizeChangeHandler"
BeforeExitEditModeHandler="UltraWebGrid1_BeforeExitEditModeHandler" CellChangeHandler="UltraWebGrid1_CellChangeHandler"
ClickCellButtonHandler="UltraWebGrid1_ClickCellButtonHandler" AfterCellUpdateHandler="UltraWebGrid1_AfterCellUpdateHandler"
EditKeyUpHandler="UltraWebGrid1_EditKeyUpHandler" BeforeSelectChangeHandler="UltraWebGrid1_BeforeSelectChangeHandler"
ValueListSelChangeHandler="UltraWebGrid1_ValueListSelChangeHandler" AfterColumnMoveHandler="UltraWebGrid1_AfterColumnMoveHandler"
MouseUpHandler="UltraWebGrid1_MouseUpHandler"
InitializeLayoutHandler="UltraWebGrid1_InitializeLayoutHandler"
BeforeRowTemplateOpenHandler="UltraWebGrid1_BeforeRowTemplateOpenHandler" BeforeSortColumnHandler="UltraWebGrid1_BeforeSortColumnHandler"
BeforeColumnMoveHandler="UltraWebGrid1_BeforeColumnMoveHandler" AfterRowCollapsedHandler="UltraWebGrid1_AfterRowCollapsedHandler"
BeforeCellUpdateHandler="UltraWebGrid1_BeforeCellUpdateHandler" MouseDownHandler="UltraWebGrid1_MouseDownHandler"
AfterSelectChangeHandler="UltraWebGrid1_AfterSelectChangeHandler" DblClickHandler="UltraWebGrid1_DblClickHandler"
AfterRowTemplateOpenHandler="UltraWebGrid1_AfterRowTemplateOpenHandler" BeforeEnterEditModeHandler="UltraWebGrid1_BeforeEnterEditModeHandler"
EditKeyDownHandler="UltraWebGrid1_EditKeyDownHandler" AfterRowExpandedHandler="UltraWebGrid1_AfterRowExpandedHandler"
TemplateUpdateControlsHandler="UltraWebGrid1_TemplateUpdateControlsHandler" AfterRowTemplateCloseHandler="UltraWebGrid1_AfterRowTemplateCloseHandler"
CellClickHandler="UltraWebGrid1_CellClickHandler" AfterRowDeletedHandler="UltraWebGrid1_AfterRowDeletedHandler"
AfterEnterEditModeHandler="UltraWebGrid1_AfterEnterEditModeHandler" AfterColumnSizeChangeHandler="UltraWebGrid1_AfterColumnSizeChangeHandler"
AfterRowActivateHandler="UltraWebGrid1_AfterRowActivateHandler" MouseOverHandler="UltraWebGrid1_MouseOverHandler"
AfterSortColumnHandler="UltraWebGrid1_AfterSortColumnHandler" InitializeRowHandler="UltraWebGrid1_InitializeRowHandler"
MouseOutHandler="UltraWebGrid1_MouseOutHandler" BeforeRowDeletedHandler="UltraWebGrid1_BeforeRowDeletedHandler"
AfterExitEditModeHandler="UltraWebGrid1_AfterExitEditModeHandler" TemplateUpdateCellsHandler="UltraWebGrid1_TemplateUpdateCellsHandler"
BeforeRowActivateHandler="UltraWebGrid1_BeforeRowActivateHandler" AfterRowInsertHandler="UltraWebGrid1_AfterRowInsertHandler">
</ClientSideEvents>
前台函数定義形式:
function UltraWebGrid1_MouseOverHandler(gridName, id, button)
function UltraWebGrid1_AfterSelectChangeHandler(gridName, id)
function UltraWebGrid1_ValueListSelChangeHandler(gridName, selectId, cellId)
function UltraWebGrid1_CellChangeHandler(gridName, cellId)
function UltraWebGrid1_AfterRowSizeChangeHandler(gridName, rowId, height)
function UltraWebGrid1_AfterCellUpdateHandler(gridName, cellId)
function UltraWebGrid1_AfterColumnMoveHandler(gridName, columnId)
function UltraWebGrid1_AfterColumnSizeChangeHandler(gridName, columnId, width)
function UltraWebGrid1_AfterEnterEditModeHandler(gridName, cellId)
function UltraWebGrid1_AfterExitEditModeHandler(gridName, cellId)
function UltraWebGrid1_AfterRowActivateHandler(gridName, rowId)
function UltraWebGrid1_AfterRowCollapsedHandler(gridName, rowId)
function UltraWebGrid1_AfterRowDeletedHandler(gridName, rowId)
function UltraWebGrid1_AfterRowExpandedHandler(gridName, rowId)
function UltraWebGrid1_AfterRowInsertHandler(gridName, rowId)
function UltraWebGrid1_AfterRowTemplateCloseHandler(gridName, rowId, bSaveChanges)
function UltraWebGrid1_AfterRowTemplateOpenHandler(gridName, rowId)
function UltraWebGrid1_AfterSortColumnHandler(gridName, columnId)
function UltraWebGrid1_BeforeCellChangeHandler(gridName, cellId)
function UltraWebGrid1_BeforeCellUpdateHandler(gridName, cellId, value)
function UltraWebGrid1_BeforeColumnMoveHandler(gridName, columnId)
function UltraWebGrid1_BeforeColumnSizeChangeHandler(gridName, columnId, width)
function UltraWebGrid1_BeforeEnterEditModeHandler(gridName, cellId)
function UltraWebGrid1_BeforeExitEditModeHandler(gridName, cellId)
function UltraWebGrid1_BeforeRowActivateHandler(gridName, rowId)
function UltraWebGrid1_BeforeRowCollapsedHandler(gridName, rowId)
function UltraWebGrid1_BeforeRowDeletedHandler(gridName, rowId)
function UltraWebGrid1_BeforeRowExpandedHandler(gridName, rowId)
function UltraWebGrid1_BeforeRowInsertHandler(gridName, rowId)
function UltraWebGrid1_BeforeRowSizeChangeHandler(gridName, rowId)
function UltraWebGrid1_BeforeRowTemplateCloseHandler(gridName, rowId, bSaveChanges)
function UltraWebGrid1_BeforeRowTemplateOpenHandler(gridName, rowId, templateId)
function UltraWebGrid1_BeforeSelectChangeHandler(gridName, id)
function UltraWebGrid1_BeforeSortColumnHandler(gridName, columnId)
function UltraWebGrid1_CellClickHandler(gridName, cellId, button)
function UltraWebGrid1_ClickCellButtonHandler(gridName, cellId)
function UltraWebGrid1_ColumnDragHandler(gridName, columnId, insertBeforeColumnId)
function UltraWebGrid1_ColumnHeaderClickHandler(gridName, columnId, button)
function UltraWebGrid1_DblClickHandler(gridName, cellId)
function UltraWebGrid1_EditKeyDownHandler(gridName, cellId, key)
function UltraWebGrid1_EditKeyUpHandler(gridName, cellId, key)
function UltraWebGrid1_GridCornerImageClickHandler(gridName)
function UltraWebGrid1_InitializeLayoutHandler(gridName)
function UltraWebGrid1_InitializeRowHandler(gridName, rowId)
function UltraWebGrid1_KeyDownHandler(gridName, cellId, key)
function UltraWebGrid1_KeyUpHandler(gridName, cellId, key)
function UltraWebGrid1_MouseDownHandler(gridName, id, button)
function UltraWebGrid1_MouseOutHandler(gridName, id, button)
function UltraWebGrid1_MouseUpHandler(gridName, id, button)
function UltraWebGrid1_RowSelectorClickHandler(gridName, rowId, button)
function UltraWebGrid1_TemplateUpdateCellsHandler(gridName, controlId, cellId)
function UltraWebGrid1_TemplateUpdateControlsHandler(gridName,controlId,cellId,value)
var oGrid = oUltraWebGrid1; [oUltraWebGrid1 は Globle ]
var oBands = oGrid.Bands;
var oBand = oBands[0];
var oColumns = oBand.Columns;
var count = oColumns.length;
var oRows = oGrid.Rows;
前台属性(JavaScript用)
gridId: UltraWebGrid1
rowIdの形式: UltraWebGrid1r_4
cellIdの形式: UltraWebGrid1rc_4_1
Grid オブジェクト
{
.RowSizing = 2;
.SelectTypeRow = 2;
}
行(Row オブジェクト):
{
.Element.id --------- 形式:WebGrid名称+r_X(X:Row番号)
例えば:UltraWebGrid1r_4
}
セル(Cell オブジェクト):
{
.style.backgroundColor = "Red";
.style.fontWeight = "bold";
.Element.style.fontStyle = "italic";
.Element.style.fontWeight = "bold";
.Element.runtimeStyle.backgroundColor = "Red";
.Element.id----------- 形式:WebGrid名称+rc_X_Y(X:Row番号,Y:Col番号)
例えば:UltraWebGrid1rc_4_1
}
列(column オブジェクト)
{
.Key == "PostalCode"
}
前台函数(JavaScript用)
//***************************************
//関数名:igtbl_getGridById
//機 能:指定IdのWebGridの引用を取得
//引 数:WebGridのId
//戻り型:WebGridオブジェクト
//戻り値:オブジェクト
//***************************************
用法: var grid = igtbl_getGridById("UltraWebGrid1");
//***************************************
//関数名:igtbl_getRowById
//機 能:現在のセルのRowオブジェクトを取得します。
//引 数:CellのId
//戻り型:Rowオブジェクト
//戻り値:オブジェクト
//***************************************
用法: var row = igtbl_getRowById(cellId);
//***************************************
//関数名:igtbl_getColumnById
//機 能:指定IdのColumn引用を取得する
//引 数:CellのId
//戻り型:Columnオブジェクト
//戻り値:オブジェクト
//***************************************
用法: var column = igtbl_getColumnById(cellId);
if(column.Key == "PostalCode")
//***************************************
//関数名:igtbl_getCellById
//機 能:指定IdのCell引用を取得する
//引 数:CellのId
//戻り型:Cellオブジェクト
//戻り値:オブジェクト
//***************************************
用法: var cell = igtbl_getCellById(cellId);
//***************************************
//関数名:igtbl_getActiveRow
//機 能:指定IdのWebGridの選択されるRowを取得
//引 数:WebGridのId
//戻り型:Rowオブジェクト
//戻り値:オブジェクト
//***************************************
用法: var row = igtbl_getActiveRow("UltraWebGrid1");
//***************************************
//関数名:igtbl_setActiveRow
//機 能:指定のRow 選択する
//引 数:GridId,rowId
//戻り型:なし
//戻り値:なし
//***************************************
用法: igtbl_setActiveRow('UltraWebGrid1',igtbl_getElementById("UltraWebGridr_3"));
//***************************************
//関数名:igtbl_getActiveCell
//機 能:指定IdのWebGridの選択されるCellを取得
//引 数:WebGridのId
//戻り型:Cellオブジェクト
//戻り値:オブジェクト
//***************************************
用法: var cell = igtbl_getActiveCell("UltraWebGrid1");
//***************************************
//関数名:getRow
//機 能:指定番号のRow オブジェクトの引用を取得
//引 数:Row番号
//戻り型:オブジェクト
//戻り値:指定番号のRowオブジェクト
//***************************************
用法: var oRow = oRows.getRow(i);
//***************************************
//関数名:getCell
//機 能:指定番号のCellオブジェクトの引用を取得
//引 数:Cell番号
//戻り型:オブジェクト
//戻り値:指定番号のCellオブジェクト
//***************************************
用法: var row = igtbl_getRowById(cellId);
var cell = row.getCell(16);
//***************************************
//関数名:getSelected
//機 能:指定のRow の選択ステートをチャック
//引 数:なし
//戻り型:boolean
//戻り値:false:指定番号のRow 選択される
true:指定番号のRow 選択されない
//***************************************
用法: [oRow = oRows.getRow(i);]
oRow.getSelected()
//***************************************
//関数名:setSelected
//機 能:指定のRowが選択される
//引 数:boolean
//戻り型:なし
//戻り値:なし
//***************************************
用法: [oRow = oRows.getRow(i);]
oRow.setSelected(true);
oRow.setSelected(false);
//***************************************
//関数名:igtbl_selectRow
//機 能:指定IdのRowの選択ステートを設置
//引 数:WebGrid のId,Row のId,boolean,boolean
//戻り型:なし
//戻り値:なし
//***************************************
用法: var row = igtbl_getActiveRow("UltraWebGrid1");
igtbl_selectRow("UltraWebGrid1", row.Element.id, false, false);
//***************************************
//関数名:igtbl_selectCell
//機 能:指定IdのCellの選択ステートを設置
//引 数:WebGrid のId,Cell のId,boolean,boolean
//戻り型:なし
//戻り値:なし
//***************************************
用法: var cell = igtbl_getActiveCell("UltraWebGrid1");
igtbl_selectCell("UltraWebGrid1", cell.Element.id, false, false);
//***************************************
//関数名:setValue
//機 能:指定Cellの内容を設置
//引 数:内容
//戻り型:なし
//戻り値:なし
//***************************************
用法: var cell = igtbl_getCellById(cellId);
if(cell)
{
var elem = cell.Element;
elem.runtimeStyle.backgroundColor = "Red";
elem.style.backgroundColor = "Red";
cell.setValue("ダブルクリック");
}
//***************************************
//関数名:setExpanded
//機 能:
//引 数:
//戻り型:なし
//戻り値:なし
//***************************************
用法: oRow.setExpanded(true);
後台属性:
1.UltraWebGrid1.DisplayLayout.CellClickActionDefault セルのクリックイベント
Case "設定なし"
UltraWebGrid1.DisplayLayout.CellClickActionDefault = CellClickAction.NotSet
Case "セル選択"
UltraWebGrid1.DisplayLayout.CellClickActionDefault = CellClickAction.CellSelect
Case "行選択"
UltraWebGrid1.DisplayLayout.CellClickActionDefault = CellClickAction.RowSelect
Case "編集"
UltraWebGrid1.DisplayLayout.CellClickActionDefault = CellClickAction.Edit
2.UltraWebGrid1.DisplayLayout.SelectTypeRowDefault 行の選びタイプ
Case "デフォルト"
UltraWebGrid1.DisplayLayout.SelectTypeRowDefault = SelectType.None
Case "単一行"
UltraWebGrid1.DisplayLayout.SelectTypeRowDefault = SelectType.Single
Case "複数行"
UltraWebGrid1.DisplayLayout.SelectTypeRowDefault = SelectType.Extended
3.UltraWebGrid1.DisplayLayout.SelectTypeColDefault 列の選びタイプ
Case "デフォルト"
UltraWebGrid1.DisplayLayout.SelectTypeColDefault = SelectType.None
Case "単一列"
UltraWebGrid1.DisplayLayout.SelectTypeColDefault = SelectType.Single
Case "複数列"
UltraWebGrid1.DisplayLayout.SelectTypeColDefault = SelectType.Extended
4.UltraWebGrid1.DisplayLayout.SelectTypeCellDefault セルの選びタイプ
Case "デフォルト"
UltraWebGrid1.DisplayLayout.SelectTypeCellDefault = SelectType.None
Case "単一セル"
UltraWebGrid1.DisplayLayout.SelectTypeCellDefault = SelectType.Single
Case "複数セル"
UltraWebGrid1.DisplayLayout.SelectTypeCellDefault = SelectType.Extended
UltraWebGrid1.Rows(0).Cells(0).Activate()
关于WebGrid的最后一讲啦,主要是一些简单前台/后台操作小例子
1.前台验证某列是否为日期格式