前頁　次頁　目次

（２）　HTMLフォームのデザイン

　本項（２）では、グループ内のメンバ間のデータ転送で使用するHTMLフォームについて説明します。

　受付箱あるいは提示箱のデータの登録・変更・参照で使用するHTMLフォームについてはそれぞれ「３．６　受付箱管理」、「３．７　提示箱管理」を参照してください。

　HTMLフォームをグループ内のメンバ間のデータ転送で使用する場合、次の操作が伴います。

�@　HTMLフォームの起票

�A　HTMLフォームの参照

�B　HTMLフォームの返信　（任意）

　HTMLフォームをはじめて起票するためのHTMLフォームを新規書込フォームファイルとして用意します。

　「HTMLフォームの参照」と「HTMLフォームの返信」については、HTMLフォームがXML指定つきの場合とXML指定なしの場合とで扱い方が異なります。

・　XML指定つきフォームの場合

　この場合、「HTMLフォームの参照」と「HTMLフォームの返信」が使用できます。新規書込フォームで書き込んだデータを参照する受信者がその内容を書き換えては困ります。そこで、FNSシステムでは受信者が発信者の記入内容を書き換えられないようにすることを要求します。そのために、同じフォームIDの電子フォームであっても表示専用フォームが必要となります。これら２つに加えて受信した電子フォームの１部だけが書込可の返信用フォームが必要となることもあります。

　このケースでは、表示専用と返信用フォームを省略することができますが、その場合、新規書込フォームが便宜的に表示専用として使われます。

・　ＸＭＬ指定なしフォームの場合

　この場合、「HTMLフォームの起票」だけが可能です。「HTMLフォームの参照」と「HTMLフォームの返信」は使用できません。受信閲覧の際のデータ表示にはFNSシステム既定の方式が適用されます。

　HTMLフォームを登録するために次表に示すファイルを用意する必要があります。

　次に、これらのファイルのデザイン方法について説明します。

　１）　新規書込用ファイル

　データ転送用のHTMLフォームを運用者ページや利用者ページに組み込むことができますが、その場合のHTMLフォームも新規書き込用HTMLフォームのデザイン方法と殆ど同じですので、ここでの説明を参考にしてください。両者の違いについては、必要に応じて注釈をつけています。

　データ転送で使用するHTMLフォームのデザインについて、図３．２−９に示す目安箱を例にして説明します。

図３．２−９　目安箱

　

　　HTMLフォームのデザインの説明で用いる目安箱はテキスト入力を扱っていますが、テキスト以外のデータを扱う場合も基本的な部分は同じです。従って本例を参考にして他のデータ形式を扱うHTMLフォームがデザインできます。

　　　（ａ）　フォーム意匠のデザイン

　　HTMLフォームの意匠デザインはMS-WordやMS-Excel、MS-Front PageなどHTMLフォームのデザインが可能なソフトを使用します。HTMLフォームのデザインで注意しなければならないことは、HTMLフォームとして使用するWebページは１つのファイルで完結していなければならない点です。一般的に、Webページはhtmlファイル以外に画像データなど複数のファイルから構成できますが、FNSシステムではHTMLフォームは１つのhtmlファイルだけから成ることを前提としているからです。

　　　（ｂ）　タグの埋め込み

　　目安箱のHTMLソースは「付録A 目安箱のHTMLソース」に示す通りです。目安箱をHTMLフォームとして使用するために、目安箱のHTMLソースに以下に示すformタグ、inputタグと必要に応じてJavaScriptプログラムを埋め込む必要があります。FNSシステムで使用するHTMLタグは次の通りです。

注）HTMLフォームを運用者ページや利用者ページに埋め込む場合には、上記（ａ）の意匠デザインは必要ありません。それらのページには直接以下の（イ）から（ル）までのHTMLタグやJavaScript関数を埋め込みます。

（イ）　JavaScript関数プログラムおよび呼び出し　　任意

　例えば、HTMLフォームには、それが使われるグループの名前を指定する必要があります。その指定は後述のinputタグで行います。このHTMLフォームが常に１つのグループで使用されるならinputタグでそのグループの名前を明示すれば良いのですが、異なる複数のグループで使用する場合には、動的にグループ名を取り出す必要があります。それを行うのが次に示すJavaScriptプログラムです。このJavaScriptプログラムをHTMLソースのヘッダー部分に埋め込みます。

<SCRIPT LANGUAGE="JavaScript" SRC="MfCmPage/fnsFormUtl.js">
</SCRIPT>

　fnsFormUtl.jsファイルには動的にグループ名を取り出すfnsSetmfcgrpname関数が含まれています。

　また、関数fnsSetmfcgrpnameを呼び出すコード：

<SCRIPT LANGUAGE="JavaScript">
<!--
fnsSetmfcgrpname("f");　注）"f"は後記formタグの名前を指定。
//-->
</SCRIPT>

をボディ部の最後に挿入します。こうして、HTMLフォームが使われるグループの名前が動的に取り出され、HTMLフォームに埋め込まれます。

　fnsFormUtl.jsファイルには、fnsSetmfcgrpname関数以外にも次表に示すようなFNSシステムの機能を利用するための関数が含まれています。

fnsSetDocumentBase()
説明	実行タイミング：HTMLヘッダ部解析時。 機能：ドキュメントベースをHTMLフォームが呼出されたURLのサーブレット名直前のパス位置に指定します。本関数呼び出し以降の相対パスはFNSサーブレット名から記述する事になります。 例：HTMLフォームの存在位置 　　　「https://www.domain/zone/servlet/MfKnPage/index.htm」  　　　　　　　　　　　　　　　　↓ 　　　　　 　　ドキュメントベース位置 　　　「https://www.domain/zone/servlet/」
fnsSetmfcgrpname(pformname)
説明	実行タイミング：任意。 機能：FNSのHTMLフォームで規定された「mfcgrpname」項にHTMLフォームが呼出されたURL内に含まれているグループ名を設定します。 パラメータpformname：設定すべきmfcgrpname項が含まれているformタグの名前
fnsMyNameInit()
説明	実行タイミング：HTMLボディ部解析時。 機能：ログイン利用者の名前を取出す関数（fnsSetMyName、fnsGetMyName）を使用する場合には、本関数を予め実行して置く必要があります。
fnsSetMyName(obj)
説明	実行タイミング：任意。但しfnsMyNameInit()が一度実行されている必要があります。 機能：現在のログイン利用者の名前をobjで指定された項目（通常はinputタグ）に設定します。ログイン利用者名は現在入場中のグループで定義されている名前が設定されます。 パラメータobj：ログイン利用者名を設定すべきオブジェクト。
fnsGetMyName()
説明	実行タイミング：任意。但しfnsMyNameInit()が一度実行されている必要があります。 機能：現在のログイン利用者の名前を関数値として返却します。現在入場中のグループで定義されている名前が返却されます。

　

（ロ）　formタグ　必須

　formタグはデータ入力の手段を提供します。formタグの形式は次の通りです。

<form name="f" action="https://www.domain/zone/servlet/MfTransfer" method="POST" enctype="application/x-www-form-urlencoded">

<input　タグ>

<input　タグ>

<input　タグ>

・　・　・

<input　タグ>

</form> 

"f"はこのフォームの名前です。

　action属性にはこのフォームｆで入力したデータの送信先を指定します。この例では、domain（実際にはitnetinc.co.jpなどのドメイン）内にあるサーバwwwに接続し、ゾーンzoneにあるサーブレットMfTransferを呼び出します。domainやサーバwww、ゾーンzoneの名前はFNSシステムのインストール先のものを使用する必要があります。

　enctype属性の指定はデータ入力のinputタグの種類によって異なります。fileタイプをもつinputタグを使う場合は、

"multipart/form-data"

を指定します。その他の場合は、

"application/x-www-form-urlencoded"

を指定します。

　formタグのその他の属性はこの例のとおり指定してください。 　

　フォームで指定するinputタグについては次の（ハ）以降で説明します。  

（ハ）　グループ名（mfcgrpname）　必須

　HTMLフォームが使用されるグループを指定するために次のようなinputタグを挿入します。

<input type="hidden" name="mfcgrpname" value="エフエヌエスＧ">

　このinputタグは、HTMLフォームがグループ"エフエヌエスＧ"で使用されることを指定しています。

　HTMLフォームが複数のグループで使用される場合には動的にグループ名を取り出すためのJavaScript関数を使用します。その場合は、

<input type="hidden" name="mfcgrpname">

を挿入します。JavaScript関数については（イ）を参照してください。

　

（ニ）　フォームID（mfformid）　必須

　HTMLフォームにはHTMLフォームID、即ちフォームの名前（先頭が下線ではない半角の英数字あるいは下線からなる長さ２５バイト以内の文字列）を指定します。フォームIDを指定するために次のinputタグを挿入します。

<input type="hidden" name="mfformid" value="formID">

　複数のグループでこのHTMLフォームを共有する場合にはこれらのグループを通して名前が重複しないように定義する必要があります。

　　注）HTMLフォームを運用者ページや利用者ページに埋め込む場合にはフォームIDの指定は任意です。

　

（ホ）　宛先（mfdist）　※XML（mfconv）指定がない場合は必須

　HTMLフォームの宛先を指定するために次のinputタグを挿入します。

<input type="text" name="mfdist" size="30" value="宛先">

　宛先には規定値として、

“_MANAGER”、“_ALL”、“_ALLOTHERSIDE”、“_ALLSAMESIDE”、利用者名

の４種が指定できます。以下の説明では第２章操作概要の２．１（１）「グループの作成」を選択した場合を参照してください。

■　“_MANAGER”

宛先は管理者です。

■　“_ALL”

宛先は発信者以外のすべての利用者です。

■　“_ALLOTHERSIDE”

発信者が運用者（A端利用者）ならば、宛先は運用者（A端利用者）と対向する全利用者（B端利用者）です。

発信者が利用者（B端利用者）ならば、宛先は利用者（B端利用者）と対向する運用者（全A端利用者）です。

■　“_ALLSAMESIDE”

発信者が運用者（A端利用者）ならば、宛先は発信者を除くすべての運用者（A端利用者）です。

発信者が利用者（B端利用者）ならば、宛先は発信者を除くすべての利用者（B端利用者）です。

■　利用者名

宛先は指定した利用者です。

　このHTMLフォームを表示したとき、宛先の入力フィールドには規定値が表示されますが、データ送信の際に宛先を変更することができます。

　宛先を表示したくない場合には、上記のinputタグは、

<input type="hidden" name="mfdist" size="30" value="宛先">

とします。

　

（ヘ）　コンテンツ（mfcntnt、mfmime）　※XML（mfconv）指定がない場合は必須

　HTMLフォームを使って送信する内容（コンテンツ）データをこのフォームから直接入力する場合と、操作しているパソコン上のファイル（ローカルファイル）を参照する場合とでinputタグが異なります。

■　直接入力する場合

　HTMLフォームの入力領域を指定するため、次のinputタグを挿入します。

<textarea rows="10" name="mfcntnt" cols="63"></textarea>

<input type="text" name="mfmime" size="20" value="text/plain">

■　ローカルファイルを選択する場合

　HTMLフォームの入力データとしてローカルファイルを参照するために次のinputタグを挿入します。

<input type="FILE" name="mfcntnt" size="20">

　このinputtタグを使用する場合、次の２つに注意する必要があります。

--　mfmimeのinputタグを指定することはできません。

--　formタグのenctype属性には、

"multipart/form-data"

　　を指定する必要があります。

　ローカルファイルとしてはWebブラウザが解釈できるファイル：例えば、テキストファイル、画像ファイル（gif、jpgなど）、htmlファイルなどが参照できます。参照されたファイルは“宛先”の受信キューに送られますので、受信者は受信閲覧画面を通して受信ファイルの内容を表示します。

［注意事項］　Netscape社のWebブラウザを使用した場合、HTMLフォームの入力フィールドに何も入力せずに送信した場合、当該データの受信閲覧あるいは送信履歴閲覧時に受信継続の状態になりますのでご注意下さい。Microsoft社のInternet Explorerではこのような問題は発生しません。

　

（ト）　タイトル（mftitle）　任意

　転送データに対してタイトルを追加します。受信閲覧や送信履歴閲覧の一覧にここで指定したタイトルが表示されます。

　HTMLフォームに記入する毎に、タイトルを付けたい場合には次ぎのようなinputタグを挿入します。

<input type="text" name="mftitle" size="40" value="">

（チ）　クリアボタン　任意

　入力フィールドの内容をクリアするために次のinputタグを挿入します。

<input type="reset" value="リセット" name="Reset">

注）グループ名をJavaScriptで設定するフォームではグループ名フィールド（mfcgrpname）をクリアしないようにするために、次のように記述してください。

■　JavaScript関数myclear()の定義；

次ぎのような関数をＨＴＭＬフォームのヘッダ部で定義。

function myclear() {

document.forms["f"].elements["mfdist"].value = "_ALLOTHERSIDE";

document.forms["f"].elements["mftitle"].value = "";

document.forms["f"].elements["mfmime"].value = "text/plain";

document.forms["f"].elements["mfcntnt"].value = "";

return(false);

}  

※　クリア値は必要に応じて変更してください。

■　先のinputタグは次ぎで置換えます。

<input type="BUTTON" value="リセット" name="Reset" onClick="myclear()">　  

　

（リ）　送信ボタン　必須

　　HTMLフォームの入力データを送信するために次のinputタグを挿入します。

<input type="submit" value="送信" name="mfsubmit">

（ヌ）　XML指定（mfconv）　任意

　上記の（イ）から（リ）まではmfcntntの内容を送信するためのHTMLタグの説明です。FNSシステムはmfcntntだけでなく、HTMLフォーム内に設定したすべての入力フィールドをXMLファイル化して送信することができます。XML指定の場合、前記mfcntntとmfmimeは指定しません。入力フィールド名として“mf”で始まる名前は避けてください。XMLファイル化するために、HTMLフォーム内に次ぎのinputタグを挿入します。ただし、formタグにenctype="multipart/form-data"を指定した場合は指定できません。

<input type="hidden" name="mfconv" value="xml">

　次のDTD（Document Type Definition）によるXMLファイルが送信されます。

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE fns-content [
<!ELEMENT fns-content (form-element*)>
<!ELEMENT form-element (name,value)>
<!ELEMENT name (#PCDATA)>
<!ELEMENT value (#PCDATA)>
]>

　ここに、nameとvalueはペアで用いられ、nameにはHTMLフォーム内の入力フィールドの名前が入り、valueにはその入力フィールドの値が入ります。

　例えば、次ぎのようなXMLファイルが送信されます。

<fns-content>
<form-element>
<name>tag-1</name>
<value>tag-1-value</value>
</form-element>
<form-element>
<name>tag-2</name>
<value>tag-2-value</value>
</form-element>
<form-element>
<name>tag-3</name>
<value>tag-3-value</value>
</form-element>
</fns-content>

　

　２）　表示専用ファイル

　前記１）では新規書込用ファイルのデザイン方法について説明しました。ここでは、表示専用ファイルのデザイン方法について説明します。

　表示専用ファイルは新規書込ファイルをコピーして作成します。表示専用ファイルではformタグ、グループ名（mfcgrpname）、フォームID（mfformid）、XML指定（mfconv）は同じように指定します。その他のinputタグやtextareaタグの入力フィールドの属性にreadonlyを追加します。また、クリアボタンや送信ボタン、宛先（mfdist）は必要がありませんので削除します。Javascriptプログラムの扱いについてはHTMLフォームの必要に応じて設計者の判断に任されています。

　inputタグやtextareaタグの値は当該フォームIDに対応するXMLデータから取り込まれ、表示されます。

　これらのファイル作成に当たっては、「付録D　請求書発行依頼のHTMLソース」を参考にしてください。

　

　３）　返信用ファイル

　「図２．２−２３　HTMLフォームのアップロード」ページの「XMLタイプ時の返信操作モード指定」で「受信キューは返信操作モードで閲覧」にチェックすると、返信用ファイルが使われます。

　返信用ファイルは新規書き込用ファイルをコピーして作成します。返信用ファイルではformタグ、グループ名（mfcgrpname）、フォームID（mfformid）、XML指定（mfconv）は同じように指定します。mfdistを指定した場合、「図２．２−２３　HTMLフォームのアップロード」ページの「XMLタイプ時の返信操作モード指定」で「返信操作時mfdist（宛先）置換え不要」にチェックすると、ここで指定したmfdist（宛先）に返信されます。チェックしなければ、発信者に返信されます。クリアボタンは削除します。送信ボタンは“返信”ボタンに変更します。その他のinputタグやtextareaタグの入力フィールドの属性については、返信で書き換えるフィールドを除いてreadonlyを追加します。Javascriptプログラムの扱いについてはHTMLフォームの必要に応じて設計者の判断に任されています。

　inputタグやtextareaタグの値は当該フォームIDに対応するXMLデータから取り込まれ、表示されます。

　これらのファイルの作成に当たっては、「付録D　請求書発行依頼のHTMLソース」を参考にしてください。

前頁　次頁　目次