Hello,
I've got a button with very simple CSS (below). Problem is, the button isn't adhering to the code:
{$this field rule} input;
input[type="button"]{
height: 50px;
width: 50px;
}
input[type="button"]:disabled{
background: #dddddd;
}
On both the form editor and the form in use, it's not following the dimensions
Form Editor - not square
On Form when viewing ItemType
The button activates a method which is working as expected, so my only issue is the size of the button isn't doing what I want.
As an alternate, I tried using an HTML field with my code to run a script, but the script doesn't seem to work on "onclick" for the HTML field; though the HTML formatting shows up as expected.
Code below:
<html>
<body>
<input type='button'
onClick="function(VHVL)"
style="height:40px;
width:40px;
background-color: RGBA(255, 255, 0);
border: 1px solid RGBA(128, 128, 128, 0.5);
padding: 0.25em;">
<script>
function (VHVL) {
// Create an Innovator object
var myInnov = new Innovator();
var riskprobability = "1";
var riskimpact = "1";
var probabilityDropdown = getFieldComponentByName('_riskprobability');
probabilityDropdown.component.setState({value: riskprobability});
window.handleItemChange("_riskprobability", riskprobability);
var impactDropdown = getFieldComponentByName('_riskimpact');
impactDropdown.component.setState({value: riskimpact});
window.handleItemChange("_riskimpact", riskimpact);
var SeverityScore = riskprobability * riskimpact
window.handleItemChange("_riskseverityscore", SeverityScore)
if (riskimpact >= 4 && riskprobability <= 2) {
window.handleItemChange("_riskhilp", "1");
}
else
{
window.handleItemChange("_riskhilp", "0");
}
if (SeverityScore > 4) {
window.handleItemChange("_riskromap", "1");
}
else
{
window.handleItemChange("_riskromap", "0");
}
}
</script>
</body>
</html>
I don't really care whether I do this as a button or as an HTML field, but I do need the "item" to look right and execute the code. Appreciate any help on this!
