Pass HTML select value to PHP with ajax

There are several things that can improve in your code. Let's go to it:

I see that you want to use the $ .post for that you need jQuery, that error that you have to 'post' of undefined, means that the $ or jQuery is not defined. Remember that you should always add the link to jQuery:

https://code.jquery.com/jquery-3.1.1.min.js

Also to add events to the DOM you must make sure that the document is ready, you can use:

$('body').ready

What is inside of this .ready will be executed when the body is ready. Although I have not finished loading everything yet. or

$(window).load

What is inside the .load will be executed when the window has loaded, that is to say that the DOM may be ready but there are still images loading, this is executed until everything ends.

Now to make your code look cleaner I would make a function in js to select a select option. Something similar to:

function selectOption (value_to_select) {
 $('#select-id').val(value_to_select);
}

This way you would do:

$('body').ready(function () {
  var option_to_select = 2;

  selectOption(option_to_select);
});

And now when the DOM loads, you will have the option you want selected without mixing both the php and the html.

Now to send the data to the server, you can do several things, the easiest is to listen to the "submit" event of the form and execute the $ .ajax, since if you have require or email fields, the validation by the of the browser is going to be done before launching the "submit". It would be something like this:

$('#form-id').on('submit', function () {
  var valueToSend = $('#select-id').val();
  $.ajax({
    method: 'POST',
    url: 'myPage.php',
    data: {
       myVal: valueToSend
    },
    success: function (data) {
       console.log('Success: ' + data); // Este callback se lanza cuando la url 'myPage' responde con status 200.
    },
    error: function (data) {
       console.log('Error: ' + data); // Este callback que se lanzara si la url 'myPage.php' responde con status de error, e.g. 400, 404, 500, etc...
    }
  });
});

With this a call is sent $ .ajax to the page 'myPage.php', in that parameter you will put the page where you want to send the request. I leave the documentation: link

And to grab the value with PHP, you lock it with the variable $ _POST:

$_POST['myVal']; // OJO: cuando lo mandas en el data, se cacha con el nombre que le diste al parámetro: myVal: valueToSend.

With JQuery it would be something like this:

var value = $("#lista").val();

$.ajax({
  url:'consulta.php?value='+value ,
  method: 'post',
  data: {},

});

 $(function(){
    $("#lista[name='name']").change(function () {
       var tu_variable_seleccionada = $(this).val();
       $.ajax({
         type: "POST",
         //Se omite la url por que es la misma página
         //url: "tu_url",
         //Variable envíada por ajax que recibe php
         data: {selected: tu_variable_seleccionada},
         success: function(data) {
           // Si todo sale bien, puedes agregar algo
         },
         error: function(data) {
           // Si fue error, recibes el error 
         }
    });
   });
  });

$("#cbo_cargos").change(function(){
   cargoValue=$(this).val();
});