Видимость переменной

[rafaello]

Привет всем!
Вроде запутался в трех соснах. Хелп!!!!

function get_content(jj){
..........// здесь код
jQuery.ajax({
        type: 'POST',
        url: '<?php echo get_template_directory_uri();?>/hxr.php',
        data:'id=380&page_num='+jj,
       success: function (data) {
      if(data){ var rez = JSON.parse(data);
     ..........// здесь код
     var pages = rez[0].total_pages;
    ..........// здесь код
       }}});
..........// здесь код
jQuery('#paginationn').twbsPagination({
        totalPages: pages,
        visiblePages: 7,
        onPageClick: function (event, page) {
            
        }
    });
}

это все внутри одной функции get_content();
После ответа сервера парсим json и определяем переменную var pages. Однако ниже при вызове эта переменная не видна (не определена).
Пробовал даже так
window.pages = rez[0].total_pages;
все равно в пагинацию она не вставляется (не определена).
Хелп, плиз!

[Nexus]

Почитайте про асинхронность в js.

В первом случае вы определяете локальную переменную, которая живет только в теле своей функции, т.е. она не может быть использована вне этой функции.
Во втором случае вы значение записываете в глобальную переменную, однако...

Проблема в том, что у вас пагинация строится еще до того, как асинхронный запрос был завершен, т.е. итоговое кол-во страниц в этот момент все еще неизвестно.

[rafaello]

честно говоря не очень ясно понял, что вы говорите.
Переменная var pages и пагинация twbsPagination() - это все внутри одной функции. А значение var pages присваивается из ответа сервера после mysqli запроса через массив json. То есть значение var pages уже определено до пагинации. Проблема в том, что она не видна в пагинации!!!!

[Nexus]

это все внутри одной функции

Родитель у них общий, да, но переменная pages у вас определяется внутри callback-функции, которую вы передаете в метод "ajax" библиотеки "jQuery". Переменная не может "выглядывать" из своей области видимости.
Определите это переменную в функции get_content, а в callback-функции только измените её значение, тогда она будет доступна в кач-ве параметра для метода "twbsPagination" (однако значение у нее будет то, что вы объявите при инициализации).

То есть значение var pages уже определено до пагинации.

У вас запрос асинхронный, поэтому то, что у вас запрос к серверу стоит до построения пагинации не говорит о том, что пагинация начнет строиться после завершения запроса.

Попробуйте запустить такой код и посмотрите консоль:

function get_content(jj) {
    var pages = 0;

    console.log('get_content: make async request');

    jQuery.ajax({
        type: 'POST',
        url: '<?php echo get_template_directory_uri();?>/hxr.php',
        data: 'id=380&page_num=' + jj,
        success: function(data) {
            console.log('get_content: request completed');
            if (data) {
                var rez = JSON.parse(data);

                pages = rez[0].total_pages;

                console.log('get_content: pages variable values was changed');
            }
        }
    });

    console.log('get_content: build pagination with the pages variable value: ' + pages);
    jQuery('#paginationn').twbsPagination({
        totalPages: pages,
        visiblePages: 7,
        onPageClick: function(event, page) {

        }
    });
}

[rafaello]

а.... вроде понял. Спасибо!
Так как же решить данный вопрос?
Что то типа, пока не придет ответ от сервера, не запускать пагинацию или как ?

[Nexus]

rafaello,

Так как же решить данный вопрос?

Можно так:

function getTotalPagesNumber(pageNum) {
    return new Promise(function(resolve) {
        jQuery.ajax({
            type: 'POST',
            url: '<?php echo get_template_directory_uri();?>/hxr.php',
            data: 'id=380&page_num=' + (pageNum || 1),
            success: function(data) {
                if (data typeof === 'string')
                    data = JSON.parse(data);

                resolve(data[0].total_pages);

            }
        });
    });
};

function get_content(jj) {
    ///your code here
    getTotalPagesNumber(jj).then(function(totalPages) {
        jQuery('#paginationn').twbsPagination({
            totalPages: totalPages,
            visiblePages: 7,
            onPageClick: function(event, page) {

            }
        });
    });
}

Еще можно сделать ваш запрос синхронным (браузер затупит до окончания запроса), также можно запустить построение пагинации в callback-функции, которую вы передаете в метод ajax

[Malleys]

Вроде запутался в трех соснах

async to the rescue

async function get_content(jj) {
	// здесь код
	const data = await jQuery.ajax({
		type: 'POST',
		url: '<?php echo get_template_directory_uri();?>/hxr.php',
		data: 'id=380&page_num=' + (pageNum || 1)
	});
	// здесь код
	var rez = JSON.parse(data);
	// здесь код
	var pages = rez[0].total_pages;
	// здесь код
	jQuery('#paginationn').twbsPagination({
		totalPages: pages,
		visiblePages: 7,
		onPageClick: function(event, page) {

		}
	});
}

[rafaello]

Понял. Ура!!! Спасибо.