Make input fields readonly with values based on another input field

Question

I have 3 input fields in the create user form. Based on the selection of status, I want to make the next 2 fields read-only with specific values.
So If the user selects "Full-Time" for Status, the next 2 fields should become read-only with values 5 and 7.6 respectively. For any other selection, it should remain as a normal input field for the user to enter values. How can I achieve this? Would highly appreciate any help

Answer 1

You can use listener events and jquery's method attr to handle the state of the other two text boxes. Here is an example.

 function changeVal(e) { console.log(e.target.value) if (e.target.value == "Full Time") { $("#workingday").val(5) $("#workinghour").val(7.6) $("#workingday").attr("readonly", true) $("#workinghour").attr("readonly", true) } else { $("#workingday").val("") $("#workinghour").val("") $("#workingday").attr("readonly", false) $("#workinghour").attr("readonly", false) } }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> <table> <tr> <td>status</td> <td>Working Day in weeks</td> <td>Working Hours Per Day</td> </tr> <tr> <td> <select onchange="changeVal(event)"> <option value="">--select--</option> <option value="Full Time">Full Time</option> <option value="other">other value</option> </select> </td> <td> <input type="text" id="workingday" name="workingday" value="0" /> </td> <td> <input type="text" id="workinghour" name="workinghour" value="0" /> </td> </tr> </table>

Answer 2

add runat attribute to Status

runat="server"

then take the value of Status and compare it to set the parameters of the other fields

String statustxt = Status.Value;
if(Equals(statustxt, targettxt) {
workingdays.Text = "5";
workingdays.ReadOnly = true;
workinghours.Text = "7.6";
workinghours.ReadOnly = true; }

You can also set Editable = false