- PR -

Javascript でコントロール名の取得

投稿者投稿内容
King
ぬし
会議室デビュー日: 2008/06/20
投稿数: 284
投稿日時: 2008-12-25 00:07
通し番号って事はコントロールを追加する度にずれていく可能性があるので
動的に取得すべきでは?
べる
ぬし
会議室デビュー日: 2003/09/20
投稿数: 1093
投稿日時: 2008-12-25 00:44
引用:
私もこの方法のようなことを選択しましたが、ここに出力されるIDは、常に不変であることが保証されているのでしょうか?

コントロールの構造やIDなど、何も変えなければ不変でしょうが、常に不変ということはもちろんありません。
多分、INamingContainerの階層ごとに名前が付くんだと思います。たとえばユーザーコントロールに
のせたらUserControl1_DataList1_ctl00_LinkButton1のようになりますよね。
でもPanelの中に入れてもClientIDは変わりません。

DataListのテンプレートの中にあるのなら
<%# Container.FindControl("LinkButton1").ClientID %>
とするのがスマートな気がします。
Access
ぬし
会議室デビュー日: 2002/04/08
投稿数: 829
投稿日時: 2008-12-25 07:11
>試そうとしましたが、VBの文法を知らないため下記の部分をC#に書き換えられません。

自動変換ツールがありますので利用してください。

http://www.developerfusion.com/tools/convert/vb-to-csharp/


>DataListのテンプレートの中にあるのなら
><%# Container.FindControl("LinkButton1").ClientID %>
>とするのがスマートな気がします。
JavaScriptがインラインならこれでもOKですが
外部ファイルに格納できませんよね。

私はJavaScriptを外部ファイルに格納できるように
jQueryを利用しています。
この場合、CssClassを追加して検索します。

<asp:LinkButton CssClass="lnkButton" .... />
$(".linkButton") // こんな感じでHTML要素を検索できます

_________________
ASP.NET+Ajaxサンプル集 | JavaScript+Ajaxサンプル集
べる
ぬし
会議室デビュー日: 2003/09/20
投稿数: 1093
投稿日時: 2008-12-25 08:57
引用:
JavaScriptがインラインならこれでもOKですが
外部ファイルに格納できませんよね。

そうですね。外部ファイルを利用するなら引数で渡す形などになりますね。
今回の例だと onclick="DoCopy()" の引数が妥当でしょうか。

引用:
<asp:LinkButton CssClass="lnkButton" .... />
$(".linkButton") // こんな感じでHTML要素を検索できます


なるほどclassで指定できるのですね。この場合、複数あるCssClass="lnkButton"のLinkButtonのうち
ひとつを特定するにはどうするのですか?
ぴあちゃん
ぬし
会議室デビュー日: 2008/02/07
投稿数: 287
投稿日時: 2008-12-26 00:40
jQuery はお客さんが懐疑的なんで使わせてもらえないのですが、
汎用的に以下のようなメソッド群をいつも用意していますね。

コード:

//class に定義された名前で検索する
var classNames = $CLS = function(className, o) {
o = o || document;
var os = o.getElementsByTagName("*");
var arr = [];
for (var i=0;i < os.length;i++) {
if (os[i] && os[i].className &&
os[i].className.lastIndexOf(className) > -1) {
arr.push(os[i]);
}
}
return arr;
}
var byId = $ID = function(id, o) {
o = o || document;
return o.getElementById(id);
}
var tagNames = $TAGS = function(name, o) {
o = o || document;
return o.getElementsByTagName(name);
}



>なるほどclassで指定できるのですね。この場合、複数ある
>CssClass="lnkButton"のLinkButtonのうち
>ひとつを特定するにはどうするのですか?

僕なら、そのリンクボタンの位置から特定できそうなタグがあるかどうかを
あしがかりにしますね。
TABLE タグ内にあるならば、親ノードに TD があるはずなので TD を見つけます。
コード:

var parentNodes = $PNS = function(obj, nodeName) {
//...省略w
}



jQuery は、$("td a.className") みたいに出来るのでとっても便利です。
この場合は、td 要素の子供の アンカーで className を持つもの、という
分類で検索されます。あまり詳しくないので Acccess さんの回答待ちです
ね;;確か、nth だか、ntd だか忘れちゃったけど、テーブルの行をじかに
指定して・・・なんてのも出来たはずです。


TDの中に LinkButton が複数あったらどれも特定できない、と考えるかも
しれませんが、その時は普通は CssClass の名前を変えてあげればいいだけ
です。CssClass に指定する名前は架空の名前でもいいのですから。
定義済みでなければならないなんてことはありません。分類しやすく幾つか
名前を分けてあげれば特定しやすくなります。

<table> の中にLinkButton が3カラム分あるなら、Css1, Css2, Css3 って
やってあげて(実体は空でも未定義でもなんでも構わない)$("td a.Css1")
ってやれば1つに特定できます。
LinkButton個々に実体のあるCSSを持たせつつ、カテゴライズしやすいように
適当な分類名も付けておけばいいですね。
CssClass="LinkButtonBaseCss Css1 EvenCss" とか。

.LinkButtonBaseCss { color:orange; }



[ メッセージ編集済み 編集者: ぴあちゃん 編集日時 2008-12-26 01:01 ]

[ メッセージ編集済み 編集者: ぴあちゃん 編集日時 2008-12-26 01:15 ]
Access
ぬし
会議室デビュー日: 2002/04/08
投稿数: 829
投稿日時: 2008-12-26 05:59
>なるほどclassで指定できるのですね。この場合、複数あるCssClass="lnkButton"の>LinkButtonのうち
>ひとつを特定するにはどうするのですか?
jQueryにはいろんなフィルタ機能が用意されています。

たとえば、

$(".lnkButton:first")
$(".lnkButton:last")
$(".lnkButton:not(:first)")
$(".lnkButton:eq(1)")
$(".lnkButton:gt(1)")
$(".lnkButton:lt(1)")
$(".lnkButton").find()

など・・・

_________________
ASP.NET+Ajaxサンプル集 | JavaScript+Ajaxサンプル集

[ メッセージ編集済み 編集者: Access 編集日時 2008-12-26 06:01 ]
べる
ぬし
会議室デビュー日: 2003/09/20
投稿数: 1093
投稿日時: 2008-12-26 07:24
>ぴあちゃんさん、Accessさん
なるほどjQueryは便利そうですね。Visual Studioでも正式サポートということで興味あります。
$("td a.className") などの指定方法はcssでスタイルを定義する方法と同じでわかりやすいですね。

今回のケースだと、$(".lnkButton:eq(1)") これとDataList側のItemIndexを使ってうまくできそうですね。
SL
大ベテラン
会議室デビュー日: 2008/05/02
投稿数: 183
投稿日時: 2008-12-26 10:05
お世話になります。

元質問者です。
私のレベルを遥かに超えたところのアドバイスやご意見が見られます。
jQuery などまだよくわかりません。jQuery を使用するともっとスマート、スリムになるようですが.....

私に理解できる範囲だと下記のようにしてやるとボタンを押したタイミングでポストバック時にJavaScript を走らせられるかなと思ってます。
ただ、下記のコードで「入力文字列の形式が正しくない」というエラーがでて理由がわかりません。場所は、string stResavationData に代入するところです。

コード:
protected void DataList1_ItemCommand(object source, DataListCommandEventArgs e)
{
          :
LinkButton cb;
foreach (DataListItem dl in DataList1.Items)
{
   cb = (LinkButton)dl.FindControl("LinkButton1");
   ClientScript.RegisterArrayDeclaration("LinkButtonIDs", string.Concat("’", cb.ClientID, "’"));
}
string stResavationData = string.Format("window.onload = function()" + " { DoCopy({0}); }", e.Item.ItemIndex.ToString());
stResavationData += "function DoCopy(var num){ if (LinkButtonIDs != null) { if(self.clipboardData){ clipboardData.setData('text', document.all[LinkButtonIDs[num]].innerHTML); } } }";
string startupScript = string.Format("<script type='text/javascript'> {0} <" + "/script>", stResavationData);
Page.ClientScript.RegisterStartupScript(this.GetType(), "startup", startupScript);




こんな考え方でうまくいきませんでしょうか?

スキルアップ/キャリアアップ(JOB@IT)