特許第5814284号(P5814284)IP Force 特許公報掲載プロジェクト 2015.5.11 β版

知財求人 - 知財ポータルサイト「IP Force」

▶ ヤフー株式会社の特許一覧
特許5814284端末装置、表示方法、表示制御プログラム及びサーバ装置
<>
  • 特許5814284-端末装置、表示方法、表示制御プログラム及びサーバ装置 図000002
  • 特許5814284-端末装置、表示方法、表示制御プログラム及びサーバ装置 図000003
  • 特許5814284-端末装置、表示方法、表示制御プログラム及びサーバ装置 図000004
  • 特許5814284-端末装置、表示方法、表示制御プログラム及びサーバ装置 図000005
  • 特許5814284-端末装置、表示方法、表示制御プログラム及びサーバ装置 図000006
  • 特許5814284-端末装置、表示方法、表示制御プログラム及びサーバ装置 図000007
  • 特許5814284-端末装置、表示方法、表示制御プログラム及びサーバ装置 図000008
  • 特許5814284-端末装置、表示方法、表示制御プログラム及びサーバ装置 図000009
  • 特許5814284-端末装置、表示方法、表示制御プログラム及びサーバ装置 図000010
< >
(19)【発行国】日本国特許庁(JP)
(12)【公報種別】特許公報(B2)
(11)【特許番号】5814284
(24)【登録日】2015年10月2日
(45)【発行日】2015年11月17日
(54)【発明の名称】端末装置、表示方法、表示制御プログラム及びサーバ装置
(51)【国際特許分類】
   G06F 13/00 20060101AFI20151029BHJP
   G09G 5/00 20060101ALI20151029BHJP
   G06F 3/048 20130101ALI20151029BHJP
【FI】
   G06F13/00 550A
   G09G5/00 530H
   G09G5/00 510H
   G09G5/00 555D
   G06F3/048 651A
【請求項の数】11
【全頁数】22
(21)【出願番号】特願2013-60620(P2013-60620)
(22)【出願日】2013年3月22日
(65)【公開番号】特開2014-186510(P2014-186510A)
(43)【公開日】2014年10月2日
【審査請求日】2013年12月16日
(73)【特許権者】
【識別番号】500257300
【氏名又は名称】ヤフー株式会社
(74)【代理人】
【識別番号】100089118
【弁理士】
【氏名又は名称】酒井 宏明
(74)【代理人】
【識別番号】100125612
【弁理士】
【氏名又は名称】中嶋 裕昭
(72)【発明者】
【氏名】浅野 俊策
【審査官】 古河 雅輝
(56)【参考文献】
【文献】 特開2005−352652(JP,A)
【文献】 特開2005−141408(JP,A)
【文献】 特開2012−133596(JP,A)
【文献】 特開2009−259230(JP,A)
【文献】 特開2003−016266(JP,A)
【文献】 特開2002−074249(JP,A)
【文献】 特開2006−018667(JP,A)
【文献】 特開2010−218369(JP,A)
【文献】 特開2013−140433(JP,A)
(58)【調査した分野】(Int.Cl.,DB名)
G06F 3/01
G06F 3/048 − 3/0482
G06F 3/0485
G06F 3/0487− 3/0489
G06F 13/00
G06F 15/00
G06F 19/00 −19/28
G06Q 10/00 −90/00
G09G 5/00
(57)【特許請求の範囲】
【請求項1】
端末装置であって、
前記端末装置に表示されている入力画面に含まれる入力欄に対して任意の情報を入力する入力操作を受け付ける入力受付手段と、
前記入力操作が行われた前記入力画面に含まれる前記各入力欄の全てが当該入力欄の入力要件を満たす場合に、前記入力画面を表示させた状態で前記各入力欄の全てを編集不可能な状態に動的に制御した当該入力画面を確認画面として表示する画面制御手段と、
を備えたことを特徴とする端末装置。
【請求項2】
前記画面制御手段は、
前記入力画面を提供するサーバ装置に対して、前記入力欄に入力された入力情報を非同期通信により送信するとともに、当該入力情報が前記入力要件を満たすか否かを示す検証結果を前記サーバ装置から非同期通信により受信する非同期通信手段と、
前記非同期通信手段によって受信された検証結果が前記入力要件を満たすことを示す場合に、前記入力欄を編集不可能な状態に制御する編集制御手段と
を備えたことを特徴とする請求項1に記載の端末装置。
【請求項3】
前記画面制御手段は、
前記非同期通信手段によって受信された検証結果が前記入力要件を満たさないことを示す場合に、前記入力画面を表示させた状態で当該検証結果を前記入力画面に動的に表示する検証結果表示手段
をさらに備えたことを特徴とする請求項2に記載の端末装置。
【請求項4】
前記入力受付手段は、
前記入力欄が編集不可能な状態に制御されている前記入力画面において画面状態を戻す操作を受け付け、
前記編集制御手段は、
前記入力受付手段によって画面状態を戻す操作が受け付けられた場合に、前記入力欄を編集可能な状態に制御する
ことを特徴とする請求項2又は3に記載の端末装置。
【請求項5】
前記入力受付手段は、
前記入力画面に含まれる複数の入力欄に対して入力操作を受け付け、
前記非同期通信手段は、
前記複数の入力欄のいずれかに情報が入力されるたびに、入力された入力情報を前記サーバ装置に送信するとともに、当該入力情報の検証結果を前記サーバ装置から受信し、
前記編集制御手段は、
前記非同期通信手段によって受信された検証結果に基づいて、前記入力画面に含まれる入力欄毎に編集可否を制御する
ことを特徴とする請求項2〜4のいずれか一つに記載の端末装置。
【請求項6】
前記編集制御手段は、
編集不可能な状態に制御した入力欄を編集不可能であることを識別可能な状態で表示する
ことを特徴とする請求項2〜5のいずれか一つに記載の端末装置。
【請求項7】
前記入力受付手段は、
前記入力画面への入力操作が完了した旨の完了操作を受け付け、
前記非同期通信手段は、
前記入力受付手段によって完了操作が受け付けられた場合に、前記サーバ装置に前記入力情報を非同期通信により送信する
ことを特徴とする請求項2〜6のいずれか一つに記載の端末装置。
【請求項8】
端末装置が実行する表示方法であって、
前記端末装置に表示されている入力画面に含まれる入力欄に対して任意の情報を入力する入力操作を受け付ける入力受付手段と、
前記入力操作が行われた前記入力画面に含まれる前記各入力欄の全てが当該入力欄の入力要件を満たす場合に、前記入力画面を表示させた状態で前記各入力欄の全てを編集不可能な状態に動的に制御した当該入力画面を確認画面として表示する画面制御手段と、
を含んだことを特徴とする表示方法。
【請求項9】
任意の情報が入力される入力欄を含む入力画面を所定の表示装置に表示する手順と、
前記入力画面を提供するサーバ装置に対して、前記入力欄に入力された入力情報を非同期通信により送信するとともに、前記各入力欄の全てが当該各入力欄の入力要件を満たすか否かを示す検証結果を前記サーバ装置から非同期通信により受信する手順と、
前記検証結果が前記入力要件を満たすことを示す場合に、前記表示装置に前記入力画面を表示させた状態で前記各入力欄の全てを編集不可能な状態に動的に制御した当該入力画面を確認画面として表示する手順と
をコンピュータに実行させることを特徴とする表示制御プログラム。
【請求項10】
任意の情報が入力される入力欄を含む入力画面の取得要求を端末装置から受信する受信手段と、
前記受信手段によって取得要求が受信された場合に、前記入力欄の全てが当該各入力欄の入力要件を満たすと判定された際に前記入力画面を表示させた状態で前記各入力欄の全てを編集不可能な状態に動的に制御した当該入力画面を確認画面として表示する表示制御プログラムが組み込まれた入力画面を前記端末装置に配信する配信手段と
を備えたことを特徴とするサーバ装置。
【請求項11】
前記端末装置から前記入力欄に入力された入力情報を非同期通信により受信するとともに、当該入力情報が前記入力要件を満たすか否かを示す検証結果を前記端末装置に非同期通信により送信する非同期通信手段
をさらに備えたことを特徴とする請求項10に記載のサーバ装置。
【発明の詳細な説明】
【技術分野】
【0001】
本発明は、端末装置、表示方法、表示制御プログラム及びサーバ装置に関する。
【背景技術】
【0002】
ウェブサーバ等によってユーザ端末に配信されるウェブページとして、ユーザに各種情報を入力させる入力画面を形成するウェブページが知られている。例えば、ウェブサーバは、ユーザを会員登録させる場合などに、氏名、住所、年齢、メールアドレス等を入力させるためのウェブページを配信する場合がある。
【0003】
この種のウェブページを配信するウェブサーバは、入力画面において入力情報を入力する入力操作が行われ、更に入力情報を送信する操作が行われた場合に、ユーザ端末から入力情報を受信し、受信した入力情報が入力要件を満たしているか否かを検証する。例えば、ウェブサーバは、必須項目に情報が入力されているかを検証したり、使用可能な文字種(半角数字、半角英字など)のみが入力されているかを検証したりする。そして、ウェブサーバは、検証結果に問題がない場合には、入力情報が表示される確認画面用のウェブページをユーザ端末に配信することで、入力情報に誤りがないかをユーザに最終確認させる。そして、ウェブサーバは、確認画面において登録操作が行われた場合に、入力情報を用いて会員登録等の各種処理を行う。
【先行技術文献】
【特許文献】
【0004】
【特許文献1】特開2011−072729号公報
【発明の概要】
【発明が解決しようとする課題】
【0005】
しかしながら、上記の従来技術では、ウェブページの開発コストが増大する場合があった。具体的には、上記の従来技術では、各入力画面に対応する確認画面用を用意する必要があるので、確認画面用のウェブページを開発するための作業工数が増大することとなる。特に、多くの種類の入力画面を配信するサービスを提供するような場合には、多くの種類の入力画面に対応する確認画面を要するので、開発コストの増大を招く。
【0006】
本願は、上記に鑑みてなされたものであって、ウェブページの開発コストを低減することができる端末装置、表示方法、表示制御プログラム及びサーバ装置を提供することを目的とする。
【課題を解決するための手段】
【0007】
本願に係る端末装置は、入力画面に含まれる入力欄に対して任意の情報を入力する入力操作を受け付ける入力受付手段と、前記入力操作において前記入力欄に入力された入力情報が当該入力欄の入力要件を満たす場合に、当該入力欄が編集不可能な状態に制御された前記入力画面を確認画面として表示する画面制御手段と、を備えたことを特徴とする。
【発明の効果】
【0008】
実施形態の一態様によれば、ウェブページの開発コストを低減することができるという効果を奏する。
【図面の簡単な説明】
【0009】
図1図1は、実施形態に係るウェブページ表示処理の一例を示す説明図である。
図2図2は、実施形態に係るウェブページ表示処理の一例を示す説明図である。
図3図3は、実施形態に係る端末装置の構成例を示す図である。
図4図4は、実施形態に係るウェブサーバの構成例を示す図である。
図5図5は、実施形態に係るウェブシステムによる処理手順を示すシーケンス図である。
図6図6は、実施形態に係る端末装置による表示処理手順を示すフローチャートである。
図7図7は、実施形態に係るウェブページ表示処理の一例を示す説明図である。
図8図8は、実施形態に係るウェブページ表示処理の一例を示す説明図である。
図9図9は、実施形態に係るウェブページ表示処理の一例を示す説明図である。
【発明を実施するための形態】
【0010】
以下に、本願に係る端末装置、表示方法、表示制御プログラム及びサーバ装置を実施するための形態(以下、「実施形態」と呼ぶ)について図面を参照しつつ詳細に説明する。なお、この実施形態により本願に係る端末装置、表示方法、表示制御プログラム及びサーバ装置が限定されるものではない。また、以下の各実施形態において同一の部位には同一の符号を付し、重複する説明は省略される。
【0011】
〔1.ウェブページ表示処理〕
まず、図1を用いて、実施形態に係るウェブページ表示処理の一例について説明する。図1は、実施形態に係るウェブページ表示処理の一例を示す説明図である。図1の例では、ウェブシステム1によってウェブページの表示処理が行われる。
【0012】
図1に示すように、ウェブシステム1には、端末装置100と、ウェブサーバ200とが含まれる。端末装置100及びウェブサーバ200は、ネットワークNを介して、有線又は無線により通信可能に接続される。なお、図1に示したウェブシステム1には、複数台の端末装置100や、複数台のウェブサーバ200が含まれてもよい。
【0013】
端末装置100は、例えば、デスクトップ型PC(Personal Computer)や、ノート型PCや、タブレット型端末や、携帯電話機、PDA(Personal Digital Assistant)等の情報処理装置である。かかる端末装置100は、ウェブブラウザを搭載しており、ウェブサーバ200から配信される各種ウェブページを表示する。なお、端末装置100に搭載されるウェブブラウザは、非同期通信を利用するAjax(Asynchronous Javascript(登録商標) And XML)に対応しているものとする。
【0014】
ウェブサーバ200は、各種ウェブページを端末装置100に配信するサーバ装置である。ウェブサーバ200によって配信されるウェブページは、例えば、HTML(HyperText Markup Language)や、JavaScript(登録商標)や、CSS(Cascading Style Sheets)等により記述されたHTMLファイルに該当する。このようなウェブサーバ200は、例えば、ショッピングサイトやオークションサイト等の各種サービスを提供しており、これらのサービスを提供するためにユーザに会員登録を行わせる場合がある。そして、ウェブサーバ200は、会員登録時に要するユーザ情報を入力させるためのウェブページ(すなわち、入力画面)を配信する。
【0015】
実施形態に係るウェブシステム1では、入力画面と、入力画面に入力された入力情報をユーザに確認させるための確認画面とを1個のウェブページに兼用させる。これにより、実施形態に係るウェブシステム1は、ウェブページの開発コストを低減することを実現する。この点について図1の例を用いて説明する。
【0016】
図1(a)に示すように、端末装置100が、ウェブサーバ200から取得したウェブページW10を表示しているものとする。ウェブページW10は、各種情報をユーザに入力させるための入力画面であって、入力欄T11〜T17や、中止ボタンB11や、確認ボタンB12などが含まれる。入力欄T11〜T14は、「メールアドレス」、「ユーザID」、「パスワード」、「郵便番号」が入力されるテキストボックスに該当し、入力欄T15は、「都道府県」が選択されるプルダウンに該当し、入力欄T16は、「性別」が選択されるチェックボックスに該当し、入力欄T17は、「メールマガジンの配信有無」が指定されるチェックボックスに該当する。また、中止ボタンB11は、ウェブページW10への情報入力を中止するためのボタンに該当し、確認ボタンB12は、ウェブページW10に入力した入力情報をウェブサーバ200に送信させるためのボタンに該当する。
【0017】
続いて、図1(b)に示すように、ユーザが、入力欄T11〜T17に各種情報を入力した後に、確認ボタンB12を押下したものとする。かかる場合に、実施形態に係る端末装置100は、Ajax等による非同期通信により、入力欄T11〜T17に入力された各入力情報をウェブサーバ200に送信する。図1(b)の例の場合、端末装置100は、メールアドレス「aaa@sample」やユーザID「sample」などの入力情報を非同期通信によりウェブサーバ200に送信する。なお、端末装置100は、Ajaxによる非同期通信を用いる場合には、入力欄T11〜T17に入力された各入力情報を含むXMLHttpリクエストをウェブサーバ200に送信する。このような端末装置100による非同期通信は、例えば、ウェブページW10を形成するHTMLファイルに記述されるJavascript等によって実現される。
【0018】
続いて、ウェブサーバ200は、端末装置100から入力情報を受信した場合に、受信した各入力情報が入力要件を満たしているか否かを検証する。具体的には、ウェブページW10に含まれる入力欄T11〜T17は、「使用可能な文字種(半角数字、半角英字、全角数字、全角英字、ひらがな、カタカナ、記号、漢字など)」、「最低文字数」、「最高文字数」、「必須項目であるか否か」などの入力要件が予め決められている。ウェブサーバ200は、端末装置100から受信した入力情報毎に、かかる入力情報が入力要件を満たすか否かを検証し、検証結果を端末装置100に送信する。なお、このような検証処理は、バリデーションチェック等と呼ばれることがある。
【0019】
図1の例では、ウェブサーバ200が、全ての入力情報が入力要件を満たすことを示す検証結果を端末装置100に送信するものとする。この場合、端末装置100は、図1(c)に示すように、ダイナミックHTMLと呼ばれる技術により、表示中のウェブページW10の一部分を動的(ダイナミック)に書き換えることで、ウェブサーバ200から受信した検証結果をウェブページW10に反映させる。
【0020】
具体的には、端末装置100は、全ての入力情報が入力要件を満たしている場合には、入力欄T11〜T17を編集不可能な状態に制御するとともに、入力欄T11〜T17の表示色を変更する。具体的には、端末装置100は、入力欄T11〜T17に入力情報を表示しつつ、かかる入力情報が編集不可能となるように入力欄T11〜T17を制御する。また、端末装置100は、ウェブページW10が確認画面であることをユーザに認識させるためのテキストを表示枠T21に表示する。また、端末装置100は、図1(b)で表示されていた中止ボタンB11及び確認ボタンB12を非表示にするとともに、戻るボタンB13及び確定ボタンB14を表示する。このような端末装置100による各種処理は、例えば、ウェブページW10を形成するHTMLファイルに記述されるJavascriptやCSS等によって実現される。
【0021】
このように、端末装置100は、全ての入力情報が入力要件を満たす場合に、入力画面として用いたウェブページW10の入力欄T11〜T17を編集不可能な状態に動的に変更することで、ウェブページW10自体を確認画面として用いる。言い換えれば、端末装置100は、画面遷移や再読み込み(リロード)を発生させることなく、ウェブページW10を入力画面から確認画面に切り替える。これにより、実施形態に係るウェブシステム1では、ウェブページW10に対応する確認画面用のウェブページを要しないので、ウェブページの開発コストを低減することができる。また、端末装置100は、入力欄T11〜T17の表示色を変更することで、編集不可能であることをユーザに認識させることができるので、ウェブページW10が確認画面であることをユーザに認識させることができる。すなわち、実施形態に係るウェブシステム1では、異なるウェブページによって入力画面と確認画面とが構成される従来のユーザインタフェースと同様の操作感をユーザに提供することができる。
【0022】
なお、上記では説明を省略したが、図1(c)に示した状態において戻るボタンB13が押下された場合、図1(b)に示した状態のウェブページW10に戻す。具体的には、端末装置100は、入力欄T11〜T17を編集可能な状態に制御するとともに、入力欄T11〜T17の表示色を元の状態(入力画面時の状態)に戻す。このときも、端末装置100は、画面遷移や再読み込み(リロード)を発生させることなく、ウェブページW10を確認画面から入力画面に切り替える。
【0023】
また、図1(c)に示した状態において確定ボタンB14が押下された場合、端末装置100は、入力欄T11〜T17に入力された入力情報をHTTPリクエスト等によりウェブサーバ200に送信する。これにより、端末装置100は、ウェブサーバ200から登録完了用のウェブページ等を受信し、受信した登録完了用のウェブページを表示する。
【0024】
また、図1では、全ての入力情報が入力要件を満たす例を示したが、端末装置100は、入力情報が入力要件を満たさない場合には、ウェブページW10の一部分を動的に書き換えることにより、エラーメッセージをウェブページW10に表示する。この点について図2を用いて説明する。
【0025】
図2(a)は、図1(a)に示した状態と同様である。この状態において、図2(b)に示すように、ユーザが各種情報を入力した後に、確認ボタンB12を押下したものとする。この例では、ユーザは、メールアドレスの入力欄T11には情報を入力せず、また、郵便番号の入力欄T14に「abc」といった情報を入力している。ここでは、メールアドレスの入力欄T11が入力必須項目であり、郵便番号の入力欄T14には「半角数字」及び「半角のハイフン記号」のみが入力可能であるものとする。この場合、ウェブサーバ200は、入力欄T11に情報が入力されていない点と、入力欄T14に入力された情報「abc」が不正である点とを検出し、このような検証結果を端末装置100に非同期通信により送信する。
【0026】
そして、端末装置100は、入力要件を満たしていない旨の検証結果をウェブサーバ200から受信した場合には、表示中のウェブページW10の一部分を動的に書き換えることで、検証結果をウェブページW10に表示する。具体的には、端末装置100は、図2(c)に示すように、「『メールアドレス』は必須項目です。」、「『郵便番号』は数値のみ入力可能です。」といったエラーメッセージを表示枠T22に表示する。このような端末装置100によるエラーメッセージ表示処理は、例えば、ウェブページW10を形成するHTMLファイルに記述されるJavascriptやCSS等によって実現される。なお、図2(c)の例において、端末装置100は、図1(c)の例とは異なり、入力欄T11〜T17を編集不可能な状態に制御する処理や、入力欄T11〜T17の表示色を変更する処理や、戻るボタンB13及び確定ボタンB14を表示する処理を行わない。
【0027】
このように、端末装置100は、入力要件を満たさない入力情報が存在する場合に、ウェブページW10を動的に書き換えることでエラーメッセージを表示する。言い換えれば、端末装置100は、画面遷移させることなく、ウェブページW10を入力画面からエラーメッセージを含む入力画面に切り替える。これにより、実施形態に係るウェブシステム1では、入力画面であるウェブページW10に対応するエラーメッセージ表示用のウェブページを要しないので、ウェブページの開発コストを低減することができる。
【0028】
以上のように、実施形態に係るウェブシステム1によれば、1個のウェブページが、入力画面と、確認画面と、エラーメッセージを含む入力画面とを兼用するので、ウェブページの開発コストを低減することができる。以下、このような表示処理を行う端末装置100及びウェブサーバ200について詳細に説明する。
【0029】
〔2.端末装置の構成〕
次に、図3を用いて、実施形態に係る端末装置100の構成について説明する。図3は、実施形態に係る端末装置100の構成例を示す図である。図3に示すように、端末装置100は、通信部110と、表示部120と、入力部130と、制御部140とを有する。
【0030】
(通信部110について)
通信部110は、ネットワークNに接続され、ネットワークNを介して、ウェブサーバ200との間で情報の送受信を行う。かかる通信部110は、ネットワークNとの接続を有線又は無線で行う。
【0031】
(表示部120、入力部130について)
表示部120は、各種情報を表示するための表示デバイスである。例えば、表示部120は、液晶ディスプレイ等によって実現される。入力部130は、ユーザから各種操作を受け付ける入力デバイスである。例えば、入力部130は、キーボードやマウス等によって実現される。
【0032】
(制御部140について)
制御部140は、例えば、CPU(Central Processing Unit)やMPU(Micro Processing Unit)等によって、端末装置100内部の記憶装置に記憶されているウェブブラウザ等と呼ばれるアプリケーションプログラム(表示制御プログラムの一例に相当)がRAM(Random Access Memory)を作業領域として実行されることにより実現される。また、制御部140は、例えば、ASIC(Application Specific Integrated Circuit)やFPGA(Field Programmable Gate Array)等の集積回路により実現される。
【0033】
かかる制御部140は、図3に示すように、要求部141と、入力受付部142と、画面制御部150とを有し、以下に説明する情報処理の機能や作用を実現または実行する。なお、制御部140の内部構成は、図3に示した構成に限られず、後述する情報処理を行う構成であれば他の構成であってもよい。また、制御部140内部の各処理部の接続関係は、図3に示した接続関係に限られず、他の接続関係であってもよい。
【0034】
(要求部141について)
要求部141は、入力部130を用いたユーザ操作に従って、ウェブサーバ200にウェブページの取得要求(HTTPリクエスト)を送信する。そして、要求部141は、かかる取得要求に応答してウェブサーバ200から送信されるウェブページを取得する。
【0035】
(入力受付部142について)
入力受付部142は、表示部120に表示されているウェブページに対して各種操作を受け付ける。例えば、入力受付部142は、図1及び図2に例示したような入力画面に含まれる入力欄に任意の情報を入力する入力操作を受け付ける。また、入力受付部142は、図1及び図2に例示したような中止ボタンB11、確認ボタンB12、戻るボタンB13、確定ボタンB14などを押下する押下操作を受け付ける。
【0036】
(画面制御部150について)
画面制御部150は、要求部141によって取得されたウェブページを表示部120に表示する。また、画面制御部150は、表示中のウェブページに入力された入力情報を非同期通信によりウェブサーバ200に送信する処理や、表示中のウェブページを動的に書き換える処理などを行う。
【0037】
このような画面制御部150は、図3に示すように、非同期通信部151と、編集制御部152と、検証結果表示部153とを有する。これらの非同期通信部151、編集制御部152、及び、検証結果表示部153は、JavaScript(登録商標)やCSSが記述されたHTMLファイルがRAM(Random Access Memory)を作業領域として実行されることにより実現される。
【0038】
(非同期通信部151について)
非同期通信部151は、ウェブサーバ200との間でAjax等による非同期通信を行う。具体的には、非同期通信部151は、画面遷移やウェブページのリロードを発生させることなく、ウェブページに入力された入力情報を非同期通信によりウェブサーバ200に送信し、また、ウェブサーバ200から入力情報の検証結果を非同期通信により受信する。例えば、非同期通信部151は、Ajaxによる非同期通信を用いる場合には、各入力情報を含むXMLHttpリクエストをウェブサーバ200に送信し、XMLHttpリクエストの応答として検証結果を受信する。
【0039】
なお、実施形態に係る非同期通信部151は、入力完了操作がユーザにより行われた場合に、非同期通信により入力情報をウェブサーバ200に送信する。例えば、図1及び図2に示した例において、非同期通信部151は、ウェブページW10内の確認ボタンB12を押下する操作(言い換えれば、入力情報をウェブサーバ200に送信する旨の送信操作)が行われた場合に、入力欄T11〜T17に入力された入力情報を非同期通信によりウェブサーバ200に送信する。
【0040】
ここで、非同期通信部151によって送信される情報の一例を説明する。非同期通信部151は、ウェブページに含まれる各入力欄を識別するための入力欄識別子である「キー(key)」と、かかる入力欄に入力された入力情報である「バリュー(value)」との組合せをウェブサーバ200に送信する。例えば、図1及び図2に示した入力欄T11〜T13のキーがそれぞれ「mail」、「userid」、「passwd」であるものとする。この場合、非同期通信部151は、図1(b)に示した状態で確認ボタンB12が押下された際に、キー「mail」及びバリュー「aaa@sample」の組合せと、「userid」及びバリュー「sample」の組合せと、「passwd」及びバリュー「********(実際に入力されたパスワード「12345678」など)」の組合せとをウェブサーバ200に送信する。また、ここでは説明を省略したが、非同期通信部151は、他の入力欄T14〜T17についても同様にキー及びバリューの組合せをウェブサーバ200に送信する。
【0041】
そして、非同期通信部151は、キーと検証結果との組合せをウェブサーバ200から受信する。例えば、非同期通信部151は、上記例のようにキー及びバリューを送信した場合には、キー「mail」に対応する検証結果として、入力要件を満たすことを示す情報を受信する。同様に、非同期通信部151は、キー「userid」及び「passwd」などの他の項目についても検証結果を受信する。
【0042】
また、例えば、非同期通信部151は、図2(b)に示した例のように、メールアドレスの入力欄T11に情報が入力されなかった場合には、キー「mail」と空(情報なし)のバリューとの組合せをウェブサーバ200に送信するか、または、キー「mail」とバリューとの組合せ自体をウェブサーバ200に送信しない。この場合、非同期通信部151は、例えば、キー「mail」に対応する検証結果として、入力必須項目に情報が入力されていないことを示すエラー情報をウェブサーバ200から受信する。
【0043】
また、上記例に限られず、非同期通信部151は、ウェブサーバ200からキーについては受信せずに、検証結果のみを受信することもできる。この場合、非同期通信部151は、予め決められている入力欄の順に、所定の区切り文字(例えば、カンマ「、」など)で区切られた検証結果の羅列を受信する。例えば、ウェブサーバ200から送信される検証結果が、キー「mail」、「userid」、「passwd」の順に羅列されることが決められているものとする。かかる場合、非同期通信部151は、ウェブサーバ200から、検証結果として「(必須項目に違反している旨の情報)、(入力要件を満たす旨の情報)、(入力要件を満たす旨の情報)」などを受信する。この例では、先頭の「(必須項目に違反している旨の情報)」がキー「mail」に対応する検証結果を示し、2番目の「(入力要件を満たす旨の情報)」がキー「userid」に対応する検証結果を示し、3番目の「(入力要件を満たす旨の情報)」がキー「passwd」に対応する検証結果を示す。
【0044】
(編集制御部152について)
編集制御部152は、ダイナミックHTMLと呼ばれる技術等により、表示部120に表示されているウェブページの遷移やリロードを発生させることなく、ウェブページに含まれる各入力欄の編集可否を動的に制御する。具体的には、編集制御部152は、非同期通信部151がウェブサーバ200から受信した検証結果に基づいて、ウェブページに入力された全ての入力情報が入力要件を満たしているか否かを判定する。そして、編集制御部152は、全ての入力情報が入力要件を満たしている場合に、表示部120に表示されているウェブページの各入力欄を編集不可能な状態に制御する。このとき、編集制御部152は、編集不可能な状態に制御した入力欄を編集不可能であることを識別可能な状態で表示する。例えば、編集制御部152は、図1に示した例のように、一般的に入力不可能であることをユーザに想起させるような色(灰色など)に各入力欄の表示色を変更する。
【0045】
また、編集制御部152は、各入力欄を編集不可能な状態に制御した画面において、画面状態を戻す操作が行われた場合には、各入力欄を編集可能な状態に制御する。例えば、編集制御部152は、図1(c)に示した状態において戻るボタンB13が押下された場合に、入力欄T11〜T17を編集可能な状態に戻すとともに、入力欄T11〜T17の表示色を情報入力時の色に戻す。
【0046】
(検証結果表示部153について)
検証結果表示部153は、非同期通信部151がウェブサーバ200から受信した検証結果に基づいて、表示部120に表示されているウェブページの一部分を動的に書き換える。具体的には、検証結果表示部153は、入力要件を満たしていない入力情報が存在する場合には、検証結果からエラーメッセージを生成し、生成したエラーメッセージをウェブページに表示する。このとき、検証結果表示部153は、表示部120に表示されているウェブページの遷移やリロードを発生させることなく、エラーメッセージをウェブページに表示する。
【0047】
また、検証結果表示部153は、全ての入力情報が入力要件を満たしている場合には、例えば図1(c)に示した例のように、ウェブページが確認画面であることを示すテキストを表示したり、各種ボタンの表示切替を行ったりする。
【0048】
ここで、検証結果表示部153による検証結果の表示処理について説明する。例えば、上述した例のように、非同期通信部151が、キー「mail」、「userid」、「passwd」に対応する検証結果として、「(必須項目に違反している旨の情報)、(入力要件を満たす旨の情報)、(入力要件を満たす旨の情報)」を受信したものとする。この場合、検証結果表示部153は、例えば、キー「mail」に対応する検証結果「(必須項目に違反している旨の情報)」に基づいて、図2(c)に例示したようなエラーメッセージ「『メールアドレス』は必須項目です。」を生成する。そして、検証結果表示部153は、表示部120に表示されているウェブページW10を動的に書き換えることにより、生成したエラーメッセージをウェブページW10の表示枠T22に表示する。
【0049】
また、例えば、非同期通信部151が、全てのキーに対応する検証結果について、入力要件を満たす旨の情報を受信したものとする。この場合、検証結果表示部153は、ウェブページW10を動的に書き換えることにより、図1(c)に例示したようなテキスト「以下の内容で登録を行います。・・・」をウェブページW10の表示枠T21に表示する。また、検証結果表示部153は、図1(c)に示した例のように、中止ボタンB11及び確認ボタンB12を非表示にするとともに、戻るボタンB13及び確定ボタンB14を表示する。
【0050】
〔3.ウェブサーバの構成〕
次に、図4を用いて、実施形態に係るウェブサーバ200の構成について説明する。図4は、実施形態に係るウェブサーバ200の構成例を示す図である。図4に示すように、ウェブサーバ200は、通信部210と、コンテンツ記憶部220と、制御部230とを有する。
【0051】
(通信部210について)
通信部210は、ネットワークNに接続され、ネットワークNを介して、端末装置100との間で情報の送受信を行う。かかる通信部210は、ネットワークNとの接続を有線又は無線で行う。
【0052】
(コンテンツ記憶部220について)
コンテンツ記憶部220は、例えば、RAM(Random Access Memory)、フラッシュメモリ(Flash Memory)等の半導体メモリ素子、または、ハードディスク、光ディスク等の記憶装置によって実現される。かかるコンテンツ記憶部220は、コンテンツの一例として、ウェブページやウェブページを形成する部品を記憶する。例えば、コンテンツ記憶部220は、ウェブページを形成するHTMLファイルや、ウェブページに掲載される画像データなどを記憶する。
【0053】
(制御部230について)
制御部230は、例えば、CPUやMPU等によって、端末装置100内部の記憶装置に記憶されている各種プログラムがRAMを作業領域として実行されることにより実現される。また、制御部230は、例えば、ASICやFPGA等の集積回路により実現される。
【0054】
かかる制御部230は、図4に示すように、要求受信部231と、配信部232と、非同期通信部233と、検証部234とを有し、以下に説明する情報処理の機能や作用を実現または実行する。なお、制御部230の内部構成は、図4に示した構成に限られず、後述する情報処理を行う構成であれば他の構成であってもよい。また、制御部230内部の各処理部の接続関係は、図4に示した接続関係に限られず、他の接続関係であってもよい。
【0055】
(要求受信部231について)
要求受信部231は、端末装置100の要求部141によって送信されるウェブページの取得要求(HTTPリクエスト等)を受信する。そして、要求受信部231は、端末装置100から受信した取得要求を配信部232に出力する。
【0056】
(配信部232について)
配信部232は、要求受信部231によって受信された取得要求において要求されているウェブページをコンテンツ記憶部220から取得し、取得したウェブページを端末装置100に配信する。例えば、配信部232は、端末装置100の画面制御部150による処理を実現する表示制御プログラムが組み込まれたウェブページを配信する。かかる表示制御プログラムは、例えば、ウェブページに記述されたJavascriptやCSS等のソースコードに該当する。
【0057】
(非同期通信部233について)
非同期通信部233は、端末装置100との間で非同期通信を行う。具体的には、非同期通信部233は、端末装置100の非同期通信部151から、ウェブページに入力された入力情報を受信し、受信した入力情報を検証部234に出力する。そして、非同期通信部233は、検証部234による検証結果を端末装置100に非同期通信により送信する。
【0058】
(検証部234について)
検証部234は、非同期通信部233によって受信された各入力情報について、入力要件を満たすか否かを検証する。具体的には、配信部232によって配信されるウェブページ内の各入力欄は、予め入力要件が決められている。例えば、キー「mail」の入力要件として、「必須項目」、「半角英数字、及び、所定の記号(例えば、「@」や「−」)のみ使用可能」などが予め決められている。検証部234は、端末装置100から送信されたキーとバリューとの組合せ毎に、バリュー(入力情報)が、キーに対応する入力要件を満たすか否かを判定する。そして、検証部234は、例えば「入力要件を満たす」、「必須項目違反」、「指定文字違反(使用不可能な文字種が入力されている)」といった検証結果を生成し、生成した検証結果を非同期通信部233に出力する。これにより、非同期通信部233によって、検証結果が端末装置100に送信されることとなる。
【0059】
〔4.ウェブシステムによる処理手順〕
次に、図5を用いて、実施形態に係るウェブシステム1による処理の手順について説明する。図5は、実施形態に係るウェブシステム1による処理手順を示すシーケンス図である。
【0060】
図5に示すように、端末装置100の要求部141は、ユーザ操作に従って、ウェブページの取得要求をウェブサーバ200に送信する(ステップS101)。これにより、ウェブサーバ200の要求受信部231は、端末装置100からウェブページの取得要求を受信する。
【0061】
続いて、ウェブサーバ200の配信部232は、端末装置100から受信した取得要求において要求されているウェブページを端末装置100に配信する(ステップS102)。なお、ここでは、配信部232は、図1及び図2に例示したように、各種情報が入力される入力欄を含むウェブページを配信するものとする。
【0062】
続いて、端末装置100の画面制御部150は、ウェブサーバ200から受信したウェブページを表示部120に表示する(ステップS103)。そして、端末装置100の入力受付部142が、表示部120に表示されているウェブページに対して任意の情報を入力する入力操作を受け付けた後に(ステップS104)、入力情報をウェブサーバ200に送信する旨の送信操作(例えば、確認ボタンB12を押下する操作)を受け付けたものとする(ステップS105)。かかる場合に、端末装置100の非同期通信部151は、ウェブページに入力された各入力情報を非同期通信によりウェブサーバ200に送信する(ステップS106)。
【0063】
続いて、ウェブサーバ200の検証部234は、端末装置100から受信した各入力情報について、入力要件を満たしているか否かを検証する(ステップS107)。続いて、ウェブサーバ200の非同期通信部233は、検証部234によって検証された各入力情報の検証結果を非同期通信により端末装置100に送信する(ステップS108)。
【0064】
そして、端末装置100の画面制御部150は、ウェブサーバ200から受信した検証結果に基づいて、表示部120に表示されているウェブページを動的に書き換える(ステップS109)。かかるステップS109における処理については図6を用いて説明する。
【0065】
〔5.端末装置による表示処理手順〕
次に、図6を用いて、実施形態に係る端末装置100による表示処理の手順について説明する。図6は、実施形態に係る端末装置100による表示処理手順を示すフローチャートである。なお、図6では、入力欄を含むウェブページが表示部120に表示されている状態であるものとする。
【0066】
図6に示すように、端末装置100の入力受付部142は、ウェブページに入力された入力情報を送信する旨の送信操作を受け付けたか否かを判定する(ステップS201)。そして、非同期通信部151は、入力受付部142によって送信操作が受け付けられた場合に(ステップS201;Yes)、ウェブページに入力された各入力情報を非同期通信によりウェブサーバ200に送信する(ステップS202)。
【0067】
続いて、非同期通信部151は、ウェブサーバ200から入力情報の検証結果を受信したか否か判定する(ステップS203)。そして、非同期通信部151によって検証結果が受信された場合に(ステップS203;Yes)、編集制御部152は、かかる検証結果に基づいて、全ての入力情報が入力要件を満たしているか否かを判定する(ステップS204)。そして、編集制御部152は、全ての入力情報が入力要件を満たしている場合に(ステップS204;Yes)、表示部120に表示されているウェブページ内の各入力欄を編集不可能な状態に制御する(ステップS205)。
【0068】
同様に、検証結果表示部153は、ウェブサーバ200から受信した検証結果に基づいて、全ての入力情報が入力要件を満たしているか否かを判定する(ステップS204)。そして、検証結果表示部153は、入力要件を満たしていない入力情報が存在する場合に(ステップS204;No)、かかる検証結果からエラーメッセージを生成し、生成したエラーメッセージをウェブページに表示する(ステップS206)。
【0069】
なお、ユーザは、エラーメッセージが表示されている入力画面において入力済みの情報を修正することができる。この場合、端末装置100及びウェブサーバ200は、図5に示したステップS104〜S109、及び、図6に示した処理手順を再度行うこととなる。
【0070】
また、図6に示した例において、全ての入力情報が入力要件を満たしているか否かを判定する処理は、画面制御部150によって行われてもよいし、図3に図示しない所定の判定部によって行われてもよい。
【0071】
〔6.変形例〕
上述した実施形態に係るウェブシステム1は、上記実施形態以外にも種々の異なる形態にて実施されてよい。そこで、以下では、上記のウェブシステム1の他の実施形態について説明する。
【0072】
〔6−1.入力情報の送信タイミング(1)〕
上記実施形態では、端末装置100が、入力完了操作を受け付けた場合に(例えば、確認ボタンB12が押下された場合に)、入力情報をウェブサーバ200に送信する例を示した。しかし、この例に限られず、端末装置100は、入力完了操作を受け付けずに、所定のタイミングで入力情報を自動的にウェブサーバ200へ送信してもよい。例えば、端末装置100は、第1の入力欄に情報が入力された後に、第2の入力欄への情報入力が開始された場合に、第1の入力欄に入力された入力情報をウェブサーバ200に送信してもよい。この点について図7を用いて説明する。
【0073】
図7(a)の例では、メールアドレスの入力欄T11に「aaa@sample」が入力されている。その後に、図7(b)に示すように、ユーザが、ユーザIDを入力するためにカーソルを入力欄T12に移動させたものとする。この場合に、端末装置100の非同期通信部151は、入力対象(アクティブ)の入力欄が入力欄T11から入力欄T12に移動したことを検知し、直前に入力された入力欄T11の入力情報「aaa@sample」を非同期通信によりウェブサーバ200に送信する。
【0074】
そして、ウェブサーバ200の非同期通信部233は、端末装置100から受信した入力情報「aaa@sample」の検証結果を端末装置100に送信する。ここの例では、非同期通信部233は、入力要件を満たす旨の検証結果を送信するものとする。この場合、編集制御部152は、図7(b)に示すように、入力欄T11を編集不可能な状態に制御するとともに、入力欄T11の表示色を変更する。
【0075】
続いて、図7(c)に示すように、ユーザが、ユーザIDの入力欄T12に「あいう」といった情報を入力し、カーソルを入力欄T13に移動させたものとする。そして、非同期通信部151は、入力欄T12に入力された入力情報「あいう」を非同期通信によりウェブサーバ200に送信することで、検証結果として「指定文字違反(使用不可能な文字種が入力されている)」を受信したものとする。この場合、検証結果表示部153は、図7(d)に示すように、「『ユーザID』は数値、半角英数字のみ入力可能です。」といったエラーメッセージを表示枠T22に表示する。なお、図7(d)の例において、編集制御部152は、入力欄T12を編集不可能な状態に制御する処理や、入力欄T12の表示色を変更する処理を行わない。
【0076】
そして、ここでは図示することを省略するが、入力欄T11〜T17の全てに情報が入力され、かつ、全ての入力情報が入力要件を満たす状態となった場合に、検証結果表示部153は、図1(c)に示した例と同様に、表示枠T21に確認画面用のテキストを表示したり、戻るボタンB13や確定ボタンB14を表示したりする。
【0077】
このように、端末装置100は、図1及び図2等に示した実施形態と異なり、全ての入力情報が入力要件を満たしているか否かにかかわらず、入力要件を満たす情報が入力される都度、動的に入力欄を編集不可能な状態に制御し、入力要件を満たしていない情報が入力される都度、動的にエラーメッセージを表示してもよい。これにより、端末装置100は、入力要件を満たしているか否かを即座にユーザに認識させることができるので、ユーザビリティの向上を図ることができる。
【0078】
なお、図7の例では、カーソルが他の入力欄に移動したことを条件に入力情報が送信される例を示したが、非同期通信部151は、カーソルが入力欄から外れたことを条件に、かかる入力欄の入力情報をウェブサーバ200に送信してもよい。
【0079】
また、図7の例において、端末装置100は、編集不可能な状態に制御されている入力欄に対して所定の操作(例えば、入力欄をダブルクリックする操作)を受け付けた場合に、かかる入力欄を編集可能な状態に制御してもよい。これにより、ユーザは、入力要件を満たしている入力情報を修正することができる。
【0080】
〔6−2.入力情報の送信タイミング(2)〕
また、図7の例では、端末装置100が入力欄毎に入力情報を送信する例を示したが、端末装置100は、入力欄のグループ毎に、かかるグループに属する入力欄に入力された入力情報を一括でウェブサーバ200に送信してもよい。この点について図8を用いて説明する。
【0081】
図8の例では、ウェブページW10内の入力欄T11〜T17は、3個のグループ「ID情報」、「お客様情報」、「希望サービス」に分別されており、グループ「ID情報」には入力欄T11〜T13が属し、グループ「お客様情報」には入力欄T14〜T16が属し、グループ「希望サービス」には入力欄T17が属するものとする。ここで、図8(a)に示したように、入力欄T11〜T13に情報が入力され、その後に郵便番号の入力欄T12にカーソルが移動されたものとする。この場合、非同期通信部151は、入力対象(アクティブ)のグループが「ID情報」から「お客様情報」に移動したことを検知し、グループ「ID情報」に属する入力欄T11〜T13に入力された入力情報を非同期通信によりウェブサーバ200に送信する。
【0082】
そして、ウェブサーバ200の非同期通信部233は、端末装置100から受信した各入力情報の検証結果を端末装置100に送信する。ここの例では、非同期通信部233は、全ての入力情報が入力要件を満たす旨の検証結果を送信するものとする。この場合、編集制御部152は、グループ「ID情報」に属する全ての入力欄T11〜T13が入力要件を満たしているので、図8(b)に示すように、入力欄T11〜T13を編集不可能な状態に制御するとともに、入力欄T11〜T13の表示色を変更する。
【0083】
続いて、図8(c)に示すように、ユーザが、郵便番号の入力欄T14に「abc」といった情報を入力するとともに、入力欄T15及びT16についても図示した情報を入力したものとする。そして、非同期通信部151は、入力欄T14〜T16に入力された入力情報を非同期通信によりウェブサーバ200に送信することで、郵便番号の入力欄T14に対応する検証結果として「指定文字違反(使用不可能な文字種が入力されている)」を受信したものとする。この場合、検証結果表示部153は、図8(d)に示すように、「『郵便番号』は数値のみ入力可能です。」といったエラーメッセージを表示枠T22に表示する。このとき、編集制御部152は、グループ「お客様情報」には入力要件を満たしていない入力欄T14が存在するので、グループ「お客様情報」に属する入力欄T14〜T16を編集不可能な状態に制御する処理や、入力欄T14〜T16の表示色を変更する処理を行わない。
【0084】
このように、端末装置100は、入力欄のグループ毎に編集可否の制御を行うことで、ユーザビリティの向上を図ることができる。一例を挙げて説明すると、ウェブページには、例えば郵便番号及び都道府県のように、互いに関連する複数の入力欄が存在する場合がある。この場合、ユーザは、所定の入力欄に情報を入力している最中に、関連する入力済みの情報を修正することもある。一方、ユーザは、関連する全ての入力欄への入力が完了した後には、それらの入力欄に入力した情報を修正する可能性が低い。図8の例では、端末装置100は、互いに関連する全ての入力欄に情報が入力された時点で編集可否の制御を行うので、関連する入力欄群毎に、入力要件を満たしているか否かを即座にユーザに認識させることができ、結果としてユーザビリティの向上を図ることができる。
【0085】
なお、図8の例において、端末装置100は、編集不可能な状態に制御されている入力欄のグループに対して所定の操作(例えば、入力欄をダブルクリックする操作)を受け付けた場合に、かかるグループに属する全ての入力欄を編集可能な状態に制御してもよい。これにより、ユーザは、入力要件を満たしている入力情報を修正することができる。
【0086】
〔6−3.編集可否制御〕
また、上記実施形態では、編集制御部152が、全ての入力情報が入力要件を満たす場合に、全ての入力欄を編集不可能に制御する例を示した。しかし、編集制御部152は、ウェブサーバ200から受信した検証結果に基づいて、入力要件を満たす入力欄については編集不可能な状態に制御し、入力要件を満たしていない入力欄については編集可能な状態に制御してもよい。
【0087】
〔6−4.解除処理〕
また、上記実施形態において、端末装置100の編集制御部152は、各入力欄を編集不可能に制御した場合に、入力欄毎に、編集可能な状態に戻すためのボタンを表示してもよい。この点について図9を用いて説明する。
【0088】
上記の通り、編集制御部152は、ウェブページW10に入力された全ての入力情報が入力要件を満たす場合には、これらの入力情報を編集可能な状態に制御する。このとき、編集制御部152は、図9(a)に示すように、各入力欄に、編集可能な状態に戻すための解除ボタンB21〜B27を表示する。図9(a)の例の場合、解除ボタンB21は、入力欄T11を編集可能な状態に戻すためのボタンに該当する。同様に、他の解除ボタンB22〜B27は、それぞれ入力欄T12〜T17を編集可能な状態に戻すためのボタンに該当する。例えば、編集制御部152は、解除ボタンB21が押下された場合には、図9(b)に示すように、入力欄T11を編集可能な状態に制御するとともに、解除ボタンB21を非表示にする。
【0089】
このように、端末装置100は、編集可能にするための解除ボタンを表示することで、ユーザが入力済みの情報を自由に修正することが可能になるので、ユーザビリティの向上を図ることができる。
【0090】
なお、図7及び図8に示した例の場合、編集制御部152は、所定の入力欄を編集不可能に制御するたびに、かかる入力欄を編集可能にするための解除ボタンを表示してもよい。
【0091】
〔6−5.検証処理の主体〕
また、上記実施形態では、ウェブサーバ200の検証部234が、入力情報の検証処理(バリデーションチェック)を行う例を示した。しかし、かかる検証処理は、端末装置100が行ってもよい。このように端末装置100が検証処理を行うことで、端末装置100とウェブサーバ200との間で入力情報や検証結果が送受信されないので、ネットワークNのトラフィックを低減することができる。なお、端末装置100が検証処理を行う場合、端末装置100は、非同期通信部151を有しなくてもよい。また、端末装置100による検証処理は、例えば、ウェブページを形成するHTMLファイルに記述されるJavascript等によって実現される。
【0092】
〔6−6.入力欄の表示色〕
また、上記実施形態では、編集制御部152が、入力要件を満たす入力欄の表示色を変更する例を示した。しかし、編集制御部152は、入力欄の表示色を常に変更しなくてもよい。
【0093】
〔6−7.非同期通信〕
また、上記実施形態では、非同期通信部151が、非同期通信により入力情報をウェブサーバ200に送信する例を示した。しかし、端末装置100は、HTTPリクエストにより入力情報をウェブサーバ200に送信してもよい。例えば、図1(b)の例において確認ボタンB12が押下された場合に、端末装置100は、入力欄T11〜T17の入力情報をHTTPリクエストによりウェブサーバ200に送信する。この場合、ウェブサーバ200は、各入力情報の検証結果を反映した状態のウェブページW10を端末装置100に送信する。これにより、端末装置100は、図1(c)に示した状態のウェブページを送信する。このように、ウェブページW10の動的な書き換え処理がウェブサーバ200によって行われる場合であっても、入力画面と確認画面をウェブページW10に兼用させることができるので、ウェブページの開発コストを低減することができる。
【0094】
〔6−8.その他〕
また、上記実施形態において説明した各処理のうち、自動的に行われるものとして説明した処理の全部または一部を手動的に行うこともでき、あるいは、手動的に行われるものとして説明した処理の全部または一部を公知の方法で自動的に行うこともできる。この他、上記文書中や図面中で示した処理手順、具体的名称、各種のデータやパラメータを含む情報については、特記する場合を除いて任意に変更することができる。
【0095】
また、図示した各装置の各構成要素は機能概念的なものであり、必ずしも物理的に図示の如く構成されていることを要しない。すなわち、各装置の分散・統合の具体的形態は図示のものに限られず、その全部または一部を、各種の負荷や使用状況などに応じて、任意の単位で機能的または物理的に分散・統合して構成することができる。
【0096】
例えば、図1図2図7図9に示したウェブページW10は一例であって、図示した例に限られない。例えば、上述してきたウェブシステム1は、会員登録用のウェブページに限られず、複数の検索キーワードを入力する検索画面用のウェブページを配信する場合にも適用することができる。
【0097】
〔7.効果〕
上述してきたように、実施形態に係る端末装置100は、入力受付部142と、画面制御部150とを有する。入力受付部142は、入力画面に含まれる入力欄に対して任意の情報を入力する入力操作を受け付ける。画面制御部150は、入力操作において入力欄に入力された入力情報が入力要件を満たす場合に、かかる入力欄が編集不可能な状態に制御された入力画面を確認画面として表示する。
【0098】
これにより、実施形態に係る端末装置100は、1個のウェブページで入力画面と確認画面とを兼用するので、ウェブページの開発コストを低減することができる。
【0099】
また、実施形態に係る端末装置100において、画面制御部150は、非同期通信部151と、編集制御部152とを有する。非同期通信部151は、入力画面を提供するウェブサーバ200(サーバ装置の一例に相当)に対して、入力情報を非同期通信により送信するとともに、入力情報が入力要件を満たすか否かを示す検証結果をウェブサーバ200から非同期通信により受信する。また、編集制御部152は、非同期通信部151によって受信された検証結果が入力要件を満たすことを示す場合に、入力欄を編集不可能な状態に制御する。
【0100】
これにより、実施形態に係る端末装置100は、端末側(端末装置100)でなくサーバ側(ウェブサーバ200)で検証処理を行わせることにより、信頼性の高い検証処理を実現することができる。例えば、端末装置100による検証処理は、ウェブページを形成するHTMLファイルに記述されるJavascript等によって実現される。しかし、HTMLファイルに記述されるJavascript等は、ウェブブラウザの設定変更やHTMLファイルの改竄などにより、無効化することもできる。このため、端末装置100による検証処理は、信頼性が高いとは限らない。一方で、実施形態に係るウェブサーバ200は、ユーザ操作によって検証処理が無効化されることはないので、入力情報を確実に検証することが可能となる。
【0101】
また、実施形態に係る端末装置100において、画面制御部150は、検証結果表示部153を有する。検証結果表示部153は、非同期通信部151によって受信された検証結果が入力要件を満たさないことを示す場合に、かかる検証結果を入力画面に表示する。
【0102】
これにより、実施形態に係る端末装置100は、1個のウェブページで入力画面とエラーメッセージが表示される入力画面とを兼用するので、ウェブページの開発コストを低減することができる。
【0103】
また、実施形態に係る端末装置100において、入力受付部142は、入力欄が編集不可能な状態に制御されている入力画面において画面状態を戻す操作を受け付ける。また、編集制御部152は、入力受付部142によって画面状態を戻す操作が受け付けられた場合に、入力欄を編集可能な状態に制御する。
【0104】
これにより、実施形態に係る端末装置100は、ウェブページの開発コストを低減することができる。例えば、一般的に、入力情報が単に表示されている確認画面において戻る操作が行われた場合、戻る操作が行われたことが端末装置からウェブサーバに通知され、ウェブサーバが確認画面に含まれる情報から、入力情報が入力された状態のウェブページ(入力画面)を生成し、生成したウェブページを端末装置に配信する。このような手法では、確認画面から入力画面への画面遷移を可能とするWebアプリケーションの開発を要するので、開発コストの増大を招く。しかし、実施形態に係る端末装置100は、図1(c)の例において、戻るボタンB13が押下された場合には、ウェブサーバ200に情報を通知することなく、入力欄の編集可否等を制御するだけで確認画面(図1(c))から入力画面(図1(b))に切り替えることができる。このため、実施形態に係る端末装置100を用いた場合には、上記例のようなWebアプリケーションの開発を要しないので、ウェブページの開発コストを低減することができる。
【0105】
また、実施形態に係る端末装置100において、入力受付部142は、入力画面に含まれる複数の入力欄に対して入力操作を受け付ける。また、非同期通信部151は、複数の入力欄のいずれかに情報が入力されるたびに、入力された入力情報をウェブサーバ200に送信するとともに、かかる入力情報の検証結果をウェブサーバ200から受信する。また、編集制御部152は、非同期通信部151によって受信された検証結果に基づいて、入力画面に含まれる入力欄毎に編集可否を制御する。
【0106】
これにより、実施形態に係る端末装置100は、ユーザによって入力された入力情報が入力要件を満たしているか否かを即座にユーザに認識させることができるので、ユーザビリティの向上を図ることができる。
【0107】
また、実施形態に係る端末装置100において、編集制御部152は、編集不可能な状態に制御した入力欄を編集不可能であることを識別可能な状態で表示する。
【0108】
これにより、実施形態に係る端末装置100は、編集不可能であることをユーザに認識させることができるので、ウェブページW10が確認画面であることをユーザに認識させることができる。
【0109】
また、実施形態に係る端末装置100において、入力受付部142は、入力画面への入力操作が完了した旨の完了操作を受け付ける。また、非同期通信部151は、入力受付部142によって完了操作が受け付けられた場合に、ウェブサーバ200に入力情報を非同期通信により送信する。
【0110】
これにより、実施形態に係る端末装置100は、ユーザによる入力操作が完了した後に、入力情報を一括でウェブサーバ200に送信することが可能になるので、ネットワークNのトラフィックを低減することができる。
【0111】
また、実施形態に係るウェブサーバ200は、要求受信部231と、配信部232とを有する。要求受信部231は、任意の情報が入力される入力欄を含む入力画面の取得要求を端末装置100から受信する。配信部232は、要求受信部231によって取得要求が受信された場合に、入力欄に入力された入力情報が入力要件を満たすと判定された際に入力欄を編集不可能な状態に制御する表示制御プログラムが組み込まれた入力画面を端末装置100に配信する。
【0112】
これにより、実施形態に係るウェブサーバ200は、1個のウェブページで入力画面と確認画面とを兼用するので、ウェブページの開発コストを低減することができる。
【0113】
また、実施形態に係るウェブサーバ200は、非同期通信部233を有する。非同期通信部233は、端末装置100から入力情報を非同期通信により受信するとともに、入力情報が入力要件を満たすか否かを示す検証結果を端末装置100に非同期通信により送信する。
【0114】
これにより、実施形態に係るウェブサーバ200は、信頼性の高い検証処理を実現することができる。
【0115】
以上、本願の実施形態のいくつかを図面に基づいて詳細に説明したが、これらは例示であり、発明の開示の欄に記載の態様を始めとして、当業者の知識に基づいて種々の変形、改良を施した他の形態で本発明を実施することが可能である。
【0116】
また、上述したウェブサーバ200は、複数のサーバコンピュータで実現してもよく、また、機能によっては外部のプラットフォーム等をAPI(Application Programming Interface)やネットワークコンピューティングなどで呼び出して実現するなど、構成は柔軟に変更できる。
【0117】
また、特許請求の範囲に記載した「手段」は、「部(section、module、unit)」や「回路」などに読み替えることができる。例えば、入力受付手段は、入力受付部や入力受付回路に読み替えることができる。
【符号の説明】
【0118】
1 ウェブシステム
100 端末装置
142 入力受付部
150 画面制御部
151 非同期通信部
152 編集制御部
153 検証結果表示部
200 ウェブサーバ
232 配信部
233 非同期通信部
234 検証部
図1
図2
図3
図4
図5
図6
図7
図8
図9