javascript - After checked values is not getting unchecked -

my requirement once click on checkbox , save/update textbox should disabled , when uncheck , save/update textbox should enabled. during check latest_file value should 1 , during uncheck value should 0. here code tried:

function disablefilename() {     var latestfile = $("#latestfile").is(":checked");     if (latestfile) {         $("#filename").attr("disabled", "disabled");     } else {         $("#filename").removeattr("disabled");     } } 

<table>     <tr>         <td>process latest file feed location  </td>         <td>             <s:checkbox property="latestfile" styleid="latestfile" value="1" onclick="disablefilename();" tabindex="5" />         </td>     </tr>     <tr>         <td>file name</td>         <td nowrap="true">             <s:text property="filename" styleclass="textbox" styleid="filename" style="{width:150}" tabindex="6" />         </td>     </tr> </table> 

javascript @ question returns expected result disablefilename, #latestfile, #filename defined. toggle value of #latestfile can use $("#latestfile").val(1); @ if, $("#latestfile").val(1); @ else

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <script>  function disablefilename() {          var latestfile = $("#latestfile").is(":checked");      if (latestfile) {          $("#latestfile").val(1);          $("#filename").attr("disabled", "disabled");      } else {         $("#latestfile").val(0);          $("#filename").removeattr("disabled");      }      console.log($("#latestfile").val());  }  </script>  <table>    <tr>      <td>process latest file feed location</td>      <td>        <input type="checkbox" property="latestfile" id="latestfile" value="1" onclick="disablefilename();" tabindex="5" />      </td>    </tr>    <tr>      <td>file name</td>      <td nowrap="true">        <input type="text" property="filename" class="textbox" id="filename" style="width:150" tabindex="6" />      </td>    </tr>  </table>