FAQ: Change the color of input fields depending on the selected content
## Answer
Use "[Script](/en/manual/table-management-script)".
---
## Overview
Create a recorded table, enable ClassA, NumA and B, then create a new "[Script](/en/manual/table-management-script)" and write the following script.
Check "Create new" and "Edit" for the output destination to update.
If A is selected in ClassA, change the border of NumA to blue. If B is selected, change the border of value B to blue. This is a sample script that returns the display of NumA and B to values other than A and 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':
// Processing for NumA
$p.getControl('NumA').css(myCssBlue);
// Processing for NumB
$p.getControl('NumB').css(myCssDefault);
break;
case 'B':
// Processing for NumB
$p.getControl('NumB').css(myCssBlue);
// Processing for NumA
$p.getControl('NumA').css(myCssDefault);
break;
default:
// Processing for NumA
$p.getControl('NumA').css(myCssDefault);
// Processing for NumB
$p.getControl('NumB').css(myCssDefault);
break;
}
});
```
## Related Information
<div id="ManualList"><ul><li><a href="/en/manual/table-management-script">Table Management: Script</a><span>08.13.2024 up</span></li></ul></article></div><input id="SearchTextHidden" type="hidden" value="" />
