WebシステムをPHPで作成しています。


例えば「社員ID」「氏名」「住所」のテキストボックスがあり、「社員ID」へ何文字か入力し、検索ボタンをクリックすると前方一致検索での検索結果(ID、氏名、住所)を表示した別ウィンドウが生成され、その検索結果から目的のレコードをクリックすると、選択した社員IDと氏名と住所がテキストボックスへセットされてウィンドウは閉じる、という部分を作成したいです。

おそらくAjax、jQueryあたりを使わないと実現できないと予想していますが、Ajax、jQueryは勉強したことなく、ゼロから作るのは時間がかかりすぎると思っています。

そこで、上記のような動作をする参考コードなどがあれば、それを修正しながら学びたいと考えています。

参考となるものがありましたら教えてください。
よろしくお願いします。

回答の条件
  • 1人5回まで
  • 13歳以上
  • 登録:2013/01/07 22:59:35
  • 終了:2013/01/08 22:24:42

ベストアンサー

id:oil999 No.1

oil999回答回数1728ベストアンサー獲得回数3202013/01/07 23:24:50

ポイント100pt

以下の流れを実装するのであれば、PHPだけで実現できます。

  1. 検索ボタンをクリックする。
  2. データベースに対する前方一致検索を行う。
  3. テキストボックスに表示する。

2と3の間で画面切替は起きますが、1と同じ画面を表示することで、あたかも1の画面のままでテキストボックスに表示するかのように見せかけることができます。

以下のコードを参考にしてください。
http://plog.pya.jp/program/php/lesson10/sample01.html

他1件のコメントを見る
id:oil999

画面切替がないということはAjaxによる非同期通信を行う必要があります。
下記の記事が参考になるでしょう。
http://allabout.co.jp/gm/gc/24104/

2013/01/08 13:08:48
id:kon39392

ありがとうございます。
とても参考になりました。
試してみて、どの方法でいくか検討してみます。

2013/01/08 22:24:06

その他の回答(1件)

id:oil999 No.1

oil999回答回数1728ベストアンサー獲得回数3202013/01/07 23:24:50ここでベストアンサー

ポイント100pt

以下の流れを実装するのであれば、PHPだけで実現できます。

  1. 検索ボタンをクリックする。
  2. データベースに対する前方一致検索を行う。
  3. テキストボックスに表示する。

2と3の間で画面切替は起きますが、1と同じ画面を表示することで、あたかも1の画面のままでテキストボックスに表示するかのように見せかけることができます。

以下のコードを参考にしてください。
http://plog.pya.jp/program/php/lesson10/sample01.html

他1件のコメントを見る
id:oil999

画面切替がないということはAjaxによる非同期通信を行う必要があります。
下記の記事が参考になるでしょう。
http://allabout.co.jp/gm/gc/24104/

2013/01/08 13:08:48
id:kon39392

ありがとうございます。
とても参考になりました。
試してみて、どの方法でいくか検討してみます。

2013/01/08 22:24:06
id:kseikaku No.2

kseikaku回答回数48ベストアンサー獲得回数162013/01/08 14:19:41

ポイント100pt

的が少し外れているかもしれませんが、私なら以下のような実装を行います。

社員IDの欄に以下の頁を参考にsuggest.jsを実装する。
(入力補完ライブラリなので、社員IDを入力していく都度にIDを入力していく程に候補が絞り込まれる感じです)
「suggest.js - 入力補完ライブラリ」
http://www.enjoyxstudy.com/javascript/suggest/

そこで正しい社員IDが入力されてタブキー等でフォッカスが外れたタイミングでイベントをキャッチして、社員IDを元にPHPの検索を行うという感じで作成すると思います。

「event.onblur - フォーカスが外れた時点で発生するイベント」
http://javascriptist.net/ref/event.onblur.html


「[Ajax] POSTされた値をもとにMySQLから検索して結果を返す」
http://blog.aidream.jp/ajax/ajax-post-data-mysql-return-result-102.html

そのものずばりのソースでなくてすみません。

id:kon39392

ありがとうございます。
とても参考になりました。
試してみて、どの方法でいくか検討してみます。

2013/01/08 22:24:13

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません