So I have a prev and next month button and on.click events for ajax call. My reference is just a month in string for my example 'April'.

Sample button event for 'next' button,

$(document).on('click', '.events-next', function() {
    var $el = $(this);
    var action = $el.attr('data-action');
    var $month = $('.events-month-option').text();

    $.ajax({
        method: 'post',
        url: path+'js/ajax/get-events.php',
        data: {
            'current_month': $month,
            'action': action,
            'xid': c_xid
        },
        dataType: 'json'

    }).done(function(data){

        console.log(data);

    }).fail(function(data){
        dialogAlert('Error', 'Unable to retrieve events.', 'error');
    });
});

and my Ajax file

$response = array();
$current_month = ($_POST['current_month'] ?? NULL);
$month = date('m', strtotime($current_month));

$action = ($_POST['action'] ?? NULL);

if($action == 'next'){
    $new_period = date('m', strtotime($month.' +1 month'));
} 

$response['new_month'] = $new_period;
$response['action'] = $action;

Why I'm getting a value of 12? instead 05 for May? And after I click my button again it doesn't update anymore.