アイコン ボタン ユーザー コントロールは、次の一般的な操作用に開発されています。
------------------------
ページは全体の保存機能を実現するために [アイコン + ボタン] または [イメージボタン] を保存しています。保存操作をクリックした後、最初にページの関連フィールドの js 検証を実行でき、検証後にバックグラウンド送信を実行できます。 onmouseover やその他のイベントでのスタイルの変更に応答できます。
開発されたアイコン ボタン ユーザー コントロールは、少なくとも次の機能要件を満たしている必要があります。
------------------------------------------
1. アイコン＋テキストで構成
アイコンのパスは空、つまりアイコンがないように変更できます。
テキスト表示を変更可能
2. システム全体が、ページ上の「アイコン ボタン」に設定された js の onclick イベントに応答して処理する必要があります。
処理する必要がある onclick イベントがない場合、そのイベントは処理されません。
3. サーバーの OnClick イベントに応答して処理する必要がある
処理する必要がある OnClick イベントがない場合、そのイベントは処理されません。
4. 全体的な応答を無効にする必要があります
可視性はコントロール自体に固有のものです
5. onmouseover などのイベントでのスタイルの変更に応答する必要がある
以下にその方法を簡単に説明します
1. [アイコンテキストボタン]ユーザーコントロールを作成します
コントロールには次の部分が含まれています。
テーブルレイアウト制御、
動的に出力される画像のプレースホルダー、
動的に出力されるテキストのプレースホルダー、
OnClick イベントに応答して起動される隠しボタン
<テーブル>
<tr runat="server" id="tr1" style="カーソル:ハンド;" >
<td>
<asp:Literal ID="Literal1" runat="server"></asp:Literal>
</td>
<td>
<asp:Literal ID="Literal2" runat="server"></asp:Literal>
</td>
</tr>
</テーブル>
<asp:Button ID="Button1" runat="server" Text="Button" style="display:none; width:0; height:0;" OnClick="Button1_Click" />
関連する onmouseover スタイルの処理をテーブルに追加できます
次の関連する属性と処理が含まれます
パブリック部分クラス WebUserControl : System.Web.UI.UserControl
{
#region のプロパティとイベント
//アイコンテキストボタンユーザーコントロールのボタンテキスト
string _strButtonText = "ボタンのプレースホルダー";
パブリック文字列 strButtonText
{
セット { _strButtonText = 値 }
get { return _strButtonText }
}
//アイコン テキスト ボタン ユーザー コントロールのアイコン パス
文字列 _strImageSrc = "";
パブリック文字列 strImageSrc
{
セット { _strImageSrc = 値 }
取得 { return _strImageSrc }
}
//コントロールを無効にする
ブール値 _UCDisabled = false;
public boolUCDisabled
{
セット
{
this.tr1.Disabled = 値;
_UCDisabled = 値;
}
get { return _UCDisabled }
}
//onclick jsイベントに応答する処理関数
文字列 _strOnClickJSFun = "";
パブリック文字列 strOnClickJSFun
{
セット { _strOnClickJSFun = 値 }
get { return _strOnClickJSFun }
}
//サーバー側での OnClick イベントへの応答
パブリックデリゲート void userEvent(object sender, EventArgs e);
パブリックイベント userEvent UCOnClick;
protected void Button1_Click(オブジェクト送信者、EventArgs e)
{
if (this.UCOnClick != null)
this.UCOnClick(this, e);
}
#エンドリージョン
protected void Page_Load(オブジェクト送信者, EventArgs e)
{
if (!IsPostBack)
{
if (_strButtonText != "")
{
this.Literal2.Text = _strButtonText;
}
if (_strImageSrc != "")
{
this.Literal1.Text = "<img id='" + this.UniqueID + "Image1' src='" + _strImageSrc + "' />";
}
if(UC無効)
戻る;
if (_strOnClickJSFun != "")
{
string strjsfun = _strOnClickJSFun.Replace(";", "").Replace("return ", "");
if (this.UCOnClick != null)
{
this.tr1.Attributes.Add("onclick", "if(" + strjsfun + "){document.all." + this.UniqueID + "_Button1.click();}");
}
それ以外
{
this.tr1.Attributes.Add("onclick", strjsfun);
}
}
それ以外
{
if (this.UCOnClick != null)
{
this.tr1.Attributes.Add("onclick", "document.all." + this.UniqueID + "_Button1.click();");
}
}
}
}
}
2. [アイコン テキスト ボタン] ユーザー コントロールを使用します。
<uc1:WebUserControl ID="WebUserControl1" runat="server" OnUCOnClick="Button1_Click" strOnClickJSFun="return fn_Check();"
strButtonText="変更" strImageSrc="../Images/Edit.gif" />