AjaxEvents、Listeners学习笔记

1.AjaxEvents

<AjaxEvents>
                <Click OnEvent="Select">
                    <ExtraParams>
                        <ext:Parameter Name="Id" Value="node.id" Mode="Raw">
                        </ext:Parameter>
                        <ext:Parameter Name="Name" Value="node.text" Mode="Raw">
                        </ext:Parameter>
                    </ExtraParams>
                </Click>                
</AjaxEvents>

2.Listeners

<Listeners>
                <Click Handler="alert(node.attributes.hrefTarget);" Fn="" />
</Listeners>  

 

Handler与Fn以及OnEvent的区别？

1.Fn(优先级高于Handler，当两则共同存在时则Handler就不再起作用了。)

The raw JavaScript function to be called when this Listener fires.

<Click Fn="Function_Name" />

此处只写函数名，函数体写在Head当中。

2.Handler

The JavaScript logic to be called when this Listener fires. The Handler will be automatically wrapped in a proper function(){} template and passed the correct arguments for this event.

<Click Handler="alert(node.attributes.hrefTarget);" />

此处不能写函数名，只能写一段JS代码。

3.OnEvent(用于写在.cs文件里面的后台代码)

<Click OnEvent="Select">
                    <ExtraParams>
                        <ext:Parameter Name="Id" Value="node.id" Mode="Raw">
                        </ext:Parameter>
                        <ext:Parameter Name="Name" Value="node.text" Mode="Raw">
                        </ext:Parameter>
                    </ExtraParams>
</Click>

        /// <summary>
        /// 点击树所触发的事件
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        public void Select(object sender, AjaxEventArgs e)
        {
            //Ext.Msg.Alert("当前选中值", sender.ToString()).Show();
            string text = "";

            foreach (Coolite.Ext.Web.Parameter item in e.ExtraParams)
            {
                text += item.Name+" ： "+ item.Value+"<br/>";
            }
          
            Ext.Msg.Alert("当前选中值", text).Show();
        }

Handler与Fn以及OnEvent的转换方式？

<Listeners>
                <BeforeLoad Fn="nodeLoad" />
</Listeners>

<script type="text/javascript">
        function nodeLoad(node) {
            Coolite.AjaxMethods.NodeLoad(node.id, {
                success: function(result) {
                    var data = eval("(" + result + ")");
                    node.loadNodes(data);
                },

                failure: function(errorMsg) {
                    Ext.Msg.alert('Failure', errorMsg);
                }
            });           
        }
    </script>

        [AjaxMethod]
        public static string NodeLoad(string nodeID)
        {
            Coolite.Ext.Web.TreeNodeCollection nodes = new Coolite.Ext.Web.TreeNodeCollection();
            if (!string.IsNullOrEmpty(nodeID))
            {
                for (int i = 1; i < 6; i++)
                {
                    AsyncTreeNode asyncNode = new AsyncTreeNode();
                    asyncNode.Text = nodeID + i;
                    asyncNode.NodeID = nodeID + i;
                    nodes.Add(asyncNode);
                }

                for (int i = 6; i < 11; i++)
                {
                    Coolite.Ext.Web.TreeNode treeNode = new Coolite.Ext.Web.TreeNode();
                    treeNode.Text = nodeID + i;
                    treeNode.NodeID = nodeID + i;
                    treeNode.Leaf = true;
                    nodes.Add(treeNode);
                }
            }

            return nodes.ToJson();
        }