- PR -

[ASP.net]ページロード時のデフォルトボタンの設定

1
投稿者投稿内容
ナツキ
会議室デビュー日: 2005/10/20
投稿数: 5
投稿日時: 2005-10-20 18:22
お世話になります。早速ですが質問させていただきます。

VS.net2003において、asp.netとC#でwebフォーム開発を行っています。
フォームのページロード時に、配置されているボタンから
任意のデフォルト・ボタンを設定したいのですが、どの様に記述すればいいのかわからず
行き詰っています。

asp.net 2.0でいう、DefaultButtonプロパティの様な定義を実現させたいのですが･･･
どうかご教授御願いいたします。

ぼのぼの
ぬし
会議室デビュー日: 2004/09/16
投稿数: 544
投稿日時: 2005-10-20 18:51
こんばんわ。

asp.net2.0にはそんなプロパティがあるんですね。知らなかった。
Webでのデフォルトボタンて、HTML上最初に現れるsubmitだと思うんですけど、
どうやって制御しているんでしょう？

GridLayoutなら順番変えられるけどFlowLayoutだったら無理だし…
javascript使ってるんでしょうか？

もし手元にasp.net2.0の環境があるなら、DefaultButtonプロパティを設定して
動かして生成されたHTMLのソースをのぞいてみるのが手っ取り早いと思います。
でっち６号
大ベテラン
会議室デビュー日: 2005/01/31
投稿数: 176
お住まい・勤務地: Kawasaki
投稿日時: 2005-10-20 19:27
こんばんは、でっちです。

私も過去一度だけ見ただけな上、今確認できる環境がないのですが、DefaultButtonプロパティを設定すると、
1.Formタグにonkeypressイベントが追加される(Javascript)。
2.1で呼ばれるスクリプトが生成される(WebForm_FireDefaultButtonだったかな?)
と言う挙動をしていたと記憶しています。(流石にスクリプトの中身までは忘れてしまいました)

なので、
・FormタグにonkeypressイベントをAddする。
・RegisterClientScriptBlockでイベントの処理を記述したスクリプトブロックを出力する。
と言う処理をPage_Loadあたりに記述してあげれば実現できると思います。
コアな部分はJavaScriptの中身なので、Asp.NET 2.0で確認して下さい。

#記憶違いだったら申し訳ありません。
ナツキ
会議室デビュー日: 2005/10/20
投稿数: 5
投稿日時: 2005-10-21 18:27
ぼのぼのさん、でっちさん、返答ありがとうございました。
返事が遅れてしまい申し訳ありません。

VS2005で検証してみたところ、でっちさんの仰るとおりのコードが生成されていました。
しかし、WebForm_FireDefaultButtonの内容は記述されておらず、下記のサイトから
同名functionのコードを参考にしました。
http://www.eggheadcafe.com/articles/System.Web.Resources.txt

さらにでっちさんの手順に則って、Formタグとpage_loadイベントに以下のように記述しました。

構成：TextBox1,Button1,Button2

（WebForm1.aspx）
<form id="Form1" method="post" runat="server" onsubmit="javascript:return WebForm_FireDefaultButton(event, 'Button2')">

（WebForm1.aspx.cs）
private void Page_Load(object sender, System.EventArgs e)
{
// ページを初期化するユーザー コードをここに挿入します。
string script =
"<script language='JavaScript'>"
+"function WebForm_FireDefaultButton(event, defaultButton) {"
+"debugger;"
+" if (event.keyCode == 13) {"
+" if (__nonMSDOMBrowser) {"
+" src = event.target;"
+" }"
+" else {"
+" src = event.srcElement;"
+" }"
+" tagName = src.tagName.toLowerCase();"
+" if ((tagName != 'a') && ((tagName != 'input') || ((src.type != 'submit') && (src.type != 'reset') && (src.type != 'image') && (src.type != 'file')))) {"
+" if (defaultButton.click != 'undefined') {"
+" defaultButton.click();"
+" if (__nonMSDOMBrowser) {"
+" event.cancelBubble = true;"
+" }"
+" return false;"
+" }"
+" }"
+" }"
+" return true;"
+"}"
+"<" + "/script>";
RegisterClientScriptBlock("firedefaultbutton", script);
}

以上により、本来Button1に設定されるデフォルトボタンを
Button2にしたかったのですが、上手くいきませんでした。
asp.net2.0への移行も視野に入れて、もう少し調べてみようと思います。
葉瀬崎浩樹
大ベテラン
会議室デビュー日: 2005/06/28
投稿数: 115
お住まい・勤務地: 兵庫県
投稿日時: 2005-10-21 20:49
こんばんわ。
記憶に頼った話ですが。
VS2003・IE6環境で、デフォルトボタン（Enter押下に反応するボタン）を
設定した経験があります。

引用:
Webでのデフォルトボタンて、HTML上最初に現れるsubmitだと思うんですけど、
どうやって制御しているんでしょう？

ぼのぼのさんがこのように書かれているように、
デフォルトボタンに設定したいSubmitボタンを、
HTMLソースとして見た場合に、１番最初に出現するように、
ASPXを書き換えることで可能だったと思います。

Webページのデザイナ画面ではなく、ASPXのソースを直接修正して、
Formタグの直後に、任意のボタンを配置するようにしました。

Submitではないボタンの場合にどのような挙動になるかは、
ちょっと覚えてません。

酔ってるので、間違ってても許して。。（*≧◇≦）ノ□

追記
#FlowLayoutでデザインしている場合に、
#目的のボタンがページの先頭に配置されるのが嫌なら、
#ボタンの配置位置は、スタイルシートで設定してやる必要がありそうです。

[ メッセージ編集済み 編集者: 葉瀬崎浩樹 編集日時 2005-10-21 20:55 ]
ぼのぼの
ぬし
会議室デビュー日: 2004/09/16
投稿数: 544
投稿日時: 2005-10-24 14:52
引用:

ナツキさんの書き込み (2005-10-21 18:27) より:
VS2005で検証してみたところ、でっちさんの仰るとおりのコードが生成されていました。
しかし、WebForm_FireDefaultButtonの内容は記述されておらず、下記のサイトから
同名functionのコードを参考にしました。
http://www.eggheadcafe.com/articles/System.Web.Resources.txt
(以下略)

あー、やっぱりjavascriptでしたか(^^;
ちょっと見づらかったのでこのコードから生成されるであろうスクリプトを整形。

コード:

<script language='JavaScript'>
function WebForm_FireDefaultButton(event, defaultButton) {
    debugger;
    if (event.keyCode == 13) {
        if (__nonMSDOMBrowser) {
            src = event.target;
        } else {
            src = event.srcElement;
        }
        tagName = src.tagName.toLowerCase();
        if ( (tagName != 'a') &&
             ( (tagName != 'input') ||
               ( (src.type != 'submit') &&
                 (src.type != 'reset') &&
                 (src.type != 'image') &&
                 (src.type != 'file')
               )
             )
           ) {
            if (defaultButton.click != 'undefined') {
            defaultButton.click();
            if (__nonMSDOMBrowser) {
                event.cancelBubble = true;
            }
                return false;
            }
        }
    }
    return true;
}
</script>

なんかリンク先のコードと微妙に違いませんか？(^^;
debugger;という謎の一行があるし、
__nonMSDOMBrowserというフラグを初期化する処理も抜けてますね。
あとtagNameの判定処理とか追加されてるみたいですけど、
とりあえずリンク先と全く同じにしてみて動くかどうか試してみたらいかがでしょう？

それから、スクリプトを全部aspx.csに書くのではなく、aspx.csには

コード:

string script = "<script language='JavaScript' src='XXX.js'></script>";
RegisterClientScriptBlock("firedefaultbutton", script);

と書いておいて、スクリプトの中身はXXX.jsに書いといたほうが、保守しやすいと思います。
ただし、この場合jsファイルに全角文字のコメントを入れない方が吉です。
ナツキ
会議室デビュー日: 2005/10/20
投稿数: 5
投稿日時: 2005-10-24 18:03
葉瀬崎浩樹さん、ぼのぼのさん、返答ありがとうございました。
スクリプト保守の指摘、今後の参考にさせていただきます。

引用:

ぼのぼのさんの書き込み (2005-10-24 14:52) より:

なんかリンク先のコードと微妙に違いませんか？(^^;
debugger;という謎の一行があるし、
__nonMSDOMBrowserというフラグを初期化する処理も抜けてますね。


debugger;というのは、経過を確認するために此方で記述したもので、
消すのを忘れていました。失礼しました；
リンク先のコード、確かに違いますね･･･私が書き込む直前に確認したのは先述のコードだったのですが(汗

ご指摘の__nonMSDOMBrowserの初期化も加えて、スクリプトは以下の様になりました。
コード:
var __nonMSDOMBrowser = (window.navigator.appName.toLowerCase().indexOf('explorer') == -1);
var __defaultFired = false;
function WebForm_FireDefaultButton(event, target) {
    if (!__defaultFired && event.keyCode == 13) {
        var defaultButton;
        if (__nonMSDOMBrowser) {
            defaultButton = document.getElementById(target);
        }
        else {
            defaultButton = document.all[target];
        }
        if (defaultButton.click != undefined) {
            __defaultFired = true;
            defaultButton.click();
            event.cancelBubble = true;
            return false;
        }
    }
    return true;
}


結果として、キー押下時のデフォルトボタンは設定できたのですが、
2.0のDefaultButtonプロパティの様な効果を得るには到りませんでした。

葉瀬崎浩樹さんの方法が上手くいきそうなので、
現時点ではこちらを使いつつスクリプトの方も調べていきたいと思います。
ありがとうございました。
1

スキルアップ／キャリアアップ（JOB@IT）