Team WebAccess的CustomControl - > jQuery不起作用

时间:2011-01-16 09:29:43

标签: asp.net jquery

我最近遇到了类似的问题。 我正在为Team WebAccess 2010开发一个自定义控件:浏览器的MultiValueControl。获得与witcontrolsuite的MultiValueControl完全相同的体验。 (http://witcustomcontrols.codeplex.com/wikipage?title=Multivalue%20control&referringTitle=Home)

因此我使用带有列表框的asp.net服务器控件(呈现为html)以及以下jquery drowdownchecklist(http://code.google.com/p/dropdown-check-list/)

servercontrol如下所示

   using System.Linq;
    using System.Text;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;

    namespace CodePlex.WitCustomControls.WebAccess.MultiValueControl
    {
        [DefaultProperty("Text")]
        [ToolboxData("<{0}:MultiValueControl runat=server></{0}:MultiValueControl>")]
        public class MultiValueControl : WebControl
        {
            public ListBox MyListBox { get; set; }

            protected override void CreateChildControls()
            {
                base.CreateChildControls();

                MyListBox = new ListBox();
                MyListBox.SelectionMode = ListSelectionMode.Multiple;
                MyListBox.Items.Add(new ListItem("abcd 1"));
                MyListBox.Items.Add(new ListItem("abcd 2"));
                MyListBox.Items.Add(new ListItem("abcd 3"));
                MyListBox.Items.Add(new ListItem("abcd 4"));
                MyListBox.Items.Add(new ListItem("abcd 5"));

                this.Controls.Clear();
                this.Controls.Add(MyListBox);
            }

            [Bindable(true)]
            [Category("Appearance")]
            [DefaultValue("")]
            [Localizable(true)]
            public string Text
            {
                get
                {
                    String s = (String)ViewState["Text"];
                    return ((s == null) ? String.Empty : s);
                }

                set
                {
                    ViewState["Text"] = value;
                }
            }

   protected override void OnPreRender(EventArgs e)
            {
                base.OnPreRender(e);

                string resourceName1 = "WebApplication1.embedded.jquery-1.4.2.min.js";
                string resourceName2 = "WebApplication1.embedded.jquery-ui-1.8.4.custom.min.js";
                string resourceName3 = "WebApplication1.embedded.ui.dropdownchecklist.js";

                ClientScriptManager cs = this.Page.ClientScript;
                var t = typeof(MultiValueControl);

                cs.RegisterClientScriptResource(t, resourceName1);
                cs.RegisterClientScriptResource(t, resourceName2);
                cs.RegisterClientScriptResource(t, resourceName3);

                string csslink = "<link href='"
                    + Page.ClientScript.GetWebResourceUrl(t, "WebApplication1.embedded.ui.dropdownchecklist.standalone.css")
                    + "' rel='stylesheet' type='text/css' />";
                var include = new LiteralControl(csslink);
                this.Page.Header.Controls.Add(include);

                string csslink2 = "<link href='"
                    + Page.ClientScript.GetWebResourceUrl(t, "WebApplication1.embedded.ui.dropdownchecklist.themeroller.css")
                    + "' rel='stylesheet' type='text/css' />";
                var include2 = new LiteralControl(csslink2);
                this.Page.Header.Controls.Add(include);

                var csType = typeof(MultiValueControl);
                var csName = "MultiValueControl" + MyListBox.ClientID;
                // Check to see if the client script is already registered.
                if (!cs.IsClientScriptBlockRegistered(csType, csName))
                {
                    StringBuilder csText = new StringBuilder();
                    csText.Append("<script type=\"text/javascript\">");
                    //we need to write the code the following way
                    csText.Append("(function($) { $(document).ready(function() {$(\"#" + this.MyListBox.ClientID + "\").dropdownchecklist();}); })(jQuery);");
                    //does not work as $ sign is not associated with jQuery in Team WebAccess!
                    //csText.Append(" $(document).ready(function() {$(\"#" + this.MyListBox.ClientID + "\").dropdownchecklist();});");
                    csText.Append("</script>");
                    cs.RegisterClientScriptBlock(csType, csName, csText.ToString());

                }
            }
        }
    }

如您所见,我将脚本(嵌入在控件程序集中)注入预渲染步骤中的输出页面。

当我在我的本地计算机上的asp.net应用程序上运行所有这些时(我创建它来构建我的解决方案的原型)它完美地运行...

然而,该控件不适用于Team WebAccess 2010,因为我收到错误消息'jQuery'未定义

然而,当我查看我的页面时,我可以肯定地看到,我注入的三个脚本只是在抛出错误的脚本之前完全添加:

    <script src="/tfs/web/WebResource.axd?d=yGr4pF28N1gYPBSvcQ65PxwkQdtFV1bc0SJjY2M7nTK9BloSmvQxu8btRw7YDdXsjbAwSZPJBiIDI-3FSC7yFCXHjuvhkhaTAlTv2uOnOhR_y_2fLK1ahIdVYiXjEjDT2ZEI9_ozHhoJqICZykZo_rBCIDp5h7Y8v6-zWJJDJoqIIHI47YpQDhsE4-_UcYV6b6G-Cgr8MWH9AEP7CtK7Ie6wWCU1&amp;t=634306043180265615" type="text/javascript"></script>
        <script src="/tfs/web/WebResource.axd?d=9iAfN71_Hpv7igrtbh4h9pBAMBHXqUC1cX5cjkAEr1PglPvi4Uo5KLOC6tuHzMyGkpHEeBXbVeIX_NGIiKlHPSNlOjw75DksE2F-2NMVlIXoEB4uVTvyTwvt1TM3S2AGLY13hLPmM-SW12g3ZGU28PC23Vx_aYAFWSco6hgPTcCBOPuw4nSNSI72kgVuMwBjhzjxVbbzhdGLxrSAodBH5g7PATsuAN7CHE8vmi_pk9f8mW-50&amp;t=634306043180265615" type="text/javascript"></script>
        <script src="/tfs/web/WebResource.axd?d=c_BidQPb2wjtuw09st9ilCtRhA4VEjgNgJgr0VlFIRdKYP2UK1AqWS8Mo3AEiDU_MMCZkwjMVa1tTKg9UlpFoCqxCzKUhCK7Moou4ywZ74S0FJvdrcJ1cGbqtZnxrfUBLbN8_iahrG2A9Fq55up3o6R2_SlFU4d_gb_4fBXnticOG8Bl4JCbq7F2PnG-rw0fTiNwGDMwZFv1RvNJerUGYo_0Wuw1&amp;t=634306043180265615" type="text/javascript"></script>
        <script type="text/javascript">(function($) { $(document).ready(function() {$("#ctl00_c_we_ctl47_ctl00").dropdownchecklist();}); })(jQuery);</Script>

    The following is the source of the page (up to my injected scripts) that does not work. (of course I dummied the fqdn name of the server ;-))



    <html xmlns="http://www.w3.org/1999/xhtml">
<head><title>
    New Change Request: - Team Web Access
</title>
    <base target="_self" />

<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['aspnetForm'];
if (!theForm) {
    theForm = document.aspnetForm;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
//]]>
</script>
<script src="/tfs/web/WebResource.axd?d=fLgM8VwLkwzQwVHlt0I3zfY4k-15sHec44H9BY54wjS_v_rJDRkLrbhLIvED-zHvir1koHstEWBv_Erm3BGVmScM6OA1&amp;t=634210436612724343" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[var JSConfig ={"showBrowserToolbar":true};//]]></script>
<script src="/tfs/web/Resources/Scripts/WindowHelpers.js" type="text/javascript"></script>
<script src="/tfs/web/Resources/Scripts/DocumentService.js" type="text/javascript"></script>
<script src="/tfs/web/ScriptResource.axd?d=DUMMYVALUE"></script>
<script type="text/javascript">
//<![CDATA[
$jslimg("imga8521f38",["/tfs/web/App_Themes/Default/Images/h-progress.gif","/tfs/web/App_Themes/Default/Images/spinner.gif","/tfs/web/App_Themes/Default/Images/tmih.gif"]);//]]>
</script>
<script src="/tfs/web/Resources/Scripts/WindowToolbar.js" type="text/javascript"></script>
<script src="/tfs/web/Resources/Scripts/SearchHelper.js" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
$new(windowToolbar,"ctl00_wtb",["ctl00$wtb",{"pguid":"e591d5c5-c3bd-4431-81cc-62b4fc5a6b81"}]);
//]]>
</script>
<script src="/tfs/web/Resources/Scripts/EditWorkItem.js" type="text/javascript"></script>

....

<script type="text/javascript">
//<![CDATA[
$jsreg("cd326c372",{"changeCallbackEventName":"FieldChanged","numberFormat":"None"});
$jsreg("c384acf1b",{"dropCount":8,"minDropPanelWidth":0,"maxDropPanelWidth":0,"notAllowedBGColor":"#FFFFCC","allowedBGColor":"","textBoxClass":"tswa-text-box","textBoxDisabledClass":"tswa-text-box-disabled","dropPanelClass":"tswa-font tswa-dropdowncanvas","listItemClass":"tswa-listitem","listItemHoverClass":"tswa-listitemhover","listItemSelectedClass":"tswa-listitemselected","listItemDisabledClass":"tswa-listitemdisabled","decimalChar":","});
$jsreg("c569d08c7",[]);
$new(editableDropDown,"ctl00_c_we_ctl04_wc_val",[5,cd326c372,null,c384acf1b,null,c569d08c7,c569d08c7,c569d08c7,null,"",null,""]);
//]]>
</script>
<script src="/tfs/web/WebResource.axd?d=yGr4pF28N1gYPBSvcQ65PxwkQdtFV1bc0SJjY2M7nTK9BloSmvQxu8btRw7YDdXsjbAwSZPJBiIDI-3FSC7yFCXHjuvhkhaTAlTv2uOnOhR_y_2fLK1ahIdVYiXjEjDT2ZEI9_ozHhoJqICZykZo_rBCIDp5h7Y8v6-zWJJDJoqIIHI47YpQDhsE4-_UcYV6b6G-Cgr8MWH9AEP7CtK7Ie6wWCU1&amp;t=634306043180265615" type="text/javascript"></script>
<script src="/tfs/web/WebResource.axd?d=9iAfN71_Hpv7igrtbh4h9pBAMBHXqUC1cX5cjkAEr1PglPvi4Uo5KLOC6tuHzMyGkpHEeBXbVeIX_NGIiKlHPSNlOjw75DksE2F-2NMVlIXoEB4uVTvyTwvt1TM3S2AGLY13hLPmM-SW12g3ZGU28PC23Vx_aYAFWSco6hgPTcCBOPuw4nSNSI72kgVuMwBjhzjxVbbzhdGLxrSAodBH5g7PATsuAN7CHE8vmi_pk9f8mW-50&amp;t=634306043180265615" type="text/javascript"></script>
<script src="/tfs/web/WebResource.axd?d=c_BidQPb2wjtuw09st9ilCtRhA4VEjgNgJgr0VlFIRdKYP2UK1AqWS8Mo3AEiDU_MMCZkwjMVa1tTKg9UlpFoCqxCzKUhCK7Moou4ywZ74S0FJvdrcJ1cGbqtZnxrfUBLbN8_iahrG2A9Fq55up3o6R2_SlFU4d_gb_4fBXnticOG8Bl4JCbq7F2PnG-rw0fTiNwGDMwZFv1RvNJerUGYo_0Wuw1&amp;t=634306043180265615" type="text/javascript"></script><script type="text/javascript">(function($) { $(document).ready(function() {$("#ctl00_c_we_ctl49_ctl00").dropdownchecklist();}); })(jQuery);</script>
<script type="text/javascript">(function($) { $(document).ready(function() {$("#ctl00_c_we_ctl52_ctl00").dropdownchecklist();}); })(jQuery);</script>

我没有更多线索我能做什么! 请帮助!!

2 个答案:

答案 0 :(得分:1)

尝试将脚本注册放在页面init()中。这对我有用。

答案 1 :(得分:0)

好的...因为似乎没有人能够帮助我,我终于可以自己解决问题了。但是我不确定这是否是一种清醒的方法。好吧至少它有效,对吧? :)

我所做的是改变“prerender”逻辑,不将jQuery库注册为Web资源,而是像我自己的客户端脚本一样编写它们。

很难解释 - 所以只需看看代码。

base.OnPreRender(e);

        // jquery control only works together with listbox
        if (!(this.CheckboxList is ListBox))
            return;

        string resourceName1 = "CodePlex.WitCustomControls.WebAccess.embedded.jquery-1.4.2.min.js";
        string resourceName2 = "CodePlex.WitCustomControls.WebAccess.embedded.jquery-ui-1.8.4.custom.min.js";
        string resourceName3 = "CodePlex.WitCustomControls.WebAccess.embedded.ui.dropdownchecklist.js";

        ClientScriptManager cs = this.Page.ClientScript;
        var t = typeof(MultiValueControl);

        WriteEmbeddedScript(cs, resourceName1, t);
        WriteEmbeddedScript(cs, resourceName2, t);
        WriteEmbeddedScript(cs, resourceName3, t);             
        //cs.RegisterClientScriptResource(t, resourceName1);
        //cs.RegisterClientScriptResource(t, resourceName2);
        //cs.RegisterClientScriptResource(t, resourceName3);

        string csslink = "<link href='"
            + Page.ClientScript.GetWebResourceUrl(t, "CodePlex.WitCustomControls.WebAccess.embedded.ui.dropdownchecklist.standalone.css")
            + "' rel='stylesheet' type='text/css' />";
        var include = new LiteralControl(csslink);
        this.Page.Header.Controls.Add(include);

        string csslink2 = "<link href='"
            + Page.ClientScript.GetWebResourceUrl(t, "CodePlex.WitCustomControls.WebAccess.embedded.ui.dropdownchecklist.themeroller.css")
            + "' rel='stylesheet' type='text/css' />";
        var include2 = new LiteralControl(csslink2);
        this.Page.Header.Controls.Add(include);

        var csType = typeof(MultiValueControl);
        var csName = "MultiValueControl" + CheckboxList.ClientID; // we need to add a script for each separate MultiValueControl on a page

        var script = "(function($) { $(document).ready(function() {$(\"#" + this.CheckboxList.ClientID + "\").dropdownchecklist();}); })(jQuery);";
        WriteScript(cs, script, csType, csName);
    }

    private static void WriteEmbeddedScript(ClientScriptManager cs, string resourceName1, Type t)
    {
        using (var reader = new StreamReader(Assembly.GetAssembly(t).GetManifestResourceStream(resourceName1)))
        {
            var script = reader.ReadToEnd();
            WriteScript(cs, script, t, resourceName1);
        }
    }

    private static void WriteScript(ClientScriptManager cs, string script, Type csType, string csName)
    {
        // Check to see if the client script is already registered.
        if (!cs.IsClientScriptBlockRegistered(csType, csName))
        {
            StringBuilder csText = new StringBuilder();
            csText.Append("<script type=\"text/javascript\">");
            //we need to write the code the following way
            csText.Append(script);
            //does not work as $ sign is not associated with jQuery in Team WebAccess!
            //csText.Append("$(document).ready(function() {$(\"#" + this.CheckboxList.ClientID + "\").dropdownchecklist();});");
            csText.Append("</script>");
            cs.RegisterClientScriptBlock(csType, csName, csText.ToString());

        }
    }