FAQ：選択された内容によって入力項目の色を変える
## 回答
「[スクリプト](/manual/table-management-script)」を使用します。
---
## 概要
記録テーブルを作成し、分類A、数値A、Bを有効にしたうえで、「[スクリプト](/manual/table-management-script)」を新規作成し、以下のスクリプトを記載してください。
出力先には「新規作成」と「編集」をチェックして更新します。
分類AでAを選択した場合は、数値Aの枠線を青に変更する。Bを選択した場合は、数値Bの枠線を青に変更する。A,B以外の場合は数値A、Bの表示を戻すサンプルスクリプトです。
##### JavaScript
```
$(document).on('change', '#' + $p.getControl('ClassA')[0].id, function() {
const myClassA = $p.getControl('ClassA').val();
const myCssBlue = {'borderColor': 'blue', 'background': '#f0f8ff'};
const myCssDefault = {'borderColor': '#c0c0c0', 'background': 'white'};
switch(myClassA) {
case 'A':
// 数値Aに対する処理
$p.getControl('NumA').css(myCssBlue);
// 数値Bに対する処理
$p.getControl('NumB').css(myCssDefault);
break;
case 'B':
// 数値Bに対する処理
$p.getControl('NumB').css(myCssBlue);
// 数値Aに対する処理
$p.getControl('NumA').css(myCssDefault);
break;
default:
// 数値Aに対する処理
$p.getControl('NumA').css(myCssDefault);
// 数値Bに対する処理
$p.getControl('NumB').css(myCssDefault);
break;
}
});
```
## 関連情報
<div id="ManualList"><ul><li><a href="/manual/table-management-script">テーブルの管理：スクリプト</a><span>2023/05/18 up</span></li></ul></article></div><input id="SearchTextHidden" type="hidden" value="" />
