最近为了优化CMS,需要准备一款标准的Grid控件。研究了很多Grid控件,发现ComponentArt的比较简单,功能与我们所需的比较接近,因此,就在ComponentArt2008的反编译代码中进行修改。样式如下:
为此,专门编写了一个SQL WHERE条件的解析算法,并且将SQL解析成一个树。
前端页面改动如下图:
后端添加解析的代码
ComponentArt修改笔记
文件378,主要是构建Callback调用。
文件988,主要用于构建整个对像实例。
文件198,主要是显示输出构建及属性初始化
文件178,主要是用于用户操作函数,用于用户交互。
1、换一个最新的控件源代码,结果发现License不对,手工修改。修改WebControl的IsLicense方法,直接返回True。
2、在Grid中加入一个属性AllowFilterThroughProvider,用于在保留原有功能的情况下,能够扩展新的筛选方案,并且是在Provider中进行过滤,而不是原来的在DataView中进行过滤或排序。
修改后发现原来的表达式好像不是太好,因此,可能过滤不能用作一个无法确定的表达式。建议改成基于Filter的一个树状对像。发现大量的JS中很难定位。
因此,我们需要对JS进行解析。首先,做了一个JS的格式化工具,主要将一行写完的JS转成多行JS,看得更明白,有退行等。发现有可能JS将一个字符串截断了,导致JS错误。恢复JS,然后重新生成,缓冲时间过后就正常了。因此需要重新来转换JS。主要是一些字符串中有;导致的。
切换计划:
1、更新分页显示。 198文件1293行。将原代码注释,并加入自己的代码。没有发现刷新现像。
@可能需要将分页的数据显示方式再进行适当处理,当前使用方法不太舒服。
2、增加按钮。
1)增加GridButton.cs,GridButtonCollection.cs,定义后台的按钮和集合。
2)在Grid.cs中加相关。ShowButtons,ButtonsPosition,ButtonsCssClass,Buttons等属性,并针对GridElementPosition增加一个Head枚举值。
3)在Grid.cs中加入JS初始化代码。在函数ComponentArtRender中第4880附近添加代码。同时添加函数GenerateGridButtons。同时还需要加在4915行附近,以在JS中初始化位置及是否显示按钮的参数。
4)在198文件中加入关于Button的输出JS代码,同步调整RenderHeader方法,将Button放在Group代码之前。
941行处,RenderHeader多加一个Position代码 Header
799行处,RenderElement加入RenderButton代码。
5)在178文件中加入Button的相关定义及Grid上属性的调整
1)在GridEventArgs中增加通用按钮事件参数类。GridButtonEventArgs
2)Grid中增加代理,8500行左右,添加GridButtonEventHandler,ButtonClicked。
在4969附近增加AutoCallBackOnButtonClick属性的输出,并 823行增加相关属性。
3)在Grid方法ExecuteScript中添加代码,位于6255行,增加选项BUTTONCLICK。此部分需要与JS中的同步。此时,传入参数有5个。
其中第2个和第4个参数分别为Level的ID及RowXML值。此时为多个ROW。第5个参数为按钮名称。
此时,GridItem默认的初始化方法只能初始化一行,而按钮有可能处理的是多行,因此需要检查一下。位于6256行左右。
4)在178文件的650行增加一个属性:AutoCallBackOnButtonClick
651行PublicMethods上增加一个方法“ButtonClick”。此处的名称必须与下面的方法名称一致,尽量做到参数也一致。
@具体参数没有确定。暂定为:["ButtonClick",,null,[["buttonName",String],["isCall",Boolean]]],
652行PublicEvents加一个事件"ButtonClick"。
1280行附近,增加一个处理方法ButtonClick ,function(_buttonName,_isCall)
_isCall表示是否需要传入行的信息
_buttonName表示按钮的名称,用于向后部传输入信息。
函数中将行的数据转换成一个字串,并通过RecordEvent传入在事件队列中,通过CallBack发送到后方。
@初步完成按钮的事件,但好像提交一次按钮事件,后台会处理四次。但从Post事件来看,只有一次。原来可能是JS中的事件没有被清除。已经解决。OK
5)在378文件222行DoCallBack方法的_44变量中加入ButtonClick,清除前面挂接的事件。解决上述问题。
3、增加简单过滤条件。
1)增加过滤条件对像FilterColumn,FilterColumnCollection。
2)在Grid中修改关于Column及FilterColumn的初始化及输出方法。
增加属性SearchField,SearchCompare。用于记录Search相关的客户端的值。在4944行增加输出代码。
@这时候比较条件可能有>或小于符号,对系统影响不确定。已经解决,用Esc进行格式化。OK
增加GenerateFilterColumnData方法,用于输入符合条件的JS表达式。并在6556行加入到输出序列中。
3)在GridLevel中增加关于Filter相关的事项。
修改Clone方法,增加关于FilterColumns的复制。
修改GetXML及ToXML方法,加入关于FilterColumns的解析及输出。
4)在178文件的233行附近,加入关于FilterColumns等的定义。644行附近增加Search Field等的定义。
5)在198文件上增加关于这些过滤字段的显示。位于1077行附近。
6)在178文件上修改关于搜索的一些函数。
1058行附近的SearchClear,清除查询条件。Validator,验证输入条件是否正确。
1088行附近SearchExecute
2489行Search方法
2166行附近增加LoadCompareType方法,用于在查询字段发生变化时变更比较符号。
@加入搜索框后列表发生闪烁。经检查,发现原测试代码中也会有此现像。可能是多次Write的时候产生的感觉。
上条通过后台生成控件解决。OK
4、增加复杂过滤条件。
1)加入FilterExpress文件目录,加入关于过滤方案的一些方法。相当于增加了过滤条件方案的对像类。
2)在Grid.cs中增加SearchCase,AdvanceSearchTextCssClass,AdvanceSearchPosition,ShowAdvanceSearchBox等属性
在5084行附近增加相关属性的输出。
增加GenerateSearchCaseData方法,并在6560附近加入到输出队列中。
3)在GridLevel中增加关于SearchCase相关的方法。
修改Clone方法。
修改GetXML及ToXML方法。
此时同步修改了FilterParse及SearchCase等类的ToXML及FromXML方法。
4)在178文件233行附近增加SearchCaseName,SearchCases等属性。644行附近增加this.SearchCase="";
5)在198文件上增加显示区域。位于1062行附近。
6)在178文件上修改关于搜索的函数。
2186行附近,增加LoadSearchCase,SetupSearchCase方法
@此方法为空,需要增加。OK
已经去除LoadSearchCase方法,通过后台来Load。
7)在Grid.cs的最后加一段关于FilterItem的解析代码。
@需要在ASPX中加一段SearchCase的代码,并且能够Load到页面中。页面刷新时能保存此代码不变。OK
@复合条件表达式能否采用类似SQL的语法,而不是树状的结构?这样更直观。OK
@在客户端进行数据输入的第一步验证,减少提交到后台的错误代码。
@使用模板型数据?
此项已经更正。
#1) 增加过滤条件的一个模板属性。SearchTemplateID,并且在Grid输出代码中加入(5147行)。
#2) 在178文件中增加属性(243行)SearchTemplateID
# 在1618行附近添加方法GetSearchTemplateContent用于获得Template的InnerHTML值。
3)修改Grid的Render过程,添加RenderAdvanceSearchBox方法。
4)将JS端的Search代码废掉,全部从后台Load,并通过JS关联。
5)去掉SearchTemplateID属性。
6)调整了178中的关于SearchCase的方法,并更正了178中的Grid.SearchCase为Grid.SearchCaseName,包括Grid.cs中相关的初始化值的属性。
需要继续完成的工作:
5、准备创建关于SearchCase的设置层?还是先用一个简单的方法来显示SearchCase的信息,需要使用回调的方法从后台提取SearchCase的属性。
6、准确规范Grid中涉及的各部分的CSS名称及一个标准的风格案例。
7、支持模板化的更新,即类似弹窗一样的东东,可以定制更新模板。