C# と VB.NET の質問掲示板

ASP.NET、C++/CLI、Java 何でもどうぞ

C# と VB.NET の入門サイト

Re[5]: C#のデータをjavascriptへ渡して表示する


(過去ログ 49 を表示中)

[トピック内 11 記事 (1 - 11 表示)]  << 0 >>

■26101 / inTopicNo.1)  C#のデータをjavascriptへ渡して表示する
  
□投稿者/ ぽっち (67回)-(2008/10/01(Wed) 17:39:58)

分類:[ASP.NET (C#)] 

こんにちは、いつもお世話になっております。
現在、エクスプローラー風ツリービューの掲示板を作成中なのですが、

C#からAsp.net(aspxファイル)に書いているjavascriptの下記場所にC#のデータベースから取得したデータを
表示させたいのですが、どうすれば良いのか分からずにお手上げ状態となってしまいました。


C#内でデータを作っている箇所の一部ソースは、下記の通りです。
最終的にCreateTable()はページロードで現在のソースではデータバインドさせていますが、
javascriptのツリー表示にさせたい場合をお手数ではございますが、どなたかご教授下さい。


<開発環境>
VS2005
WindowsXP
asp.net
C#
javascript


<C#ソース>
private DataTable CreateTable()
{
// ログイン者が管理者に許可されているカテゴリを取得
DataTable da = new DataTable();
da.Columns.Add("CategoryID", typeof(int));
DataTable daCategory = CategoryHelper.SelectCategoriesWithManager();

// 候補1 管理者カテゴリIDをint[]配列に挿入
int[] aList = new int[daCategory.Rows.Count];
int num = 0;
foreach (DataRow cRrow in daCategory.Rows)
{
aList[num] = (int)cRrow["CategoryID"];
num++;
}

// トピック一覧にバインドさせるためのテーブルを作成
DataTable dt = new DataTable();
dt.Columns.Add("Title", typeof(string));
dt.Columns.Add("CreateTime", typeof(DateTime));
dt.Columns.Add("TopicID", typeof(int));
dt.Columns.Add("IndentCount", typeof(int));
dt.Columns.Add("CreateUser", typeof(string));
dt.Columns.Add("RowType", typeof(int));
dt.Columns.Add("ReplyCount", typeof(int));
dt.Columns.Add("CategoryUser", typeof(Boolean));

// カテゴリ一覧を取得
CategoryHelper ch = new CategoryHelper();
DataTable categories = ch.GetCategoryList(aList);
Boolean CreateUser = false;

foreach (DataRow category in categories.Rows)
{
int categoryId = (int)category["CategoryID"];
CreateUser = false;
for (int n = 0; n < aList.Length; n++)
{
if (aList[n] == categoryId)
{
CreateUser = true;
}
if (CreateUser) break;
}

// カテゴリ表示用の行を作成
DataRow row = dt.NewRow();
row["Title"] = category["CategoryName"];
row["RowType"] = ROWTYPE_CATEGORY;
row["TopicID"] = category["CategoryID"];
row["IndentCount"] = 1;
row["CategoryUser"] = CreateUser;
dt.Rows.Add(row);

// サブカテゴリ一覧を取得
DataTable subCategories = ch.GetCategoryList((int)category["CategoryID"]);
foreach (DataRow subCategory in subCategories.Rows)
{
// サブカテゴリ表示用の行を作成
DataRow row1 = dt.NewRow();
row1["Title"] = subCategory["CategoryName"];
row1["RowType"] = ROWTYPE_SUBCATEGORY;
row1["TopicID"] = subCategory["CategoryID"];
row1["IndentCount"] = 2;
row1["CategoryUser"] = CreateUser;
dt.Rows.Add(row1);

// ヘッダを作成
DataRow headerrow = dt.NewRow();
headerrow["RowType"] = ROWTYPE_HEADER;
headerrow["IndentCount"] = 0;
headerrow["CategoryUser"] = CreateUser;
dt.Rows.Add(headerrow);

// トピック一覧を取得
TopicHelper th = new TopicHelper();
DataTable topics = th.GetTopicListData((int)subCategory["CategoryID"]);
foreach (DataRow topic in topics.Rows)
{
DataRow row2 = dt.NewRow();

row2["Title"] = topic["Title"];
row2["TopicID"] = topic["TopicID"];
row2["RowType"] = ROWTYPE_TOPIC;
row2["CreateTime"] = topic["CreateTime"];
row2["IndentCount"] = topic["IndentCount"];
row2["ReplyCount"] = topic["ReplyCount"];
row2["CategoryUser"] = CreateUser;
dt.Rows.Add(row2);
}
}
}
return dt;
}

<aspxファイル内のjavascript>
<script type="text/javascript" src="../script/tree.js"></script>
<script type="text/javascript">
<!--

var Tree = new Array;
// nodeId | parentNodeId | nodeName | nodeUrl
Tree[0] = '1|0|<%="AAA" %>|#'; //AAAの場所にデータベースのデータを格納し、表示したい
Tree[1] = "2|1|Page 1.1|#";
Tree[2] = "3|1|Page 1.2|#";
Tree[3] = "4|3|Page 1.2.1|#";
Tree[4] = "5|1|Page 1.3|#";
Tree[5] = "6|2|Page 1.1.1|#";
Tree[6] = "7|6|Page 1.1.1.1|#";
Tree[7] = "8|6|Page 1.1.1.2|#";
Tree[8] = "9|1|Page 1.4|#";
Tree[9] = "10|9|Page 1.4.1|#";
Tree[10] = "11|0|Page 2|#";
//-->
</script>

ツリー表示させたい場所に
<script type="text/javascript">
<!--
createTree(Tree,1,7); // starts the tree at the top and open it at node nr. 7
//-->
</script>
のソース配置。


現状、http://youmos.com/news/dtree.htmlのサイト様のダウンロードソースを使っていますが、
掲示板なのでノードは増えていく形で作成予定です。(ループ分で配列を足していく?)


後、ノードは今現状では階層が分かれていますが、最終的には例のようにしたいと考えています。

例>
びびえす
  Re:びびえす





引用返信 編集キー/
■26103 / inTopicNo.2)  Re[1]: C#のデータをjavascriptへ渡して表示する
□投稿者/ ま (130回)-(2008/10/01(Wed) 18:52:54)

●一番簡単なやり方

Tree = [
<%= TreeViewNodes.ToString() %>
];


ってやる。TreeViewNodes は自分自身に ツリーの "1|0|Page 1|#" こーゆー文字列を
リストで持っていて、ToString() すると、そのリストを "," で連結した結果を返す、
というもの。

●簡単ではないやり方(というか一般的なやり方かも)
ごめんなさい。久しくASP.NET使ってないので忘れちゃいました。


わかりますか?




 


引用返信 編集キー/
■26105 / inTopicNo.3)  Re[1]: C#のデータをjavascriptへ渡して表示する
□投稿者/ Jitta on the way (187回)-(2008/10/01(Wed) 19:41:48)
No26101 (ぽっち さん) に返信

2.0ですよね?TreeView コントロールがないんだっけ?
他で提供されていたのが、組み込まれたんじゃなかったかなぁ?
引用返信 編集キー/
■26106 / inTopicNo.4)  Re[2]: C#のデータをjavascriptへ渡して表示する
□投稿者/ みきぬ (126回)-(2008/10/01(Wed) 19:55:06)
このへんのお話ですよね。
http://bbs.wankuma.com/index.cgi?mode=al2&namber=25790

結局、TreeViewは使わなかったってことかな?
引用返信 編集キー/
■26116 / inTopicNo.5)  Re[3]: C#のデータをjavascriptへ渡して表示する
□投稿者/ ぽっち (68回)-(2008/10/02(Thu) 09:08:03)
No26103 (ま さん) に返信

つまり

> ●一番簡単なやり方

> Tree = [
> <%= TreeViewNodes.ToString() %>
> ];

は、javascript部分に書くということでしょうか・・・?
これってTreeViewコントロールですよね??

No26105 (Jitta on the way さん) に返信

2.0なのでTreeViewコントロールは使えます。
しかし上の人間が難色を示したのでjavascriptを使っている次第です。

結局、どっちか作らないといけないので、ASP.netでも構わないんですけれどね。

No26106 (みきぬ さん) に返信
> このへんのお話ですよね。
> http://bbs.wankuma.com/index.cgi?mode=al2&namber=25790
>
> 結局、TreeViewは使わなかったってことかな?

実は、Jitta on the way さんにも述べました通り、上の人間がTreeViewコントロールを使う事に
なぜかは知りませんが「無理」と言われてしまい、やってみろとは言われているのですが・・・
とりあえずjavascriptでも出来るのではと上の人に言われたのでそちらを考えている次第です。

最終的には、TreeViewコントロールの方も作ってJavascriptの方と見比べて検討を考えているのですが・・・
TreeViewコントロールでの作り方もご教授いただけると助かります。
引用返信 編集キー/
■26117 / inTopicNo.6)  Re[4]: C#のデータをjavascriptへ渡して表示する
□投稿者/ ロック (117回)-(2008/10/02(Thu) 09:35:27)
> は、javascript部分に書くということでしょうか・・・?
> これってTreeViewコントロールですよね??

ASP.NETによる実践経験はまだ無いのですが、
HTMLデザインに<%# xxxxx %>を記述しておき
ASP.NET処理でDataBind()命令を実行すると、xxxxの部分に評価された式が
代入されます。

というわけで、単純にStringのメンバ変数(たとえばstrTree)を用意し
その中に出力したい、HTML文を記述してDataBind()してみれば
どういう結果になるのか分かるかと思います。


こんな感じかな?

Tree = [
<%# strTree %>
];


Protected String strTree = "ツリーのhtml文";
private void Page_Load(object source, EventArgs e)
{
DataBind();
}

# 実は、<%#と<%=の違いを良く分かっていません(汗
# 関数と変数の違いなのかな? 勉強してきます。

引用返信 編集キー/
■26118 / inTopicNo.7)  Re[4]: C#のデータをjavascriptへ渡して表示する
□投稿者/ みきぬ (127回)-(2008/10/02(Thu) 09:45:44)
No26116 (ぽっち さん) に返信
> 実は、Jitta on the way さんにも述べました通り、上の人間がTreeViewコントロールを使う事に
> なぜかは知りませんが「無理」と言われてしまい、やってみろとは言われているのですが・・・
>
意味がわからん。
既にあるTreeViewだと何か無理なことがあって、自前で組めばそれが可能だってならわかりますが。

# その上の人間の人が、WindowsフォームのTreeViewと勘違いしているってことはないよね?

> とりあえずjavascriptでも出来るのではと上の人に言われたのでそちらを考えている次第です。
>
いや、そりゃ可能ですけどね。
つまるところ、TreeViewもJavaScriptを吐いているわけだし。

> 最終的には、TreeViewコントロールの方も作ってJavascriptの方と見比べて検討を考えているのですが・・・
> TreeViewコントロールでの作り方もご教授いただけると助かります。
>
全部説明するのは面倒なんで、下のリンク先を読んでください。
http://www.microsoft.com/japan/msdn/vs05/aspnet/treeview.aspx
引用返信 編集キー/
■26122 / inTopicNo.8)  Re[5]: C#のデータをjavascriptへ渡して表示する
□投稿者/ ぽっち (69回)-(2008/10/02(Thu) 10:29:22)
No26117 (ロック さん) に返信
回答有難うございます。
参考にさせていただきます。

> 実は、<%#と<%=の違いを良く分かっていません(汗
> 関数と変数の違いなのかな? 勉強してきます。

同じくあんまりよく分かってないです、私も・・・。勉強してきます。

No26118 (みきぬ さん) に返信
回答有難うございます。msdnって読んでもなかなか理解出来ないのですが、
もう一度じっくり読んでみます。
> # その上の人間の人が、WindowsフォームのTreeViewと勘違いしているってことはないよね?
否定は出来ませんね・・・。というのもあんまりプログラムに精通してる人ではないので。
後、上の人が断言してまで出来ないというのは、私の前に担当してた方がシステムを作ったらしいのですが、
その方が仕様上、無理とか仰ったのが元のようです。
ただ何で無理なのかは上の人も覚えてないみたいですが。そこが肝心なのに・・・。



引用返信 編集キー/
■26123 / inTopicNo.9)  Re[6]: C#のデータをjavascriptへ渡して表示する
□投稿者/ みきぬ (129回)-(2008/10/02(Thu) 10:41:32)
No26122 (ぽっち さん) に返信
> ■No26118 (みきぬ さん) に返信
> 回答有難うございます。msdnって読んでもなかなか理解出来ないのですが、
> もう一度じっくり読んでみます。
>
とりあえずデザイナ上でTreeViewコントロールを置いてみて、いくつかノードを追加してみると
大体の感じはつかめると思います。

あとはコードでの作り方ですが、@ITにサンプルがあったので貼っておきます。
http://www.atmarkit.co.jp/fdotnet/dotnettips/427asptreefromdb1/asptreefromdb1.html

>># その上の人間の人が、WindowsフォームのTreeViewと勘違いしているってことはないよね?
> 否定は出来ませんね・・・。というのもあんまりプログラムに精通してる人ではないので。
> 後、上の人が断言してまで出来ないというのは、私の前に担当してた方がシステムを作ったらしいのですが、
> その方が仕様上、無理とか仰ったのが元のようです。
> ただ何で無理なのかは上の人も覚えてないみたいですが。そこが肝心なのに・・・。
「仕様上、無理」という理由によっては、自前でJavaScriptを組んでもダメかもしれませんよ?
小一時間問い詰めたほうがよくありませんか?

#と煽ってみる
引用返信 編集キー/
■26171 / inTopicNo.10)  Re[7]: C#のデータをjavascriptへ渡して表示する
□投稿者/ ロック (118回)-(2008/10/02(Thu) 23:29:10)
ちょっと悩んだんですが、一応参考までに

「Visual Studio 2005でいってみよう〜ASP.NET 2.0編 」という本に
TreeViewを使った掲示板の作成が載っています。
# みきぬさんが紹介している@ITのサイトと同じ山田 祥寛さんが書いています。

この書籍の紹介サイトでこの本に載っているサンプルがDLできるので
そのコードをちょっといじるとTreeViewを使ったパターンは
出来てしまいそうな気がします。。。
http://seshop.com/detail.asp?pid=8094


引用返信 編集キー/
■26584 / inTopicNo.11)  Re[5]: C#のデータをjavascriptへ渡して表示する
□投稿者/ ぽっち (74回)-(2008/10/15(Wed) 09:36:05)
閉め忘れてしまっていたので、急きょ今更ながらトピック閉じますね。
お返事が遅れました事、大変お詫び致します。

No26123 (みきぬ さん) に返信
お返事遅れまして大変申し訳ございませんでした。
ITの方の情報有難うございます。ぜひとも参考にさせていただきます。

javascriptの件ですが、表示に関しては成功致しましたのでお知らせします。
結局何がダメだったのでしょうかね・・・?上の方にとって・・・??

No26171 (ロック さん) に返信
お返事遅れまして申し訳ございませんでした。
情報有難うございます。

お陰さまでTreeViewでの表示は可能となりましたのでお知らせします。

本の情報も助かります!ぜひ書店へも行ってみます。
解決済み
引用返信 編集キー/


トピック内ページ移動 / << 0 >>

このトピックに書きこむ

過去ログには書き込み不可

管理者用

- Child Tree -