• Ext.Net一些特别问题(有些未验证)


    一:怎么动态增加TreePanel的子级 和怎么获得TreePanle树的值

    前台:

    (1)

    var store = App.TreePanel1.getStore(),
    node = store.getNodeById("Node1");
     
    node.appendChild({
    text : "The New Node",
    leaf : true
    })
     
    (2)
     
    var sm = App.TreePanel1.getSelectionModel();
    selectedNode,
    parentNode;
     
    if (sm.hasSelection()) {
    selectedNode = sm.getSelection()[0],
    parentNode = selectedNode.parentNode;
    }
     
     
    后台
     
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
     
    <script runat="server">
    protected void GetSelectedNode(object sender, DirectEventArgs e)
    {
    TreeSelectionModel sm = this.TreePanel1.GetSelectionModel() as TreeSelectionModel;
    string msg = "no selection";
    if (sm.SelectedNodes != null)
    {
    SubmittedNode node = sm.SelectedNodes[0];
    msg = node.Text;
    }
    X.Msg.Alert("GetSelectedNode", msg).Show();
    }
     
    protected void AddNode(object sender, DirectEventArgs e)
    {
    Node node = new Node()
    {
    Text = "NEW NODE",
    Leaf = true
    };
    this.TreePanel1.GetNodeById("Root").AppendChild(node);
    }
    </script>
     
    <!DOCTYPE html>
     
    <html>
    <head runat="server">
    <title>Ext.NET v2 Example</title>
    </head>
    <body>
    <form runat="server">
    <ext:ResourceManager runat="server" />
    <ext:TreePanel ID="TreePanel1" runat="server" AutoHeight="true">
    <Root>
    <ext:Node NodeID="Root" Text="Root (level 0)" Expanded="true">
    <Children>
    <ext:Node Text="Node1 (level 1)" Expanded="true">
    <Children>
    <ext:Node Text="Node1 (level 2)" Expanded="true">
    <Children>
    <ext:Node Text="Node1 (level 3)" Leaf="true" />
    <ext:Node Text="Node2 (level 3)" Leaf="true" />
    </Children>
    </ext:Node>
    </Children>
    </ext:Node>
    <ext:Node Text="Node2 (level 1)" Expanded="true">
    <Children>
    <ext:Node Text="Node1 (level 2)" Expanded="true">
    <Children>
    <ext:Node Text="Node1 (level 3)" Leaf="true" />
    <ext:Node Text="Node2 (level 3)" Leaf="true" />
    </Children>
    </ext:Node>
    </Children>
    </ext:Node>
    </Children>
    </ext:Node>
    </Root>
    <SelectionModel>
    <ext:TreeSelectionModel runat="server" />
    </SelectionModel>
    </ext:TreePanel>
     
    <ext:Button runat="server" Text="Get Selected Node" OnDirectClick="GetSelectedNode" />
    <ext:Button runat="server" Text="Add node" OnDirectClick="AddNode" />
    </form>
    </body>
    </html>
     
     
    二:动态创建TreePanel 并创建其上面创建button事件(不能有if (!X.IsAjaxRequest))
     
     
    <%@ Page Language="C#" %>
     
    <script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
    var tree = new TreePanel
    {
    ID = "TreePanel1",
    Title = "Test",
    ButtonAlign = Alignment.Left
    };
    var root = new Ext.Net.TreeNode()
    {
    AllowDrag = false,
    Text = "Form Name",
    Expanded = true
    };
    tree.Root.Add(root);
     
    var saveButton = new Ext.Net.Button
    {
    ID = "saveDef",
    Icon = Icon.Disk,
    Text = "Save Changes",
    };
    saveButton.Listeners.Click.Handler = "#{TreePanel1}.submitNodes();";
    tree.Buttons.Add(saveButton);
     
    Panel1.Items.Add(tree);
    }
     
    protected void SubmitNodes(object sender, SubmitEventArgs e)
    {
    X.Msg.Alert("Submit", "You have submitted " + e.RootNode.Children.Count + " nodes").Show();
    }
    </script>
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    <head runat="server">
    <title>Ext.Net Example</title>
    </head>
    <body>
    <form runat="server">
    <ext:ResourceManager runat="server" />
    <ext:Panel ID="Panel1" runat="server" />
    </form>
    </body>
    </html>
     
     
    三:Ext.NET控件TreePanel全选与反选
     
    <%@ Page Language="C#" %>
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <head runat="server">
    <title>Ext.NET Example</title>
    <script type="text/javascript">
    </script>
    </head>
    <body>
    <form runat="server">
    <ext:ResourceManager runat="server" />
    <ext:TreePanel ID="TreePanel1" runat="server" Height="300">
    <Root>
    <ext:TreeNode Text="Composers" Expanded="true" Checked="False">
    <Nodes>
    <ext:TreeNode Text="Beethoven" Expanded="true" Checked="False">
    <Nodes>
    <ext:TreeNode Text="Concertos" Expanded="true" Checked="False">
    <Nodes>
    <ext:TreeNode Text="Concert 1" Checked="False" />
    <ext:TreeNode Text="Concert 2" Checked="False" />
    </Nodes>
    </ext:TreeNode>
    </Nodes>
    </ext:TreeNode>
    </Nodes>
    </ext:TreeNode>
    </Root>
    <Buttons>
    <ext:Button runat="server" Text="Check all">
    <Listeners>
    <Click Handler="#{TreePanel1}.getRootNode().cascade(function(n){n.ui.toggleCheck(true);});" />
    </Listeners>
    </ext:Button>
    <ext:Button runat="server" Text="Uncheck all">
    <Listeners>
    <Click Handler="#{TreePanel1}.getRootNode().cascade(function(n){n.ui.toggleCheck(false);});" />
    </Listeners>
    </ext:Button>
    </Buttons>
    </ext:TreePanel>
    </form>
    </body>
    </html>
     
     
    四:TreePanel树后台创建事件并运行前端的JS
     
    <%@ Page Language="C#" %>
     
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
     
    <script runat="server">
    protected void TestDirectEventHandler(object sender, DirectEventArgs e)
    {
    Ext.Net.TreeNodeCollection nodes = new Ext.Net.TreeNodeCollection();
    Ext.Net.TreeNode node = new Ext.Net.TreeNode("p1", "picture Name", Icon.PictureLink);
    node.Leaf = true;
    nodes.Add(node);
    X.Js.AddScript("#{TreePanel1}.getSelectionModel().getSelectedNode().loadNodes(eval(" + nodes.ToJson() + "));");
    }
    </script>
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    <head runat="server">
    <title>Ext.Net Example</title>
    </head>
    <body>
    <form runat="server">
    <ext:ResourceManager runat="server" />
    <ext:TreePanel
    ID="TreePanel1"
    runat="server"
    AutoHeight="true"
    RootVisible="false">
    <Root>
    <ext:TreeNode Text="Root" Expanded="true">
    <Nodes>
    <ext:AsyncTreeNode Text="Node1" />
    <ext:AsyncTreeNode Text="Node2" />
    </Nodes>
    </ext:TreeNode>
    </Root>
    </ext:TreePanel>
    <ext:Button runat="server" Text="Test" OnDirectClick="TestDirectEventHandler" />
    </form>
    </body>
    </html>
     
     
    五:后台运行前台代码提示加载
     
    X.Js.AddScript("Ext.net.Mask.show('Executing...'); ");

    X.Js.AddScript("Ext.net.Mask.hide();");
     
     
    六:后台运行前台JS代码
     
    .cs 
     
    X.Call("clearFields");
     
    .js
     
    var clearFields = function () {
    Ext.Msg.notify("Info.", "I'm here...");
    }
     
    七:JS调用后台的方式
     

    第一种方法:也是大多人用的方法:

    1.资源管理器中起来别名:DirectMethodNamespace="X"

    <ext:ResourceManager ID="ResourceManager1" runat="server" DirectMethodNamespace="X"/>

    2.在js方法中这样调用

    X.方法名();

    第二种方法:我个人推荐的

    在js中直接调用后台方法不需要走别名

    App.direct.方法名();

    千万要记住在后台方法一定要标记为: [DirectMethod]

    八:Ext.Net弹出窗口回写父窗口

    用parent.App.就可以找到某个控件进行操作。

    parent.App.sss.setValue(t);
    parent.App.winSetting.hide();

    九:Ext.Net:Panel增加背景图

    <ext:Panel runat="server" ID="Panel1" BodyStyle="background:url(/Resources/images/Desktop/1.jpg) left bottom repeat-x;">
    <Items>
    </Items>
    </ext:Panel>

    十:动态增加CheckboxGroup选项

    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    <script runat="server">
    protected void AddCheckboxClick(object sender, DirectEventArgs e)
    {
    ((Ext.Net.Button)sender).Disabled = true;
    CheckboxGroup1.Items.Add(new Checkbox { BoxLabel = "Checkbox 4", Checked = true });
    CheckboxGroup1.Render(CheckboxGroup1.ContainerID, RenderMode.RenderTo);
    }
     
    protected void AddAnotherCheckboxClick(object sender, DirectEventArgs e)
    {
    ((Ext.Net.Button)sender).Disabled = true;
    // we have to recreate any previous dynamic added checkboxes
    CheckboxGroup1.Items.Add(new Checkbox { BoxLabel = "Checkbox 4", Checked = true });
    CheckboxGroup1.Items.Add(new Checkbox { BoxLabel = "Checkbox 5", Checked = true });
    CheckboxGroup1.Render(CheckboxGroup1.ContainerID, RenderMode.RenderTo);
    }
    </script>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    <head runat="server">
    <title>Ext.NET Example</title>
    </head>
    <body>
    <form runat="server">
    <ext:ResourceManager runat="server" />
    <ext:CheckboxGroup
    ID="CheckboxGroup1"
    runat="server"
    ColumnsNumber="1">
    <Items>
    <ext:Checkbox runat="server" BoxLabel="Checkbox 1" />
    <ext:Checkbox runat="server" BoxLabel="Checkbox 2" />
    <ext:Checkbox runat="server" BoxLabel="Checkbox 3" />
    </Items>
    </ext:CheckboxGroup>
    <ext:Button
    runat="server"
    Text="Add checkbox"
    OnDirectClick="AddCheckboxClick" />
    <ext:Button
    runat="server"
    Text="Add another checkbox"
    OnDirectClick="AddAnotherCheckboxClick" />
    </form>
    </body>
    </html>
     
     
    十一:后台创建Window以及设定其属性
     
    protected void Page_Load(object sender, EventArgs e)
    
    
    {
    CreateControl.CreateWindow("winCharacter", "角色选择", "../CommonWindow/CharacterSelection.aspx").Render(this.Form);
    }

            public static Window CreateWindow(string wId, string wTitle, string wUrl)
            {
                var win = new Window
                {
                    ID = wId,
                    Title = wTitle,
                    Width = 530,
                    Height = 410,
                    Hidden = true,
                    X = 50,
                    Y = 130
                };
                win.AutoLoad.Url = wUrl;
                win.AutoLoad.Mode = LoadMode.IFrame;
                return win;
            }
     
    十二:子窗口给父窗口控件赋值
     

    子窗口给父窗口控件赋值:parent.父窗口控件ID.setValue(value)。

    但是如果你的控件ID是通过后台代码组合而成,出来的控件ID可能就是一串字符串,此时要注意了:要使用parent.eval()方法把相关字符串转换成Ext对象。例如

    control=“txtUserName”;

    parent.eval(control).setValue(value);

    十三:CheckboxGroup 勾选、全选、反选和限制勾选

    <script type="text/javascript" defer="defer">

        ConstraintChkedNum = 3; // 自定义限制勾选的数量

        chkedId = [];

        var checkWeek = {

            SelectedAll: function(chkGrp) {

                var idx;

                var cbAll = Ext.getCmp(chkGrp.items.items[chkGrp.items.length - 2].id);

                for (idx = 0; idx < chkGrp.items.length - 1; idx++) {

                    var cb = Ext.getCmp(chkGrp.items.items[idx].id);

                    cb.setValue(cbAll.checked);

                }

            },

            Unselected: function(chkGrp) {

                var idx;

                for (idx = 0; idx < chkGrp.items.length - 2; idx++) {

                    var cb = Ext.getCmp(chkGrp.items.items[idx].id);

                    cb.setValue(!cb.checked);

                }

            },

            SelectedConstraint: function(chk) {

                if (chkedId.length >= ConstraintChkedNum) {

                    if (chkedId.join(',').match(chk.id) && !chk.checked) {

                        chkedId.remove(chk.id)

                    }

                    else {

                        alert('最多勾选 ' + ConstraintChkedNum + ' 项.');

                        chk.suspendEvents();

                        chk.setValue(false);

                        chk.resumeEvents();

                    }

                }

                else {

                    if (chk.checked) chkedId.push(chk.id);

                    else chkedId.remove(chk.id);

                }

            }

        }

    </script>

    HTML文档
    <h1>
          勾选全选反选</h1>
      <ext:CheckboxGroup ID="Weeks" runat="server" Width="500" Height="50">
          <Items>
              <ext:Checkbox ID="Checkbox1" runat="server" Name="Checkbox1" BoxLabel="周一" />
              <ext:Checkbox ID="Checkbox2" runat="server" Name="Checkbox1" BoxLabel="周二" />
              <ext:Checkbox ID="Checkbox3" runat="server" Name="Checkbox1" BoxLabel="周三" />
              <ext:Checkbox ID="Checkbox4" runat="server" Name="Checkbox1" BoxLabel="周四" />
              <ext:Checkbox ID="Checkbox5" runat="server" Name="Checkbox1" BoxLabel="周五" />
              <ext:Checkbox ID="Checkbox6" runat="server" Name="Checkbox1" BoxLabel="周六" />
              <ext:Checkbox ID="Checkbox7" runat="server" Name="Checkbox1" BoxLabel="周日" />
              <ext:Checkbox ID="Checkbox8" runat="server" Name="Checkbox1" BoxLabel="全选">
                  <Listeners>
                      <Check Handler="checkWeek.SelectedAll(#{Weeks})" />
                  </Listeners>
              </ext:Checkbox>
              <ext:Checkbox ID="Checkbox9" runat="server" Name="Checkbox1" BoxLabel="反选">
                  <Listeners>
                      <Check Handler="checkWeek.Unselected(#{Weeks})" />
                  </Listeners>
              </ext:Checkbox>
          </Items>
      </ext:CheckboxGroup>
      <h1>
          限制勾选</h1>
      <ext:CheckboxGroup ID="WeeksConstr" runat="server" Width="500" Height="200">
          <Items>
              <ext:Checkbox ID="Checkbox10" runat="server" Name="Checkbox1" BoxLabel="周一">
                  <Listeners>
                      <Check Fn="checkWeek.SelectedConstraint" />
                  </Listeners>
              </ext:Checkbox>
              <ext:Checkbox ID="Checkbox11" runat="server" Name="Checkbox1" BoxLabel="周二">
                  <Listeners>
                      <Check Fn="checkWeek.SelectedConstraint" />
                  </Listeners>
              </ext:Checkbox>
              <ext:Checkbox ID="Checkbox12" runat="server" Name="Checkbox1" BoxLabel="周三">
                  <Listeners>
                      <Check Fn="checkWeek.SelectedConstraint" />
                  </Listeners>
              </ext:Checkbox>
              <ext:Checkbox ID="Checkbox13" runat="server" Name="Checkbox1" BoxLabel="周四">
                  <Listeners>
                      <Check Fn="checkWeek.SelectedConstraint" />
                  </Listeners>
              </ext:Checkbox>
              <ext:Checkbox ID="Checkbox14" runat="server" Name="Checkbox1" BoxLabel="周五">
                  <Listeners>
                      <Check Fn="checkWeek.SelectedConstraint" />
                  </Listeners>
              </ext:Checkbox>
              <ext:Checkbox ID="Checkbox15" runat="server" Name="Checkbox1" BoxLabel="周六">
                  <Listeners>
                      <Check Fn="checkWeek.SelectedConstraint" />
                  </Listeners>
              </ext:Checkbox>
              <ext:Checkbox ID="Checkbox16" runat="server" Name="Checkbox1" BoxLabel="周日">
                  <Listeners>
                      <Check Fn="checkWeek.SelectedConstraint" />
                  </Listeners>
              </ext:Checkbox>
          </Items>
      </ext:CheckboxGroup>

    值得注意的是,chk.suspendEvents() 和 chk.resumeEvents() 是挂起和恢复 checkbox 控件的事件。

    十四:ext.net GridPanel 加上悬浮提示

    在ext.net中,常常遇到某一列不够宽,毕竟业务都是变的很快的,所以我们可以在悬浮某一列的时候给其加上tips,这样就算再多的内容也不怕了。

    下面介绍2中加tips的方式:

    1、只想给指定列加tips

    a、c#代码

      <ext:Column ColumnID="INTICKET_PTTI" DataIndex="INTICKET_PTTI" Header="检票口" Width="90"
                        Align="Center" Wrap="true">
                        <Renderer Fn="RenderRow" />
                    </ext:Column>

    b、js代码

    复制代码
     function RenderRow(value, meta, rec, rowIndex, coIndex, ds) {
                if (value != null && value != "") {
                    var tips = "<div ext:qtitle='' ext:qtip='" + value + "'>" + value + "</div>";
                    return tips;
                }
            };
    复制代码

    2、给所有列加上tips

    a、在GridPanel外面加上

    复制代码
     <ext:ToolTip ID="RowTip" runat="server" Target="={GridPanel1.getView().mainBody}"
            Delegate=".x-grid3-cell" TrackMouse="true" AutoWidth="true" AutoHeight="true">
            <Listeners>
                <Show Fn="showTip" />
            </Listeners>
        </ext:ToolTip>
    复制代码

    b、js代码

    复制代码
      var showTip = function () {
                var rowIndex = GridPanel1.view.findRowIndex(this.triggerElement),
                    cellIndex = GridPanel1.view.findCellIndex(this.triggerElement),
                    record = Store1.getAt(rowIndex),
                    fieldName = GridPanel1.getColumnModel().getDataIndex(cellIndex),
                    data = record.get(fieldName);
    
                this.body.dom.innerHTML = data;
            };
    复制代码

    如此这般那般就好了。

    十五:ext.net 日期控件默认赋值

    我们一般进入某个页面的时候,日期时间都已经赋好值了,这样能一目了然当前页面的数据是哪一个时间段内的。ext.net的DateField默认没有赋值的属性,只能通告其他的途径来赋值。

    <ext:DateField runat="server" ID="dfProdDate" FieldLabel="生产日期" LabelWidth="80" Width="200"
    LabelAlign="Right" Format="Y-m-d H:i:s" EmptyText="请选择生产日期" AllowBlank="false">

    Format是日期控件的值的格式

    AllowBlank="false"代表这个控件不能为空,必须输入值

    其他属性碰到一个讲一个

    下面说如何给这个控件默认赋默认值

    直接在body中添加以下代码即可:

    <ext:ResourceManager ID="ScriptManager1" runat="server" Theme="Gray" />
    <%
    dfProdDate.Value = string.Format("{0:yyyy-MM-dd HH:mm:ss}", DateTime.Now);
    %>

    十六:ext.net 控件后加文字

    在ext.net中有控件前加文字采用 FieldLabel="***",如何在后面加文字呢,直接的属性是没有的,只能通过写js。

    <ext:TextField runat="server" ID="txCheckCrycle" FieldLabel="保修周期" Width="200" LabelWidth="80"
    Regex="^(0|([1-9]\d*))(\.\d+)?$" MaxLength="8">
    <Listeners>
    <Render Fn="addText" />
    </Listeners>
    </ext:TextField>

    Regex 是正则验证,我这里验证是否输入的是数字,

    MaxLength最大长度只能是8位

    Listeners 监听事件,主要是用来写js的。

    我这里加了一个 <Render Fn="addText" />

    var addText = function () {
    var _parentNode = Ext.getDom('txCheckCrycle').parentNode;
    Ext.get(_parentNode).createChild(
    {
    tag: 'span',
    html: ' 月'
    }
    );
    }

      这样就在控件的后面加了一个“月”的文字。

    十七:Panel展开刷新  关闭清除

    <ext:Panel ID="pnlExamineList" runat="server" Collapsible="true" Header="true" Icon="UserFemale"
        Border="true" Title="审批历史" Height="200">
        <AutoLoad Url="/FormServerTemplates/ExamineList.aspx" NoCache="true" Mode="IFrame"
            ShowMask="true" />
        <Listeners>
            <Expand Handler="this.reload();" />
            <Collapse Handler="this.clearContent();" />
        </Listeners>
    </ext:Panel>

    十八:页面跳转提示

    X.Redirect("/FormServerTemplates/DownLoad.aspx", "请稍候,下载马上就开始了...");

    十九:其它几个注意的问题

    1.如果对gridpanel要多获取选中记录的操作,操作在服务端,如果采用RowSelectionModel sm = skcs_Grid.SelectionModel.Primary as RowSelectionModel;

    这种形式,请注意,将gridpanel的SelectionMemory设置为"Disabled",否则将会重复提交记录,该开关可以在会回发后保持选中状态

    2.Ext.net TreePanle 如何刷新呢?例如TreePlanle的ID为T1,不是T1.reload(),而是T1.root.reload();

    3.ext:FileUploadField 浏览按钮不显示

    这是bug,解决方案为:添加css

    <style type="text/css">
        .ext-ie .button-fix table.x-btn,
        .ext-gecko .button-fix table.x-btn{
            top:0px;           
        }
        .ext-ie .button-fix .x-form-text,
        .ext-gecko .button-fix .x-form-text{
            margin-top:1px;
        }
    </style>
    <ext:FileUploadField ID="UpFile" runat="server" ButtonText="浏览" AllowBlank="false" EmptyText="请选择文件" Width="200" CtCls="button-fix" Icon="LinkAdd"/>

    4.清空GridPanel的checkbox选中行,GridPanel.getSelectionModel().clearSelections();可以清空选中状态

    5.Ext.net1.1目前暂不支持MVC3.0的Razor引擎模式。

    二十:RadioGroup当选择改变时响应事件

    <%@ Page Language="C#" %>
     
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
     
    <script runat="server">
        protected void RadioGroup_Change(object sender, DirectEventArgs e)
        {
            RadioGroup rg = sender as RadioGroup;
            X.Msg.Alert("Change", rg.CheckedItems[0].ID).Show();
        }
    </script>
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
     
    <head runat="server">
        <title>Ext.NET Example</title>
    </head>
    <body>
        <form runat="server">
            <ext:ResourceManager runat="server" />
            <ext:RadioGroup runat="server" ColumnsNumber="1">
                <Items>
                    <ext:Radio ID="Radio1" runat="server" Checked="true" />
                    <ext:Radio ID="Radio2" runat="server" />
                </Items>
                <DirectEvents>
                    <Change OnEvent="RadioGroup_Change" />
                </DirectEvents>
            </ext:RadioGroup>
        </form>
    </body>
    </html>

    二十一:动态生成控件,无法取得控件的值:

    1、动态生成控件,无法取得控件的值:

    protected void Page_Init(object sender, EventArgs e)
             {
                 ComboBox cmbTest = new ComboBox();
                 cmbTest.ID = "cmbTest";
                 InitBooleanDrop(cmbTest);
                 cmbTest.DirectSelect += new ComponentDirectEvent.DirectEventHandler(cmbTest_DirectSelect);
                 this.Page.Controls.Add(cmbTest);
            }
     
             private void InitBooleanDrop(ComboBox cmb)
             {
                 ListItem item = new ListItem();
                 item.Text = "---请选择---";
                 item.Value = "0";
                 cmb.Items.Add(item);
                 item = new ListItem();
                 item.Text = "Y";
                 item.Value = "1";
                 cmb.Items.Add(item);
                 item = new ListItem();
                 item.Text = "N";
                 item.Value = "2";
                 cmb.Items.Add(item);
                 cmb.SelectedItem.Text = cmb.Items[0].Text;
             }
     
               //不能取得选择的值
            void cmbTest_DirectSelect(object sender, DirectEventArgs e)
             {
                 ComboBox cmb = (ComboBox)sender;
                 X.Msg.Alert(cmb.SelectedItem.Text, cmb.SelectedItem.Value).Show();
             }

    测试了好久,其实问题就出在这句:

    this.Page.Controls.Add(cmbTest);

    将其改为以下这句就好了:

    this.form1.Controls.Add(cmbTest);

    二十二:JS获得GridPanel   选中的IDs值

    <%@ Page Language="C#" %>
     
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!X.IsAjaxRequest)
            {
                Store store = this.GridPanel1.GetStore();
                store.DataSource = new object[]
                {
                    new object[] { "testId1", "test1", "test2" },
                    new object[] { "testId2", "test3", "test4" },
                    new object[] { "testId3", "test5", "test6" },
                };
                store.DataBind();
            }
        }
     
        protected void ShowSelectedIds(object sender, DirectEventArgs e)
        {
            string[] s = JSON.Deserialize<string[]>(e.ExtraParams["selectedIds"]);
            X.Msg.Alert("Count", String.Format("Count: {0}; ids : {1}", s.Length, e.ExtraParams["selectedIds"])).Show();
        }
    </script>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    <head runat="server">
        <title>Ext.Net Example</title>
        <script type="text/javascript">
            var getSelectedIds = function (grid) {
                var selectedIds = grid.selectedIds,
                    arrayOfSelectedIds = [];
                for (var id in selectedIds)
                {
                    arrayOfSelectedIds.push(id);
                }
                return arrayOfSelectedIds;
            };
        </script>
    </head>
    <body>
        <form runat="server">
            <ext:ResourceManager runat="server" />
            <ext:GridPanel ID="GridPanel1" runat="server" AutoHeight="true">
                <Store>
                    <ext:Store runat="server">
                        <Reader>
                            <ext:ArrayReader IDProperty="testId">
                                <Fields>
                                    <ext:RecordField Name="testId" />
                                    <ext:RecordField Name="test1" />
                                    <ext:RecordField Name="test2" />
                                </Fields>
                            </ext:ArrayReader>
                        </Reader>
                    </ext:Store>
                </Store>
                <ColumnModel runat="server">
                    <Columns>
                        <ext:Column Header="TestId" DataIndex="testId" />
                        <ext:Column Header="Test1" DataIndex="test1" />
                        <ext:Column Header="Test2" DataIndex="test2" />
                    </Columns>
                </ColumnModel>
                <SelectionModel>
                    <ext:RowSelectionModel runat="server" />
                </SelectionModel>
                <BottomBar>
                    <ext:PagingToolbar runat="server" PageSize="1" />
                </BottomBar>
            </ext:GridPanel>
            <ext:Button runat="server" Text="Show selected ids">
                <DirectEvents>
                    <Click OnEvent="ShowSelectedIds">
                        <ExtraParams>
                            <ext:Parameter
                                Name="selectedIds"
                                Value="getSelectedIds(GridPanel1)"
                                Mode="Raw"
                                Encode="true" />
                        </ExtraParams>
                    </Click>
                </DirectEvents>
            </ext:Button>
        </form>
    </body>
    </html>
     
    二十三  修改控件的样式
     
    <%@ Page Language="C#" %>
     
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
     
    <!DOCTYPE html>
     
    <html>
    <head runat="server">
        <title>Ext.NET Examples</title>
        <style>
            .ux-btn button {
                font-size: 13px;
                font-weight: bold;
                height: 30px;
                90px;      
                color: #003867;
            }
        </style>
    </head>
    <body>
        <form runat="server">
            <ext:ResourceManager runat="server" Theme="Gray" />
           
            <ext:Button runat="server" Text="MyButton" CtCls="ux-btn"></ext:Button>
        </form>
    </body>
    </html>
     
    二十四 后台新建控件跟事件  此代码为1。0版(修改一下新版也可以用)
     
    <%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
    <head id="Head1" runat="server">
        <title>Test Page</title>
       
        <script runat="server">
            private Coolite.Ext.Web.Label label1;
            private CheckboxGroup group;
           
            protected void Page_Init(object sender, EventArgs e)
            {
                group = new CheckboxGroup();
                group.Width = Unit.Pixel(600);
                group.Height = Unit.Pixel(200);
               
                this.Form.Controls.Add(group);
               
                group.Items.Add(new Checkbox(true, "Item1"));
                group.Items.Add(new Checkbox(true, "Item2"));
                group.Items.Add(new Checkbox(false, "Item3"));
                group.Items.Add(new Checkbox(true, "Item4"));
                group.Items.Add(new Checkbox(false, "Item5"));
               
                Coolite.Ext.Web.Button b = new Coolite.Ext.Web.Button();
                b.Text = "Submit";
                b.AjaxEvents.Click.Event += Click_Event;
                this.Form.Controls.Add(b);
               
                label1 = new Coolite.Ext.Web.Label();
                this.Form.Controls.Add(label1);
            }
     
            void Click_Event(object sender, AjaxEventArgs e)
            {
                StringBuilder sb = new StringBuilder();
                foreach (Checkbox checkbox in group.Items)
                {
                    sb.AppendFormat("<p>{0} - {1}</p>", checkbox.BoxLabel, checkbox.Checked);
                }
     
                label1.Html = sb.ToString();
            }
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
            <ext:ScriptManager ID="SM1" runat="server" />
        </form>
    </body>
    </html>
  • 相关阅读:
    Docker 使用笔记 (一)
    oracle 截取字符(substr),检索字符位置(instr)
    oracle表空间配额(quota)与UNLIMITED TABLESPACE系统权限
    把大象放到eclipse分几步?
    hadoop -- 搭建集群小工具
    1. Mybatis简单操作
    SpringMVC --- 拦截器 HandlerInterceptor
    Spring MVC --- 异步请求
    Spring MVC--RequestMapping
    Spring MVC 异常控制
  • 原文地址:https://www.cnblogs.com/wujy/p/3117996.html
Copyright © 2020-2023  润新知