隐藏控件的加载时初始化

时间:2010-07-09 19:59:09

标签: asp.net

我们的Web应用程序最初是一个很棒的“ASP.NET AJAX”页面,其上有大量的控件。他们都共享了一小组大的.js和.css文件。我需要在我们网站周围的其他不相关页面中使用其中一些控件。当我尝试在其他地方使用这些控件时,难度在于.css和.js文件带来的所有其他东西 - 太多而且有很多膨胀,太少而且控件不起作用。

所以,我一直在尝试分解.css和.js并编写控件来注册他们需要的.js和.css。最初我会得到更多但更小的.js和.css文件,但我可以在运行时将它们组合起来。我只想封装这些控件,以便使用它们的页面更​​少知道使用它们需要什么。

但我遇到了一个问题。我正在使用OnInit或OnLoad根据需要注册.css和.js。不幸的是,如果在所有.css和.js需要进入客户端时第一次点击页面时控件不可见,则不会调用这些方法。直到稍后才对其特定功能启用控件,它们是可见的,并且可以发出.js或.css。那太晚了!

我是否必须咬紧牙关并在我使用这些控件的页面上包含正确的.css / .js,或者是否有更好的方法来“清点”使用中的控件以使它们发出什么他们需要吗?

2 个答案:

答案 0 :(得分:1)

您可以将js和css文件包含在您正在使用的控件的渲染中。基本上将它们添加到控件生成的html的第一行。我知道你应该能够在html的任何地方放入js文件的include,尽管我还没有尝试用css文件。

如果可行,您可能需要输入一些逻辑,以确保如果您有多个控件,则只包含一次文件。这在javascript级别上应该不会太难。

我有兴趣看看你的工作是什么,因为我一直在寻找类似于我现在工作的地方。

答案 1 :(得分:1)

我认为您遇到的问题是某些控件是动态加载的(即在更新面板中)。这是一个棘手的问题 - 通常是因为您事先并不知道您需要什么样的控件,因此需要包含哪些JS + CSS。

也许你应该考虑使用脚本加载器动态加载JS和CSS? YUI脚本加载器和新的MS令人想起(但我相信还有其他几十个同样好的那些)。

有关一些可能有用的链接,请参阅this上一个答案。另请参阅here以获取有关MS脚本加载器和YUI scriptloader的更多信息。

因为你已经在使用MS的东西我会推荐使用MS脚本加载器,但是就我所知而言,MS脚本加载器不支持管理动态加载的CSS(如果有人知道不同,请纠正我)所以也许YUI解决方案可能更合适(或者你可以自己动手添加CSS,如果还没有添加它 - 它应该不会太难)。

使用脚本加载器消除了预先确定需要包含的内容的麻烦,但可能需要对您的javascript进行一些更改。特别是,如果你的控件标记中有任何javascript内联,它依赖于你动态添加的javascript中声明的函数。

E.g。如果你当前有像这样的用户控制标记

  <div id="my control">
    <script type="text/javascript>
      foo(); // foo is defined in foo.js, which is included in a script element in the head
      ... more script ...
    </script>
    ....
  </div>

然后使用脚本加载器,您必须将其更改为如下所示

  <div id="my control">

    <script type="text/javascript>
      var onLoadHandler = function() {
        foo();
        ... more script ...
      };
      Sys.loader.registerScript("foo_package_name", null, onLoadHandler); 
    </script>
  </div>