Coolite 基本用法（2）

一、

1。Coolite下如何自定义控件样式表

1<style type="text/css">
2         .x-grid3-td-fullName .x-grid3-cell-inner {
3             font-family:tahoma, verdana;
4             display:block;
5             font-weight:normal;
6             font-style: normal;
7             color:#385F95;
8             white-space:normal;
9        }
10        
11        .x-grid3-row-body p {
12             margin:5px 5px 10px 5px !important;      
13             width:99%;
14          color:Gray;      
15        }
16
17    </style>
18
19            <View>
20                <ext:GridView ID="GridView1" runat="server" EnableRowBody="true">
21                    <GetRowClass Handler="rowParams.body = '<p>' + record.data.Notes + '</p>'; return 'x-grid3-row-expanded';" />                    
22                </ext:GridView>        
23            </View>    

Coolite和EXT的自定义CSS方法就是这样， 按照标准名字定义样式就行了
如.x-grid3-summary-row， 自动识别，如果还不明白，可以下载个ExtJS，进入到ext.css里面就能看到所有CSS的名字

2.
       (1)Coolite控件语言包问题，如Grid，和日期类型控件，汉化的方法

<asp:ScriptManager ID="ScriptManager2" runat="server">
        <Scripts>
           <asp:ScriptReference Path="ext-lang-zh_CN.js" />
      </Scripts>
</asp:ScriptManager>

       (2)ScriptManager问题,如果一个页面内同时出现两个ScriptManager就会报错（导致一个页面不能做多个管理模块），如果实现让“模块”运行时，检查当前页面，是否其他模块已经存在ScriptManager,存在就不注册新的

Coolite.Ext.Web.ScriptManager scmanager = Coolite.Ext.Web.ScriptManager.GetCurrent(this.Page);
if (scmanager == null)
{
    scmanager = new Coolite.Ext.Web.ScriptManager();
   this.Controls.Add(scmanager);
}

    (3)针对上面两个问题，我们在DNN在使用Coolite，并且调用汉化包，要这样使用

              if (!Page.IsPostBack)
                 {

                     Coolite.Ext.Web.ScriptManager scmanager = Coolite.Ext.Web.ScriptManager.GetCurrent(this.Page);
                    if (scmanager == null)
                     {
                         scmanager = new Coolite.Ext.Web.ScriptManager();
                        this.Controls.Add(scmanager);
                     }

                    if (DotNetNuke.Framework.AJAX.IsInstalled())
                     {
                         DotNetNuke.Framework.AJAX.RegisterScriptManager();
                         System.Web.UI.ScriptManager objScriptManager = System.Web.UI.ScriptManager.GetCurrent(this.Page);
                        if (objScriptManager != null)
                         {
                             ScriptReference scr = new ScriptReference("~/js/ext-lang-zh_CN.js");
                             objScriptManager.Scripts.Add(scr);
                         }
                     }

3.Coolite和<%=this.ClientID %>

我们建立一个普通的ASP.NET网站，编写如下代码

HTML:

<ext:GridPanel
     runat="server"
      ID="GridPanel1"

JS:

 

function MSG()
{
     alert(GridPanel1);
}

这样是实现的， 但是同样把类似代码移到DotNetNuke下去实现

 

<ext:GridPanel
    runat="server"
     ID="DocmentGridPanel"
     Title="公文管理"
     StoreID="StoreDocumentType"
     Height="500" Header="false">
    。。。。。。。。。
JS:
function MSG()
{
     alert(DocmentGridPanel);
}

这样确实出错的，找不到对象DocumentGridPanel...

 

如何解决这个问题呢？

我观察两种代码生成的客户端代码

 

普通网站项目，查看页面代码
<input name="GridPanel1_SM" type="hidden" id="GridPanel1_SM" />

DNN外面有个dnn_ctr1486_DocumentType代表这个模块框
<input name="dnn$ctr1486$DocumentType$DocmentGridPanel_SM" type="hidden" id="dnn_ctr1486_DocumentType_DocmentGridPanel_SM" />

就有点明白了，DNN所有控件的外层包裹一个"容器".

我们用如下方法

<%=this.ClientID %>_DocmentGridPanel

就可以实现了

alert(<%=this.ClientID %>_DocmentGridPanel);

4.为你要删除的记录增加删除验证(Coolite)　

<script type="text/javascript">  
function DelSelectedRows()
{
     Ext.MessageBox.confirm('提示', '是否要删除这些记录',function(btn)
     {
        if (btn == "yes")
         {
             Coolite.AjaxMethods.DeleteSelectedWorkFlow();
         }
     });
}
function DelSelected(selectedID)
{
     Ext.MessageBox.confirm('提示', '是否要删除此记录',function(btn)
     {
        if (btn == "yes")
         {
             Coolite.AjaxMethods.DeleteWorkFlow(selectedID);
         }
     });
}
</script>

<ext:Button ID="btnDelete" runat="server"   Text="删除选中" Icon="Delete">
        <Listeners>
            <Click Fn="DelSelectedRows" />
        </Listeners>
        </ext:Button>

GridPanel中。。
<Listeners>
<Command Handler="if (command=='Edit'){Coolite.AjaxMethods.EditWorkFlow(record.data.WFWorkFlowID);}else if(command='Delete'){DelSelected(record.data.WFWorkFlowID);}" />
</Listeners>    
<SelectionModel>
     <ext:RowSelectionModel ID="RowSelectionModel1" runat="server" />
</SelectionModel>

5.Coolite的Combobox的setValue和setRawValue
Coolite的Javascript代码中的
Combobox的setValue(record.data['DesktopModuleID']);
将会使SelectedItem的Text和Value都变成
record.data['DesktopModuleID']
所以调用之后应该调用次
Combobox的setRawValue(record.data['FriendlyName']);
会改变Text的值为想显示的，SetRawValue一定要在SetValue之后调用
如以下代码

var selectDesktopModule = function (selectionModel , rowIndex, record) {
        <%= DesktopModuleWindow.ClientID %>.hide(null);
         hidCtrl.setValue(record.data['DesktopModuleID']);
         hidCtrl.setRawValue(record.data['FriendlyName']);
         hidCtrl.triggers[0].show();
     }

6.关于Coolite的AjaxMetod在MasterPage或者CMS系统下使用问题
       在UserControl(ascx)，MasterPage或者Page(aspx)中使用Coolite的AjaxMetod讲究是不同的

在MasterPage中或者你在类似DotNetNuke的系统中调用AjaxMetod标志的方法，默认情况下是会找不到方法的，

处理此类问题需要使用AjaxMethodProxyID,使用的方法是在类的前面加上，如下

[AjaxMethodProxyID(IDMode = AjaxMethodProxyIDMode.None)]
partial class ModuleRightManager : PortalModuleBase

我们先看一下几种AjaxMethodProxyID 的区别

1. None - 命名前缀是空的，调用方法时直接使用 Coolite.AjaxMethods.ajaxMethod(...)
2. ClientID - 命名前缀需要加上当前类控件的client id(客户端前缀)

           如Coolite.AjaxMethods.ctl00_UC1.ajaxMethod

            当然通常情况下我们Coolite.AjaxMethods.<%=this.ClientID>.ajaxMethod(...)
3. ID - 使用当前控件ID作为前缀, Coolite.AjaxMethods.UC1.ajaxMethod(...)
4. Alias - 使用别名做前缀，你可以声明自己的一个别名, Coolite.AjaxMethods.myAlias.ajaxMethod(...)
5. AliasPlusID - 别名和ID同时使用,如 Coolite.AjaxMethods.myAliasUC1.ajaxMethod(...)

在有MasterPage页面或者在类似DotNetNuke的CMS系统下使用Coolite的AJAXMethod,建议你在页面的前部加上

     [AjaxMethodProxyID(IDMode = AjaxMethodProxyIDMode.ClientID)]
    public partial class PopupCustomerDetail : PortalModuleBase

 

原文：http://hi.baidu.com/haofz1983/blog/item/d4c8fe34b9d5f8325ab5f55f.html