- PR -

Webフォーム上でのEnterキー無効化

1|2|3 次のページへ»
投稿者投稿内容
ショコラ
会議室デビュー日: 2003/01/20
投稿数: 4
投稿日時: 2003-01-20 17:13
こんにちは。初めてASP.NETとVB.NETでWeb開発をしています。
過去ログを何度も探してみたのですが、どうにも解決できませんので教えてください。

検索画面を作成中なのですが、”処理はサーバー側”でというプロジェクトの方針に基づき
フォームの中の２つのボタンは、<asp:button>を使用しています。
１つは、検索条件（時間範囲）をセットするボタンで、もう１つは検索実行のボタンです。

処理は完成しているのですが、実際に使用するときに、テキストエリアに入力している最中に
誤ってEnterキーを押してしまうと、検索条件セットのボタンがSubmitされてしまうという
現象が起こります。レイアウトは変更できませんので、どうしても１つめのボタンがSUBMIT
されるのは避けられないので、Enterキーを無効にする方法をとりたいと思っています。

いろいろなサイトを検索し、JavaScriptで、<asp:Form>タグに
Onclick="return false;" と記述してみたり、
ダメ元で、<asp:Text>タグに、onkeydownのイベント処理を追加してみたりとしたんですが、
ASPが生成するコードと競合する関係上、うまくいかないようです。

どなたか、ASPタグを使用した状態でも、Enterキーの無効がうまくいく方法を実現されて
おられる方がいらっしゃいましたら、どうかご教示ください。

＃かなり端折ってますが、現在は下のコードのような記述をしています。

−−ASP側記述−−
コード:
<FORM id="Form1" runat="server">
	<asp:button id="setTimeBtn" Runat="server" Text="Set Time Range"></asp:button>
	<asp:textbox id="pStartTimeTxt" Runat="server" Width="147px"></asp:textbox>
（省略）
	<asp:button id="execute" Runat="server" Text="Execute Search"></asp:button>
</FORM>


−−VB側記述−−
コード:
'Set Time Range ボタン押下時イベント
Private Sub setTimeBtn_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) _
															 Handles setTimeBtn.Click
（省略）
End Sub

'Excute Searchボタン押下時イベント
Private Sub execute_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) _
																Handles execute.Click
（省略）
End Sub
まゆりん
ぬし
会議室デビュー日: 2002/08/12
投稿数: 539
お住まい・勤務地: よこはま
投稿日時: 2003-01-20 18:12
JavaScriptで作ってみました。

function chkEnterKey(){
　　if (event.keyCode == 13){
　　　//送信不可
　　　　return false;
　　} else{
　　　//送信可
　　　return true;
　　}
}

<FORM>タグ内に onsubmit="return chkEnterKey();" を埋め込んでくださいね。

[ メッセージ編集済み 編集者: まゆりん 編集日時 2003-01-20 18:13 ]
ショコラ
会議室デビュー日: 2003/01/20
投稿数: 4
投稿日時: 2003-01-20 18:31
まゆりんさん、ありがとうございます。
自分でも前に同じような方法で試したことがあり、今回も念のためやってみましたが、
ダメでした。。Enterキーはしっかり動いておりました。

ちなみに、下のようなコードが吐き出されます。
前回書き忘れましたが、入力検証にValidatorを使っています。
やはり、Webコントロールが絡むと難しいですかね(;_;)

<form name="Form1" method="post" action="xxx.aspx" language="javascript" onsubmit="ValidatorOnSubmit();return chkEnterKey();" id="Form1">
まゆりん
ぬし
会議室デビュー日: 2002/08/12
投稿数: 539
お住まい・勤務地: よこはま
投稿日時: 2003-01-21 12:00
考えられる原因は
　1.SubmitButtonを使用している
　2.Validatorを使用している
くらいかと。

1はButtonに置き換えるだけで防ぐことが可能です。
2はすいませんがValidatorがどういうのか知らないので何とも言えません。
とりあえず｢ValidatorOnSubmit｣を外してみてEnterKeyが無効になれば原因はそれだと思います。

あと、前に載せたロジックですが、ボタンにフォーカスが当たっている時のEnterKeyによる
送信を防ぐ方法でした・・・趣旨と外れた回答で申し訳ありませんでした。
会社員
ベテラン
会議室デビュー日: 2003/01/21
投稿数: 50
投稿日時: 2003-01-21 14:37
これじゃだめですかね？

<HTML>
<script language="JavaScript">
function submit_a() {
if (document.form.T1.value == "") {
alert("error") ;
return(false) ;
}
document.form.action = "http://www.atmarkit.co.jp/" ;
document.form.method = "GET" ;
document.form.submit() ;
}
</script>
<form name="form" onsubmit="return false;">
<input type="text" name="T1" size="20"><br>
<input type="button" value="type a" name="B1" onclick="submit_a();">
<input type="button" value="type b" name="B2">
</form>
</HTML>
ショコラ
会議室デビュー日: 2003/01/20
投稿数: 4
投稿日時: 2003-01-23 18:10
まゆりんさん、会社員さんありがとうございました。

やはり会社員さんのコードも
ValidatorOnSubmitのコードは、Validatorのコントロールをフォームにおくと
自動的に吐き出されるもので、故意に消すことはできませんでした。
同じ理由で、会社員さんのコードもうまくいかないようです。

IEの仕様だとあきらめるしかないのでしょうか。
同じ状態に陥ってる方も、結構いらっしゃるような気がしますが・・・。
何とか引き続き調査してみます。

いろいろ試してみてわかったのですが、TextBoxが複数になると起こる現象のようです。
TextBoxがひとつだけだと、何の処理もしなくても、EnterでのSUBMIT（厳密にはイベント）は
起こりませんでした。
wild cat
会議室デビュー日: 2002/08/29
投稿数: 13
投稿日時: 2003-01-23 19:15
以下のコードをロードイベントに書いてみてもダメでしょうか？

　pStartTimeTxt.Attributes("onkeydown") = "if(event.keyCode==13) return false;"

[ メッセージ編集済み 編集者: wild cat 編集日時 2003-01-23 19:18 ]
まゆりん
ぬし
会議室デビュー日: 2002/08/12
投稿数: 539
お住まい・勤務地: よこはま
投稿日時: 2003-01-24 10:21
methodを追加してみては？
<FORM id="Form1" method="post" runat="server">


[ メッセージ編集済み 編集者: まゆりん 編集日時 2003-01-24 10:47 ]
1|2|3 次のページへ»

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