rui live note

WordPress、PHP、子育て、ブログ、将棋、コワーキング、子育て、群馬等に関する日々感じたことを書いているブログです

*

棋士データベースで遊ぶ(6)〜クイックサーチ機能を作る〜

  • このエントリーをはてなブックマークに追加
  • Pocket

※この記事は「将棋 Advent Calendar 2016 – Adventar」の18日目です。

将棋連盟の棋士データベースは、現役/引退棋士、棋士番号順一覧、50音順一覧などカテゴライズされていて棋士が探しやすいように工夫されていますが、名前や出身地など漠然としたフリーキーワードで検索できるともっと便利になる気がします。

というわけで、キーワードでリアルタイムに絞り込み検索できる機能を作ってみました。

棋士データベース クイックサーチ

さて、こんな感じに検索ページができあがりました。

棋士データベースクイックサーチ

キーワードを入力すると、棋士番号、氏名、出身地、区分のいずれかに文字が含まれる棋士が絞り込んで表示されるようになっています。

例えば「佐藤」と入れればこのように佐藤性の棋士が絞り込まれますし、

棋士データベースクイックサーチ

「群馬県」と入れれば群馬出身の棋士一覧が出てきます。

棋士データベースクイックサーチ

作り方

絞り込み検索の機能にはこちらの jQuery の quicksearch プラグインを使わせてもらいました。

前回の記事までで作った棋士データを使って table を組んでおき、quicksearch プラグインに table のどこを検索対象にするか指定してあげれば、後は自動的にリアルタイムに絞り込み検索をしてくれます。賢いですねー。

この記事で作ったコードはこちらに上げてありますので、ご自由にご覧ください。

ad

この記事が気に入ったらシェアしてもらえると嬉しいです!

  • このエントリーをはてなブックマークに追加
  • Pocket
  • follow us in feedly
  • RSS

  関連記事

情報処理技術者試験
平成26年度春季の情報処理技術者試験申し込みが始まったようです

IPA からお知らせメールが届いてましたが、平成26年度春季の情報処理技術者試験 …

コロツアー
コロツアー2014のコーナー別イベント情報ページまとめ

先日、コロツアーに参加した時に情報収集していて分かったのですが、下記コロツアーの …

ハロウィン
今年のハロウィンも妖怪ウォッチするなら!仮装・変装・気ぐるみ・コスプレグッズまとめ

我が家の子どもたちの間では以前より過熱さが収まった感じの妖怪ウォッチですが、当ブ …

ハロウィン
ハロウィンも妖怪ウォッチで決める!そんな仮装グッズを集めてみました

すっかり日本でもお馴染みとなったハロウィン。今年もあちこちでイベントやらパーティ …

将棋
将棋ウォーズの時間切れ負け率が50%もあったので対策を考えてみた

ちょっと早口の人が相手だと話がなかなか頭に入ってこなかったり、何かを説明しようと …

第2回電王戦のすべて
電王戦FINALをもっと楽しむために読んでおきたい5冊のおすすめ本

将棋電王戦FINAL | ニコニコ動画 電王戦FINALが開幕する3月14日(土 …

20140511_dualincome
うちの奥さんが仕事に復帰して感じる共働きすることのメリット

我が家の下の子が昨年から幼稚園に通い始め、日中わずかながら開放される時間が取れる …

アドベントカレンダー
今年は2つのアドベントカレンダーに参加してみます

今年もいよいよ12月を残すばかりという季節になりました。 ブログをやっていて12 …

ブラスバンド
【#ブラバン甲子園】高校野球観戦のお供にブラバン応援ツイート中継「ブラバンde甲子園」がマニアックで面白い!

日々熱戦が繰り広げられている夏の甲子園、きっとみなさんも地元校や贔屓校の応援で盛 …

新幹線
GWに子連れで新幹線帰省した時にいくつか考えたことのメモ

今年のGWもあっ!という間に終わっちゃいましたね・・・。 さて、GW・お盆・年末 …