2
Answers

enable form control on selecting item from drop

Leah Kunkie

Leah Kunkie
5y
527
1
I am trying to enable form elements when selecting the first drop down with id LId3, I took the code from a button. The problem starts when I enable the searchable dropdown, when i open the searchable dropdown the form elements are not enabled. When the dropdown is clickable the form elements get enabled. Please assist with the below:
  1. <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>  
  2. <form asp-controller="Leaves" asp-action="Create" method="post" class="form-horizontal" role="form">  
  3. <div asp-validation-summary="ModelOnly"></div>  
  4. <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>  
  5. <div class="form-group" style="display: flex">  
  6. <script type="text/javascript">$(document).ready(function () {  
  7. $("#GFG :input").prop("disabled", true);  
  8. });  
  9. function enable_disable() {  
  10. $("#GFG :input").prop("disabled", false);  
  11. }</script>  
  12. <input class="form-control col-sm-2" data-toggle="tooltip" data-placement="left" title="Employee Identiy Number" readonly />  
  13. <div class="col-sm-3">  
  14. <select onclick="enable_disable()"  
  15. class="form-control" value="Enable"  
  16. id="LId3">  
  17. </select>  
  18. </div>  
  19. </div>  
  20. </form>  
  21. <form asp-controller="Leaves" asp-action="Create" method="post" class="form-horizontal" role="form" id="GFG">  
  22. <div asp-validation-summary="ModelOnly"></div>  
  23. <div class="form-group" style="display: flex">  
  24. <input class="form-control col-sm-2" value="Name" data-toggle="tooltip" data-placement="left" title="Name of employee" readonly />  
  25. <div class="col-sm-3">  
  26. <select asp-for="LId" id="LId1"  
  27. class="form-control"  
  28. asp-items="@(new SelectList(ViewBag.ListOfTable,"LId", "EmpName"))">  
  29. </select>  
  30. </div>  
  31. </div>  
  32. <div class="form-group" style="display: flex">  
  33. <input class="form-control col-sm-2" disabled value="Surname" data-toggle="tooltip" data-placement="left" title="Surname of employee" readonly />  
  34. <div class="col-sm-3">  
  35. <select asp-for="LId" id="LId2"  
  36. class="form-control"  
  37. asp-items="@(new SelectList(@ViewBag.ListOfTable,"LId", "EmpSurname"))">  
  38. </select>  
  39. </div>  
  40. </div>  
  41. <div class="form-group" style="display: flex">  
  42. <input class="form-control col-sm-2" value="Type of Leave" readonly />  
  43. <div class="col-sm-3">  
  44. <select asp-for="TypeOfLeave" name="offer" id="leave" class="form-control">  
  45. <option value="0">Select</option>  
  46. <option value="Sick">Sick</option>  
  47. <option value="Family Responsibility">Family Responsibility</option>  
  48. <option value="Study">Study</option>  
  49. <option value="Vacation">Vacation</option>  
  50. <option value="Bereavement">Bereavement</option>  
  51. <option value="TimeOffWithoutPay">Time Off Without Pay</option>  
  52. <option value="Military">Military</option>  
  53. <option value="JuryDuty">Jury Duty</option>  
  54. <option value="Maternity/Paternity">Maternity/Paternity</option>  
  55. <option value="Other">Other</option>  
  56. </select>  
  57. <span asp-validation-for="TypeOfLeave" class="text-danger"></span>  
  58. </div>  
  59. </div>
  
  60. </form>  
Answers (2)
Next Recommended Forum