0

我对 ASP.NET 很陌生，对 Javascript 也很陌生。我正在编写一个 ASP.NET 用户控件。我有以下内容：

<head>
<title>Select Asset </title>
<script src="../Scripts/jquery-1.9.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
    function CheckThenCloseActiveToolTip(supplierID) {
        var radGrid = $find('ctl00_MainContent_SelectAssetGrid1_gridAssetList_ctl00');
        var selectedItems = radGrid.get_masterTableView().get_selectedItems()
        if (selectedItems == null || selectedItems.length == 0) return 'You must select an asset first';
        else {
            DoPartialPostBack('selectasset', selectedItems[0]._dataItem.Id);
            CloseActiveToolTip();
        }
    }

    function PopulateRooms(e) {
        var idx = e.selectedIndex;
        if (idx > -1) {
            var dcId = JSON.stringify({ dataCenterId: e.options[idx].value });
            var pageUrl = '/WebService/AVWebService.asmx';

            $.ajax({
                url: pageUrl + '/GetRooms',
                type: 'post',
                contentType: 'application/json; charset=utf-8',
                dataType: 'json',
                data: dcId,
                success: OnRoomsReceived,
                error: OnErrorCall
            });
        }
        else {
            var ddlRooms = document.getElementById('MainContent_SelectAssetGrid1_ddlRooms');
            ddlRooms.disabled = true;
            $('#ddlRooms').empty();
            ddlRooms.options[0] = new Option('', '-1');
            getAssets(0);
        }
    }

    function OnRoomsReceived(result) {
        var ddlRooms = document.getElementById('MainContent_SelectAssetGrid1_ddlRooms');
        if (result.d.length > 0) {
            ddlRooms.disabled = false;
            $('#ddlRooms').empty();
            ddlRooms.options[0] = new Option('', '-1');
            for (var i = 0; i < result.d.length; i++) {
                ddlRooms.options[i + 1] = new Option(result.d[i].Name, result.d[i].Id);
            }
        }

        if (result.d.length = 1)
            ddlRooms.selectedIndex = 1;

        getAssets(0);
    }

    function resetGridData() {
        getAssets(0);
    }

    function getAssets(startAt) {
        var cpId = document.getElementById('hfldCompanyId').value;
        var pageUrl = '/WebService/AVWebService.asmx';
        var tableView = $find('ctl00_MainContent_SelectAssetGrid1_gridAssetList').get_masterTableView();
        var ddldc = document.getElementById('MainContent_SelectAssetGrid1_ddlDataCenter');
        var dcIdx = ddldc.selectedIndex;
        var dcId = '';
        if (dcIdx > -1)
            dcId = ddldc.options[dcIdx].value;

        var ddlrm = document.getElementById('MainContent_SelectAssetGrid1_ddlRooms');
        var rmIdx = ddlrm.selectedIndex;
        var rmId = '';
        if (rmIdx > -1)
            rmId = ddlrm.options[rmIdx].value;

        var ddlStatuses = $find('ctl00_MainContent_SelectAssetGrid1_ddlStatuses';

        var rbgAssetClass = document.getElementById('MainContent_SelectAssetGrid1_rbgAssetClass');
        var ac = 0;
        var rbgInputs = rbgAssetClass.getElementsByTagName('input');
        for (var i = 0; i < rbgInputs.length; i++) {
            if (rbgInputs[i].checked) {
                ac = i;
            }
        }

        var filters = [];
        var fbs = document.getElementsByClassName('rgFilterBox');
        for (var i = 0; i < fbs.length; i++)
            if (fbs[i].value != '')
                filters[filters.length] = { field: fbs[i].alt, value: fbs[i].value };

        var params = JSON.stringify({ companyId: cpId,
            startIndex: startAt,
            maximumRows: tableView.get_pageSize(),
            filterExpressions: filters,
            dataCenterId: ddldc.options[ddldc.selectedIndex].value,
            roomId: rmId,
            Statuses: ddlStatuses._checkedIndices,
            assetClass: ac
        });

        $.ajax({
            url: pageUrl + '/GetSelectAssetData',
            type: 'post',
            contentType: 'application/json; charset=utf-8',
            dataType: 'json',
            data: params,
            success: updateGrid,
            error: OnErrorCall
        });
    }

    function updateGrid(result) {
        var tableView = $find('ctl00_MainContent_SelectAssetGrid1_gridAssetList').get_masterTableView();
        tableView.set_dataSource(result.d.gridData);
        tableView.dataBind();
        tableView.set_virtualItemCount(result.d.count);
    }

    function gridAssetList_Command(sender, args) {
        args.set_cancel(true);

        var pageSize = sender.get_masterTableView().get_pageSize();
        var currentPageIndex = sender.get_masterTableView().get_currentPageIndex();
        if (args.get_commandName() == 'Filter')
            currentPageIndex = 0;

        getAssets(pageSize * currentPageIndex);
    }

    function gridAssetList_Created(sender, args) {
        var fbtns = document.getElementsByClassName('rgFilter');
        for (var i = 0; i < fbtns.length; i++)
            fbtns[i].style.visibility = 'hidden';

        var fbs = document.getElementsByClassName('rgFilterBox');
        for (var i = 0; i < fbs.length; i++)
            fbs[i].onkeypress = applyFilter;
    }

    function applyFilter(args) {
        if (args.keyCode == 13)
            resetGridData();
    }

</script>

这在大多数情况下都有效，但如果我使用 Page.LoadControl() 加载 UserControl，它并不总是正确加载脚本。出于几个原因（可能是糟糕的原因），我想我会将脚本移动到外部文件中。 

<script src="../Scripts/jquery-1.9.1.min.js" type="text/javascript"></script>
<script src="../Scripts/SelectAsset.js" type="text/javascript"></script>

.js 文件中没有额外的代码或设置，只是

function CheckThenCloseActiveToolTip(supplierID) {
    var radGrid = $find('ctl00_MainContent_SelectAssetGrid1_gridAssetList_ctl00');
    var selectedItems = radGrid.get_masterTableView().get_selectedItems()
    if (selectedItems == null || selectedItems.length == 0) return 'You must select an asset first';

...

但现在我得到一个运行时错误，即“function gridAssetList_Command”我们未定义。该函数绑定到页面中网格的 OnCommand 事件。

当我在 Firebug 中检查页面时，它没有在脚本文件列表中列出我的 .js 文件。

我正在将我的脚本加载到 . 我没有改变它们，只是移动了它们。我错过了什么？

更多信息：

将功能添加到控件时，它似乎使用了不同的 ClientId。我得到的错误是动态资源中的以下内容：

Sys.Application.add_init(function() {
$create(Telerik.Web.UI.RadGrid, {"ClientID":"ctl00_MainContent_ctl03_gridAssetList","ClientSettings": ...

我将尝试将引用更改为 getElementByClass()

4

2 回答 2

1

在 asp.net web 表单上添加 javascript 引用的最佳方法是在父元素或父页面（如母版页）上使用 ScriptManager，并在内容页面和用户控件上使用ScriptManagerProxy 。

尝试使用 ScriptManager 或两者结合来解决您的问题。还使用根应用程序别名 (~) 来引用文件 ex。src="~/Scripts/jquery-1.9.1.min.js"

因此，对于简单的方法，将您的脚本引用更改为：

<asp:ScriptManager ID="ScriptManagerProxy1" runat="server">
    <Scripts>
        <asp:ScriptReference Path="~/Scripts/jquery-1.9.1.min.js" />
        <asp:ScriptReference Path="~/Scripts/SelectAsset.js" />
    </Scripts>
</asp:ScriptManager>

更新：

使用例如：

  • $('table[id*="gridAssetList"]')对于 id = 的表ctl00_gridAssetList_xx
  • $('input[id*="inputTxt"]')对于 id = 的输入ctl100_inputTxt
  • ETC

使用 jquery选择器调用由 asp.net 组件呈现的 html 标记。

于 2013-04-19T04:33:25.363 回答
0

嗨史蒂夫我认为它显示错误由于脚本源路径请先检查然后验证脚本加载或不试试下面的代码

if(typeof(yourfunction_name=='function') { // 此代码将确保该函数存在于页面中 //function exits do your functions. }else { alert('Script not loaded'); }
于 2013-04-19T04:43:19.030 回答