将javascript函数与ext.net控件一起使用

Question

我用JavaScript编写了此函数

function CheckBeforeAddNew(btnId, gridSelected) {
$(btnId).click(function () {
      for (var i in gridSelected) {
        return true;
      };
      Ext.Msg.alert('Add', 'Can not do without selected item');
      {
        return false;
      };
    });
};

当我试图使此功能到达按钮时，单击如下所示：

<ext:Button runat="server" ID="btnAddNewToMme" Cls="topButton" Text="Add new" Icon="Add" OnDirectClick="btnAddNewToMme_OnDirectClick">
                    <DirectEvents>
                        <Click Before="CheckBeforeAddNew('#<%= btnAddNewToMme.ClientID%>','<%=dlOuterObject.Grid_ClientID %>.selectedIds')"></Click>
                    </DirectEvents>
                </ext:Button>

我收到错误ReferenceError: $ is not defined $(btnId).click(function () {

如何调用此功能以使其正常工作？

编辑：当然，我将具有此功能的文件添加到我的.aspx

<script type="text/javascript" src="Scripts/Synchronization.js"></script>

Edit1：在萤火虫中，我可以看到其他任何东西

<script type="text/javascript" src="Scripts/jquery-1.4.1.min.js"></script>以便正确加载jQuery

Edit2：我对@geoffrey提供的功能进行了更改：

var CheckBeforeAddNew = function (gridSelected) {
for (var i in gridSelected) {
    return true;
}
Ext.Msg.alert('Error', 'Something wrong!');
return false;

};

但是使用它

<ext:Button runat="server" ID="btnAddNewToMme" Cls="topButton" Text="Add new" Icon="Add" OnDirectClick="btnAddNewToMme_OnDirectClick">
                <DirectEvents>
                    <Click Before="return CheckBeforeAddNew('<%= dlOuterObject.Grid_ClientID %>.selectedIds');"></Click>
                </DirectEvents>
            </ext:Button>

我无法完成这项工作：

if (grid.getSelectionModel().getCount() < 1) {
   Ext.Msg.alert('Error', 'Please select an Item');

   return false;
}

我的dlOuterObject是包含网格的UserControl 。 那么有什么想法如何使其起作用？

谢谢你的帮助：）

Answer 1

您的原始代码示例存在一些问题。

此<%= btnAddNewToMme.ClientID%>语法在ASP.NET标记配置中不起作用。 您将需要使用<%# %> DataBinding语法。

您的CheckBeforeAddNew JavaScript函数不使用btnId ，因此您不需要传递此值。

您也不需要使用任何jQuery。 所有必需的功能都包含在ExtJS框架中，该框架已经包含在您的Page 。

只需将GridPanel的实例传递到JavaScript函数中，然后封装用于获取/检查函数中Selected Item计数的逻辑即可。

这是一个功能齐全的示例，演示了使用Ext.NET 2.0的情况。 如果您使用的是v1.x，则代码.Before处理程序基本上是相同的，只是GridPanel Model配置会略有不同。

例

<%@ 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)
        {
            var store = this.GridPanel1.GetStore();

            store.DataSource = this.Data;
            store.DataBind();
        }
    }

    private object[] Data
    {
        get
        {
            return new object[]
            {
                new object[] { "3m Co" },
                new object[] { "Alcoa Inc" },
                new object[] { "Altria Group Inc" },
                new object[] { "American Express Company" },
                new object[] { "American International Group, Inc." },
                new object[] { "AT&T Inc." },
                new object[] { "Boeing Co." },
                new object[] { "Caterpillar Inc." },
                new object[] { "Citigroup, Inc." },
                new object[] { "E.I. du Pont de Nemours and Company" },
                new object[] { "Exxon Mobil Corp" },
                new object[] { "General Electric Company" }
            };
        }
    }

    protected void Button1_Click(object sender, DirectEventArgs e)
    {
        X.Msg.Notify("Message", "Button1 Clicked").Show();
    }
</script>

<!DOCTYPE html>

<html>
<head runat="server">
    <title>Simple Array Grid - Ext.NET Examples</title>

    <script type="text/javascript">
        var checkSelected = function (grid) {
            if (grid.getSelectionModel().getCount() < 1) {
                Ext.Msg.alert('Error', 'Please select an Item');

                return false;
            }

            return true;
        };
    </script>
</head>
<body>
    <ext:ResourceManager runat="server" />

    <ext:GridPanel 
        ID="GridPanel1"
        runat="server" 
        Title="Example" 
        Width="600" 
        Height="350">
        <Store>
            <ext:Store runat="server">
                <Model>
                    <ext:Model runat="server">
                        <Fields>
                            <ext:ModelField Name="company" />
                        </Fields>
                    </ext:Model>
                </Model>
            </ext:Store>
        </Store>
        <ColumnModel>
            <Columns>
                <ext:Column runat="server" Text="Company" DataIndex="company" Flex="1" />
            </Columns>            
        </ColumnModel>       
        <SelectionModel>
            <ext:RowSelectionModel runat="server" Mode="Multi" />
        </SelectionModel>
        <Buttons>
            <ext:Button runat="server" Text="Submit" Icon="Accept">
                <DirectEvents>
                    <Click OnEvent="Button1_Click" Before="return checkSelected(App.GridPanel1);" />
                </DirectEvents>
            </ext:Button>
        </Buttons>
    </ext:GridPanel>
</body>
</html>

希望这可以帮助。

将javascript函数与ext.net控件一起使用

问题描述

1 个解决方案

解决方案1
1 已采纳 2012-08-30 16:41:32

将javascript函数与ext.net控件一起使用

问题描述

1 个解决方案

解决方案1 1 已采纳 2012-08-30 16:41:32

解决方案1
1 已采纳 2012-08-30 16:41:32