Ajax global variable is not getting saved (returns null)

I am trying to modify a global variable $lath , It is a shortcode. This is where i have defined it.

function listing_order(){
    global $lath;
    $lath = array('email','phone');
    foreach ($lath as $item ) {
        get_template_part( '/inc/listingblock/listing', $item ); 
    }       
}

add_shortcode('sideblock', 'listing_order');

---

i want to modify the shortcode with ajax. For this i have created a custom admin menu and options page.I want to change the $lath = array('email','phone'); To $lath = array('phone','email');

This the function which renders the menu page

function listing_function_layout_control()
{

    ?>

     <div  class="info-block">
     <h2 id="info-block" >Listing Sidebar Order</h2>
     <div class="loader"></div>
     </div>
     <ul id="sortui" class="sortui">
        <?php do_shortcode('[sideblock]');?>
     </ul>

     <?php

}

Here do_shortcode is used . so it will be sortable list item

---

This is my ajax code jQuery(document).ready(function($) {

var SortList = $('ul#sortui');
var Animation = $('.loader');
var Text = $('h2#info-block');

SortList.sortable({

    update: function( event, ui){
        Animation.show();


        $.ajax({
            url: Ajax.ajaxurl,
            type:'POST',
            dataType: 'text',
            data:{
                action: 'save_listing_order',
                order: SortList.sortable( 'toArray'),
                security : Ajax.security,
            },
            success: function( response ){

                $('div#message').remove();  
                Animation.hide();
                console.log(SortList.sortable('toArray'));
                .after('<div id="message" class="updated below-h2"><p>The listing order has been updated</p></div>');
                setTimeout(function() {
                    $('div#message').remove();  
                }, 1000);


            },
            error:function (error){
                $('div#message').remove();
                Animation.hide();
                Text.after('<div id="message" class="error below-h2"><p>Error</p></div>');
                setTimeout(function() {
                    $('div#message').remove();  
                }, 1000);
            }
        });
    }

});

});

---

This is my ajax function . here i am trying to save the $lathnew as global variable

function ajax_layoutcontrol()
{

     if (!check_ajax_referer('special-string', 'security')) {
         return wp_send_json_error('Invalid nounce');
     }
     if (!current_user_can('manage_options')) {
         return wp_send_json_error('You are not allowed to do this');
     }

     global $lathnew;
     $lathnew = $_POST['order'];
    wp_send_json_success('Post Saved');
    //die();

}
add_action('wp_ajax_save_listing_order', 'ajax_layoutcontrol');

---

But Now i am using this code in. single.php file.

When i try to var_dumpglobal $lath; var_dump($lath); It shows

array('email','phone');

When i try to make the global $lath= $lathnew;

global $lathnew;
var_dump('$lathnew'); // returns null
var_dump('$lath'); //returns null

I am not sure where i have made a mistake. pls help Thanks