checkbox not send correct value true or false when click approve butto

Question

I work on asp.net MVC application I face issue check box yes or no send false value yes or no when click approve button

I have two check box one represent true and second false as user requested and i don't it to be radio button because bossiness user request it . Yes represent true No represent false

I Face Issue when select Yes or no for first time it send value correctly if Yes then true or No then false but when i select Yes or No for second time it not working correctly and send only false to approve button what i try

1 - user UI for Yes or No

 <td style="width: 50%; font-weight: bold; padding-top: 10px;">
      @Html.Label("Did you try to retain the staff?", htmlAttributes: new { @class = "control-label col-md-5" })
      <div class="col-md-7">
          <input type="checkbox" id="RetainStuff" name="RetainStuff" value="true" class="retaindtuff-checkbox" @(Model.RetainStuff == true ? "checked" : "") />
          Yes
          &nbsp;&nbsp;
          <input type="checkbox" id="RetainStuff" name="RetainStuff" value="false" class="retaindtuff-checkbox" @(Model.RetainStuff == false ? "checked" : "") />
          No
      </div>
  </td>
   <a id="approveControlsId" onclick="submit();" class="btn btn-primary" style="min-width: 100px;margin-top:5px;"><i class="glyphicon glyphicon-ok"></i> Approve </a>

2 - when change yes or no check box to get false of retain stuff i use jQuery as below

 $('.retaindtuff-checkbox').on('change', function () {
     $('.retaindtuff-checkbox').not(this).prop('checked', false);
     var selectedValue = $(this).val();
     $('#RetainStuff').val(selectedValue);

 });

 

3 - when click button approve it call submit function as below

function submit() {
        console.log("check submit");
            var ResignationRequester = new Object();
            ResignationRequester.RequestNo = document.getElementById("RequestNo").innerHTML.trim();
   
  

        var RetainStuffElement = document.getElementById("RetainStuff");

        if (RetainStuffElement) {
           
            var RetainStuffElementExist = document.querySelector('input[name="RetainStuff"]:checked');
          
            if (RetainStuffElementExist && RetainStuffElementExist.value === "false") {
                ResignationRequester.RetainStuff = RetainStuffElementExist.value;
                Swal.fire({
                    icon: 'warning',
                    title: 'Retain Stuff is Empty',
                    text: 'retain stuff comment is empty and retain stuff is No '
                });
                ResignationRequester.RetainStuff = null;
                return false;
            } 
            else if (RetainStuffElementExist) {
                ResignationRequester.RetainStuff = RetainStuffElementExist.value;
               
            } 
            else {
                ResignationRequester.RetainStuff = null;
                Swal.fire({
                    icon: 'warning',

                    title: 'Retain Stuff is Empty',
                    text: 'Retain Stuff Must Not Empty'
                });
                return false;
            }
        }
        else {
            ResignationRequester.RetainStuff = "";

        }
 
            if (ResignationRequester != null) {
                $.ajax({
         
                   
            }
    }  

4 - action result calling ApprovalIndex on resignation controller 

public async Task<ActionResult> ApprovalIndex(ResignationRequester REQ) 
{ 
//update approve status 
}

so why checkbox yes or no working on first time only Image for page i work on it

my image to show screen