0

ボタン付きのカスタム コントロールがあります。コントロールにいくつかのイベントをアタッチしようとする外部 JavaScript ファイルがあります。onclick イベントと同様に、実行時にボタンに追加されます。そうするために私は使用します

var save = document.getElementById("btnExecute");

このコントロールは、JS ファイルを添付した aspx ページから呼び出されています。ページが機能しません。コードを次のように変更すると機能するという記事を読みました

var save = document.getElementById("<%= btnExecute.ClientID %>");

ただし、JS が aspx ファイル内にある場合にのみ機能します。カスタム コントロールでこれを機能させる方法。外部 JS で ID を取得するには、どのような手順を踏む必要がありますか?

Ajax81 のソリューションを試してみました: コードが追加されました

namespace MyCompositeControl
{
    public class MyGrid : CompositeControl
    {
        public string ButtonClientID
        {
            get { return btnExecute.ClientID; }
            set { }
        }

        protected override void CreateChildControls()
        {
            #region Execute Button
            btnExecute.ID = "btnExecute";
            btnExecute.Text = "Execute"; 
            btnExecute.Click += new EventHandler(_button_Click);
            Controls.Add(btnExecute);
            #endregion
    }
        protected override void OnPreRender(EventArgs e)
        {
            base.OnPreRender(e);
            string jsResourceName = "MyCompositeControl.Scripts.ControlScriptLibrary.js";
            ClientScriptManager cs = this.Page.ClientScript;
            cs.RegisterClientScriptResource(typeof(this,GetType()), jsResourceName);
        }
}

上記のコードでわかるように、ボタンは動的に追加されます。

ControlScriptLibrary.js

  function attachEvents()
   {   
       //var save = document.getElementById("btnExecute");
       var save = document.getElementById("<%=MyGrid.ButtonClientID%>");
       if(save!=null)
       { 
        save.onclick = onSaveAction;
       }
   }

編集: それでも null を返します。JS が最初に実行され、コントロールがまだ存在しない可能性がありますか? しかし、これは、次のようにコントロール ID を渡すと機能します。

function MyController(executeButtonID, onSaveEventHandler)
{
    function attachEvents()
    {   
        //var save = document.getElementById("btnExecute");
        var save = document.getElementById(executeButtonID);
        if(save!=null)
        { 
            save.onclick = onSaveAction;
        }
    }
}

コントロールの RenderContent メソッドには、次の JavaScript コードがあります。

var myController = new MyController(this.btnExecute.ClientID, onSaveEventHandler);

コントロールにさらにボタンがあり、JS でイベント処理が必要な場合、このアプローチは強制終了します。Ajax81 のソリューションは素晴らしいですが、まだうまくいきません。

4

2 に答える 2

0

.NET では、コントロールがフォームにネストされている場合、コントロールの名前は親の名前も引き継ぎます。たとえば、「ComboBox1」という名前のオブジェクトは、HTML が出力されるまでに「ctl00_content_ctl00_ComboBox1」のようになる場合があります。ブラウザの実行時に ID でボタンを参照する必要がある場合は、生成された HTML コードを調べて、ボタンの最終的な名前を確認し、それを JS で使用できます。ただし、ボタンの親オブジェクトの名前が変更されると、ボタンの名前が変更される可能性があることに注意してください。そのため、特にページにこれらのコントロールが多数ある場合、これは優れたソリューションではありません。

jQuery や Prototype などの JavaScript フレームワークには、DOM 内のオブジェクトをより簡単に見つけてイベントを添付するためのツールを提供するものがあります。

于 2011-02-15T16:09:25.563 に答える
0

JavaScript で対処する必要があるボタンのクライアント ID を返すカスタム コントロールのプロパティを作成します。

コードは次のようになります。

カスタム コントロールのコード ビハインド内:

public string SaveButtonID
{
   get { return SaveButton.ClientID }
   set {/*nothing*/;}
}

JavaScript で

var save = document.getElementById('<%=MyCustomControl.SaveButtonID%>");

編集 javascript のタイプミスを修正しました。

于 2011-02-15T16:37:51.583 に答える