javascript - How to disable dropdowns and buttons based on the value of a column in a table -
i have table set of columns fetching values database along dropdown , button in each row. depending on value of 1 of columns(year), dropdown (salary) , button (update) need disabled.
i tried 2 different approaches using javascript , jquery. both don't seem work.
1) tried triggering event on pageload using javascript
<body onload="dropdowndisabler();">
javascript part:
function dropdowndisabler() { if ($("#year").val() >= 2005) { $("#salary").enabled=false; $("#update").enabled=false; } }
2) tried matching year column elements have criteria using jquery:
if($('#year').val() >= 2005) { $(this).find("#salary").prop('disabled',true); $(this).find("#update").prop('disabled',true); }
you can iterate on rows, check value of year , set disabled property on select
, button
element in row:
$(document).ready(function() { $("#updatesalary tbody tr").each(function( index ) { var $this = $(this); if ($this.children("td:first").text() >= 2005 ) { $this.find("select, button").prop("disabled", true); } }); });
note since have multiple rows (i assume), should not use ids elements, id's must unique on each document. use classes though more target elements within each row, e.g. <td class="year">2004</td>
Comments
Post a Comment