- PR -

Webｱﾌﾟﾘｹｰｼｮﾝ　Gridview　編集モードでのエンターキー

1|2 次のページへ»
投稿者投稿内容
ぷり
ベテラン
会議室デビュー日: 2008/02/22
投稿数: 60
投稿日時: 2008-02-22 17:10
お世話になります。

最近、ASP.NET2.0、VB2005にてWebｱﾌﾟﾘｹｰｼｮﾝを作成しております。

色々ネット上等で調べたのですが、

希望する内容に当たらなかったのでご指導下さい。

SQLServerにSQLDATASOURCEにて接続したGridviewがあります。

このGridviewに編集ボタンを付けています。

編集時は編集モードにいくのですが、

その時編集モードには複数の編集可能なTextBoxが出てきます。

TextBox入力後、次のTextBoxに「Enter」を押して移動させたいのですが、

設定方法をご指導下さい。

Yam
大ベテラン
会議室デビュー日: 2003/09/13
投稿数: 179
お住まい・勤務地: だんじり祭りの地
投稿日時: 2008-02-22 17:33
Enterキー 移動 DataGridView
くまっち
大ベテラン
会議室デビュー日: 2008/01/18
投稿数: 169
お住まい・勤務地: 茨城県のどこか。
投稿日時: 2008-02-22 17:45
＠IT > Insider.NET > Insider.NET 会議室 > ディレクトリ > Web Application > フォーカス
探し物は、過去ログにたくさんあると思います。

JavaScript,focus,Enter,Tab,KeyCodeがキーワードっす。

[余談]
Yamさん提示のURLは、DataGridViewなのでWindowsアプリの話ですが
要は同じことをJavaScriptで実現すれば良い訳です。

[ メッセージ編集済み 編集者: くまっち 編集日時 2008-02-22 17:50 ]
ぷり
ベテラン
会議室デビュー日: 2008/02/22
投稿数: 60
投稿日時: 2008-02-22 17:58
Yam様、くまっち様　有難う御座います。

Yam様にご提示頂いた内容をJavaScriptにて実行すれば良いのだと解釈しました。

再度、くまっち様から頂いたキーワードを元に検索してみます。

Yam
大ベテラン
会議室デビュー日: 2003/09/13
投稿数: 179
お住まい・勤務地: だんじり祭りの地
投稿日時: 2008-02-22 18:03
おっと失礼しました。
Enterキー 移動 GridView
くまっちさん御指摘ありがとうございます。。
ついDataを付けてしまいました。

#口頭では今でもどちらも「DataGrid」と呼んでしまいます。

_________________
音速の定時退社！
ぷり
ベテラン
会議室デビュー日: 2008/02/22
投稿数: 60
投稿日時: 2008-02-23 09:16
昨日にご助言を頂き下記の様にしましたが、

希望の動作には至りませんでした。

希望の動作は

１．マスターページ内にあるGridViewの編集ボタンを押すと編集モードに移る。

２．編集モードで編集させたい内容を編集し、
enterを押すと次のテキストボックスにカーソルが移動する。
編集後に更新ボタンを押す。

「enterを押すと次のテキストボックスにカーソルが移動する。」以外の動作は
出来てます。


下記の内容をマスターページに入力しましたが、
マスターページ内にあるGridViewの下に
新しくテキストボックスが２つできてしまいました。

どの様なコードを記入したら、編集ボタンを押した時
GridViewの編集モードにあるテキストボックスにカーソルを合わせ、
enterキーを押したら次のテキストボックスにカーソルを移動させる事が
出来ますでしょうか？

head部分に下記を記入しました。

<script language="javascript" type="text/javascript">
<!--
function procNextCtrl(e){
var c = e.keyCode;
if( c == 13 ){
document.all.item("textboxA").focus();
}
}
//-->
</script>

body部分に下記を記入しました。
<input type="text" name="textboxA" value="" onkeydown="procNextCtrl(event);"/><br/>
<input type="text" name="textboxB" value=""/>
くまっち
大ベテラン
会議室デビュー日: 2008/01/18
投稿数: 169
お住まい・勤務地: 茨城県のどこか。
投稿日時: 2008-02-25 09:47
まず、EnterキーをTabキーの様に動かす為のJavaScriptを用意しましょう。
コード:
function onKeyDownEvent(e)
{
    // Enter(13)が押されたらTab(9)に変える
    if( e.keyCode == 13 ) e.keyCode = 9;
}


次に上記JavaScriptが動作するように編集モード時に表示されるコントロール
のonKeyDownイベントに設定すれば良いだけです。
（Enter押下時、Tabの様に動作させたいコントロールに設定）

*EditItemTemplateにあるコントロールに
コード:
onKeyDown=javascript:onKeyDownEvent(event);

と記述するなど。

>新しくテキストボックスが２つできてしまいました。
追加コードの中にinputタグを2つ追加してますよね。。。
ぷり
ベテラン
会議室デビュー日: 2008/02/22
投稿数: 60
投稿日時: 2008-02-25 13:23
くまっち様、ご指導ありがとうございます。


onKeyDown=javascript:onKeyDownEvent(event);


申し訳ございません。

上記のコードをどこに入力するのでしょうか？

GridViewが置かれているフォームのソース（Edititemtemplateの部分）に
入力しましたら、「大文字は使用できません」と表示され、
小文字に直してデバックするとItemTemplateに画面が変わってしまいます。
（Tabと同じ動きをしていない）

ご親切に設定先までご記載頂いたのですが、
編集モード時に表示されたコントロールにonkeydownイベントが見つからないのです。

宜しくお願いします。
1|2 次のページへ»

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