JSONデータを50音で選択表示させたい

下記JSONデータの中から、
５０音に応じた内容を選択表示させたいのですが、
どうすれば良いでしょうか？

■具体例
・「チェックボックス」もしくは「プルダウン」で、「お」を選択したら、下記データを表示させたい
　　{
　　"link": "goo1.html",
　　"name": "小田 和正",
　　"yomi": "おだかずまさ"
　　},


■元データ(JSON)
{
　"human": {
　"artist": [
　　{
　　"link": "goo1.html",
　　"name": "小田 和正",
　　"yomi": "おだかずまさ"
　　},
　　{
　　"link": "goo2.html",
　　"name": "岩佐美咲",
　　"yomi": "いわさみさき"
　　},
　　{
　　"link": "goo3.html",
　　"name": "指原莉乃",
　　"yomi": "しのはらりの"
　　},
　]
　}
}

・jQueryのAJAX通信とかでやるのでしょうか？
(実現出来れば、手段は何でもいいです)

No.1 回答者： LancerVII 回答日時： 2012/06/28 10:12

こんにちは。

サンプルを作ってみたので参考にしてみてください。

==== 動作サンプル
http://hppg.moe.hm/okwave/qa/q7559127/

ただ、同じ頭文字がいたらどうする？とか考慮していません。
その辺はうまく実装してみてください。


>jQueryのAJAX通信とかでやるのでしょうか？
すでにJSONが出来上がっているなら今回のサンプルのようになるとおもいますし、データベース上にデータがあって選択された内容によって表示するのであればAjaxまたは通常の通信を利用してサーバ上よりJSONを取得します。
設計次第です。

この回答への補足

回答ありがとうございました。

＞同じ頭文字がいたらどうする？
この場合、全て表示させたいのですが、具体的にどうしたら良いでしょうか？
(おだが二人いたら、二人分のデータを表示させたい、という意味です)

■試してみたこと
まとめてみたら何とかなるかもしれない、と思い、
始めに、var hash = { link: 'none', name: 'none', yomi: 'none' }
として、for文の中で以下を配列に入れてみようとしたのですが、うまくいきませんでした……
hash.link = line.link;
hash.name = line.name;
hash.yomi = line.yomi;

補足日時：2012/06/28 19:39

No.2 ベストアンサー 回答者： LancerVII 回答日時： 2012/06/29 08:19

こんにちは。

先のサンプルを複数件あった場合を考慮してみました。
前のはコメントで残っているので参考にしてみてください。

forの中で一致するものを探して、一致したら配列に入れるなり、書き出し用の文字列に追加してあげるなりすればOKです。

この回答へのお礼

回答ありがとうございました。
大変参考になりました！

お礼日時：2012/06/29 16:07