【データモデル】標準書込みフォームを拡張してみる - 絞り込み検索リスト

以前の記事[【データモデル】標準書込みフォームを拡張してみる - ラベルと入力タイプ](https://qiita.com/Miki_Yokohata/items/c20ddb87dfae470620a3)で記したように、[Sharperlight](https://sharperlight.jp/)のデータモデルで、あるテーブルを`書込み可`とすると標準書込みフォームが使用できるようになります。

標準書込みフォームでは、検索ウインドウ等を使用して値を入力できるようになっています。
その場合に、先に入力した`甲`の値で次に入力する`乙`の値の検索リストを絞り込みたい場合があります。
今回はそれを実現してみたいと思います。

ここにこのような**Manufactures**(製造元)と**Models**(車種)といった参照テーブルがあります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2530698/99af4a05-3179-3141-18ba-8f7a2c31dca2.png)
以下のような**Transactions**(取引)データを標準書込みフォームを使用して入力する場合、上記の参照テーブルを利用してそれぞれの値を入力していくという事になります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2530698/e7b5338a-6975-bc89-75c6-0a373e323bef.png)
その場合に、入力したManufacture(製造元)の値で、Models(車種)の検索リストを絞り込みたいということです。では早速設定をしてみます。

## データモデル:Transactions(取引)テーブルの定義 ##
Sharperlightデータモデルでは、**Transactions**(取引)テーブルはこのように定義されます。
今回は、このテーブルの標準書込みフォームを拡張していきます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2530698/1f82a615-04fc-e421-e4c4-6c5cf3527b1d.png)
### IDフィールドを使用したJOINの追加 ###
先ずManufacture_IDフィールドとModel_IDフィールドのそれぞれに対してJOINを定義します。
専用JOINエディターでこのように作成追加できます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2530698/2b2a5275-521c-1a2b-2323-0fbd08377c59.png)

### Manufacture_IDフィールドの属性設定 ###
#### Lookup 属性 ####
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2530698/0b48997b-604b-aa2d-8d28-8e10ad2b3d2b.png)
`Inherit`オプションを使用して、参照テーブルと検索に使用するフィールドを指定します。
参照テーブルはもちろんManufacturesテーブル、使用するフィールドにはNameフィールドを選択します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2530698/6969d3bc-66e4-b701-bae0-ebcf93ff4a48.png)
#### Custom SQL Validation 属性 ####
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2530698/015371bc-ae18-d2ab-cf06-82be83f1df5b.png)
ここでは入力された値をチェックするためのSQL文を記入します。`{_fieldValue}`はこのフィールドに入力された値を参照するための`Sharperlightコントロールタグ`です。
Lookup 属性でNameフィールドを使用するように設定したので、`where [Name] = {_fieldValue}` となります。

ここまでの設定を行うと、書込みフォームではこのような検索ウインドウが表示されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2530698/dbb1b845-a45b-dea4-428f-3c9e097c3980.png)
#### Lookup Filter Driver 属性 ####
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2530698/5c3d06fb-0672-0054-ef16-620609968d68.png)
このManufacture_IDフィールドが、`”他のフィールド値を絞りこむためのドライバーになりますよ”`という宣言をします。

### Model_IDフィールドの属性設定 ###
#### Lookup 属性 #### 
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2530698/e120decd-5052-2009-6818-1dd4e4b2c72c.png)
`Inherit`オプションを使用して、参照テーブルと検索に使用するフィールドを指定します。
参照テーブルはもちろんModelsテーブル、使用するフィールドにはCodeフィールドを選択します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2530698/4614a136-0ab2-7852-06f4-079ca2e8a755.png)
#### Custom SQL Validation 属性 ####
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2530698/2f55bb6e-2864-8a79-65ff-5cecab1c742e.png)
ここでは入力された値をチェックするためのSQL文を記入します。
```
select [Row_ID] from [Models]
where [Code] = {_fieldValue}
    AND [Manufacture_ID] = (select [Row_ID] from [Manufactures] where [Code] = {/Manufactures/Code})
```
`{_fieldValue}`はこのフィールドに入力された値を参照するための`Sharperlightコントロールタグ`です。Lookup 属性でCodeフィールドを使用するように設定したので、`where [Code] = {_fieldValue}` となります。
また、`{/Manufactures/Code}`も`Sharperlightコントロールタグ`で、定義済みのManufacturesテーブルJOINを利用して得たCode値を参照します。


ここまでの設定を行うと、書込みフォームではこのような検索ウインドウが表示されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2530698/c26b1abe-dcd4-7f9d-63dd-465d56a9b34f.png)
#### Lookup Filter Target 属性 ####
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2530698/52bba30e-a41f-1ff4-746f-4d84f4ccb03c.png)
このModel_IDフィールドが、`”上位直近のLookup Filter DriverフィールドのTarget(目標)フィールドですよ”`という宣言をします。
つまり、上位直近の`Lookup Filter Driver`フィールドであるManufacture_IDの入力値で、`Lookup Filter Target`フィールドであるModel_IDフィールドの検索リストを絞り込みますよという設定になります。

以上で、設定は完了です。データモデルを保存し、Sharperlightサービスを起動します。

## Transactions(取引)テーブル用の標準書込みフォーム ##
このURLでTransactions(取引)テーブル用の標準書込みフォームを表示します。
```
http://localhost/DemoRest/EntryForm/?productcode=TRAIN2&tablecode=Transactions
```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2530698/7ec627dc-6d95-15bd-bdd0-e9b2d6f1880c.png)
ではManufacture(製造元)の検索ウインドウを開きます。テキストフィールド右端のボタンで開くことができます。
**Nissan**を選んでみます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2530698/1bca9626-c7e9-7bc1-be77-237d08c9926a.png)
次にModel(車種)の検索ウインドウを開きます。どうでしょう、選択したManufacture(製造元)値 **Nissan**でModel(車種)リストが絞り込まれました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2530698/77236193-9dd3-8f8f-6e3e-66eb515fe0cc.png)