javascript variable value not updating with new one after a html form submit

Question

I have a 8 textbox in my html form wrapped with div ids fa1 to fa8. two are visible by default and 6 are hidden. I am using a two buttons addfa and removefa to show and hide the divs.I need to keep the div count after form submit and I am using below html to update the value in html (by default it is 3 and if I display a hidden div it will change to 4..)

html code:

<div class="add_remove_column">
<?php
 if(isset($_POST['countfa'])){  
 $valueid = $_POST['countfa'];
 ?>
<input  type="hidden" id="countfa" name="countfa" value="<?= $valueid ?>" readonly>
<?php
 }else{
  ?>

<input  type="hidden" id="countfa" name="countfa" value="3" readonly> 
 <?php
 }
?>
    <button type="button" onClick="AddNewFa();" id="addfa" > + Add New FA </button>
    <button  type="button" onClick="RemoveNewFa();" id="removefa" disabled="disabled"> - Remove FA</button> 
</div>

javascript for add button:

function AddNewFa() 
    {
        var facount = parseInt($('#countfa').val(),9) ;
        if( facount < 9)
            {
                facount = facount+1;

                for(i=3;i<9;i++)
                {
                    if( i<facount )
                        $('#fa'+i).slideDown("fast");
                    else
                        $('#fa'+i).slideUp("fast"); 

                }
                $('#countfa').val(facount);  

            }
        if( facount ==9 )
            { $('#addfa').attr('disabled','disabled');} 
        if( facount ==4 )
            { $('#removefa').removeAttr("disabled");}

    } 

As per the javascript if the facount value is 4 and above it suppose to remove the disabled attribute from the removefa button.

I see if I select additional one div, the countfa changing to 4 after form submit, but the removefa button still disabled. It suppose to be in enabled state, what is going wrong here ?

Answer 1

You need to check for greater than or equals to. Also need to use .prop() to set disabled property

if (facount >= 4) {
    $('#removefa').prop('disabled', false);
}

or try

$('#removefa').prop('disabled', facount < 4);