Submit value of a checkbox through javascript

try this.

function SubmitFormData2() {
        var preffered_loc = $("#preffered_loc").val();
        var relocation = $("#relocation").is(":checked");
        var relyn = "";
        if(relocation){
            relyn = "Yes";
        }else{
            relyn = "No";
        }
        $.post("r_two.php", { preffered_loc: preffered_loc,relocation: relyn },
        function(data) {
           $('#results').html(data);
           $('#myForm2')[0].reset();
        });
        alert("{ preffered_loc: "+preffered_loc+",relocation: "+relyn+" }");
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="myForm2" method="post" style="margin-left: -10%;">
        <input type="text" class="form-control" id="preffered_loc" name="preffered_loc">
        <input type="checkbox" name="relocation[]" id="relocation" /> 
        <input type="button" id="submitFormData2" onclick="SubmitFormData2();" value="Submit" />
    </form>

As Satpal said:

• You don't need two checkbox, maybe you want a radio button, but one checkbox can be checked = yes, not checked = no. I removed one of them.
• You don't have an ID relocation. I changed it.
• With the jQuery is(":checked") you get a true or false so I parse it to a Yes or No, following your code.

Since its a checkbox and not a radio user can have multiple selections, for eg:

<input type="checkbox" name="relocation[]" class="relocation" value="Yes">
<input type="checkbox" name="relocation[]" class="relocation" value="No" >
<input type="checkbox" name="relocation[]" class="relocation" value="Both" >

try using the :checked selector,

$( ".relocation:checked" ).each(function(i,v){
   alert(v.value)
});

Demo here

I think you should use class for the check-boxes instead of id, because id must be unique for each field. You should try this:

 <form id="myForm2" method="post" style="margin-left: -10%;">
        <input type="text" class="form-control" id="preffered_loc" name="preffered_loc">
        <input type="checkbox" name="relocation[]" class="relocation" value="Yes">
        <input type="checkbox" name="relocation[]" class="relocation" value="No" > 
        <input type="button" id="submitFormData2" onclick="SubmitFormData2();" value="Submit" />
    </form> 

   <script>
    function SubmitFormData2() {
        var preffered_loc = $("#preffered_loc").val();
    var relocation = '';
    var sap = '';
    $( ".relocation" ).each(function() {

        if($( this ).is(':checked')){
            relocation = relocation+''+sap+''+$( this ).val();
            sap = ',';
        }
    });
        alert(rel);
        $.post("r_two.php", { preffered_loc: preffered_loc,relocation: relocation },
        function(data) {
         $('#results').html(data);
         $('#myForm2')[0].reset();
        });
    }
    </script>

Here is a sample code for your reference

<form id="myForm" method="post">
     Name:    <input name="name" id="name" type="text" /><br />
     Email:   <input name="email" id="email" type="text" /><br />
     Phone No:<input name="phone" id="phone" type="text" /><br />
     Gender:  <input name="gender" type="radio" value="male">Male
          <input name="gender" type="radio" value="female">Female<br />

    <input type="button" id="submitFormData" onclick="SubmitFormData();" value="Submit" />
   </form>

function SubmitFormData() {
    var name = $("#name").val();
    var email = $("#email").val();
    var phone = $("#phone").val();
    var gender = $("input[type=radio]:checked").val();
    $.post("submit.php", { name: name, email: email, phone: phone, gender: gender },
    function(data) {
     $('#results').html(data);
     $('#myForm')[0].reset();
    });
}

You couldn't select the checkbox elements at all because you weren't including the [] in the selector. You can either escape the brackets as described in this SO Q/A or simply remove the brackets (the example code below does the latter)

I'd suggest using radio buttons as the user can immediately see what the options are. (Have a third option for both)

The code below uses checkboxes and puts all selected options into an array that gets passed along. This will allow the user to use both options

<script>
  function SubmitFormData2() {
      var preffered_loc = $("#preffered_loc").val();
      var relocation = [];
     $(".relocation:checked").each(function () {
        relocation.push ($this.vak ();
     }); // :checked is provided by jquery and will only select a checkbox/radio button that is checked
      $.post("r_two.php", { preffered_loc: preffered_loc,relocation: relocation },
      function(data) {
       $('#results').html(data);
       $('#myForm2')[0].reset();
      });
  }

And don't forget to remove [] from the checkboxes class.

<script>
        function SubmitFormData2() {
            var preffered_loc   = $("#preffered_loc").val();
            var relocation      = {};

            $('.relocation').each(function(index) {
                if ($(this).is(':checked')) {
                    relocation[index] = $(this).val();
                }
            });

            relocation = JSON.stringify(relocation);

            $.post("r_two.php", { preffered_loc: preffered_loc, relocation: relocation }, function(data) {
               $('#results').html(data);
               $('#myForm2')[0].reset();              
            });
        }
    </script>

Variable 'relocation' must be an object to contain multiple values, like you said a user can select both YES and NO. And change the checkbox class from relocation[] to relocation.