Как вернуть значение которое передал ajax?

Question

[zerofx]

Привет всем, у меня проблема, проблема с выводом данных переданные через ajax.
Суть задачи очень проста - по клику взять дата атрибут - ID поста, и передать его в функцию которая есть в блоке модального окна, и выводит его контент.
ID через ajax - я передал, но как его вставить в модальное окно, точнее подставить ID в переменную цикла, которая отвечает за номер поста понимаю, не получается.

Подскажите как быть.

Также заметил что окно с контентом открывается быстрее ... чем в консоли приходит ответ о том, что ID посту передалось.

код ajax на сервер:

$(document).ready(function() {
	$('.mod_box, .test').click(function() {
		var data_atr = $(this).data('pid');
		console.log(data_atr);
	    $.ajax({
	        type: "POST",
	        url: url_site + "/wp-admin/admin-ajax.php",
	        data: {
	            action : 'get_data',
	            pid: data_atr
	        },
	        success: function (response) {
	            console.log('AJAX response : ',response);
	        },
	        error: function (error) {
	            console.log('AJAX Error : ',error);
	        }
	    });
    });
});

WP функция:

$url_site = get_site_url();

function ajx_get_data() {
	// $url_site = get_site_url();
	$p_id = absint( $_POST['pid'] );
	$response = [
		'success' => true,
		'data' => [
			'html' => $p_id
		]
	];
	echo json_encode($response);
	die();
}


/*Ajax  WP Func*/
add_action( 'wp_ajax_get_data',        'ajx_get_data' ); 
add_action( 'wp_ajax_nopriv_get_data', 'ajx_get_data' );

Answer 1

[Игорь Воротнёв]

Правильно вам говорят. У вас сейчас вызов модалки и аякс-запрос - совершенно никак не связанные события, выполняющиеся независимо друг от друга. Даже если в коде вызов модалки у вас идет после аякс-запроса, модалка выскочит раньше получения ответа. Выполняете запрос, а уже в нем, когда у вас success - открываете модалку и передаете в нее полученное (на этот момент - точно полученное) значение. Аякс асинхронный, то есть javascript-движок запрос отправил и пошел выполнять следующий код (в вашем случае - открывать модалку) не дожидаясь ответа.

Comments

[zerofx]

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

ок в основном понял и благодарю за помощь)
буду пробовать - увидим что из этого получится

[Игорь Воротнёв]

zerofx: Ну, мы объясняем что и почему, чтобы в следующий раз было понимание. Можно просто дать вам код, вы его вставите, но в следующий раз вопрос у вас возникнет снова. Можно дать человеку рыбу, а можно дать сеть и научить эту рыбу ловить. Понимаете? :)

С PHP у вас все ок. А в js должно быть как-то так:

$(document).ready(function() {
  $('.mod_box, .test').click(function() {
    var data_atr = $(this).data('pid');
    console.log(data_atr);
      // тут мы отправили аякс-запрос на сервер
      $.ajax({
          type: "POST",
          url: url_site + "/wp-admin/admin-ajax.php",
          data: {
              action : 'get_data',
              pid: data_atr
          },
          // а тут нам вернулся ответ и успех, мы точно получили ID в response
          success: function (response) {
              console.log('AJAX response : ',response);
              //
              // вот тут надо вызывать открытие модалки
              // 
          },
          error: function (error) {
              console.log('AJAX Error : ',error);
          }
      });
    });
});

[zerofx]

Игорь Воротнёв: друзья я с Вами согласен, ситуация неприятная я потерял программиста а проект надо заканчивать ... я сам вертальщик - не так часто использую php + ajax - но быстро учусь + ситуация помогает =)

Благодарю Вас за помощь - еще один вопрос - но не кричите на меня, для теста захотел просто вызвать php код в js - но что-то он не работает ..

Или мож проще будет файл подключать с нужным

[zerofx]

$('#ajax-content h1').html('<?php echo $url_site ?>')

[zerofx]

просто возвращает строку

[Игорь Воротнёв]

zerofx: Так и должен возвращать строку. Так не сработает :) А что пытаетесь этим добиться?

[zerofx]

Игорь Воротнёв:
это первое шо пришло в голову =)
вообще я хочу передать код цикла, или хотя бы ID поста в цикл чтобы он динамично отражал контент в модальном окне

один знакомый сказал что надо писать отдельно обработчик ajax запросов.
Но оно и как я не понял, может Вы подскажете где почитать?

И как я понимаю один я уже имею - он принимает и сохраняет переданную информацию.

Сейчас нужен тот что будет обрабатывать и передавать код циклка ...

[Игорь Воротнёв]

zerofx: Так у вас же уже есть обработчик, get_data

[zerofx]

Игорь Воротнёв:
ок тогда как мне передать в конкретное место стоникы ajax-content.php - результат? А именно подставить в ID данные переданные ajax?

[Игорь Воротнёв]

zerofx: Ничего не понял. Опишите конкретную ситуацию - есть такая-то страница, на ней такая-то инфа, мне надо по клику вот сюда аяксом динамически подтянуть сюда такую-то инфу. На конкретном примере легче объяснить.

[zerofx]

Игорь Воротнёв:
уже разобрался - спасибо за помощь)

[igix]

Спасибо, все получилось!

Answer 2

[jekanok]

вот так если json возвращает я принемаю     			$(document).on("click",".delete_ads", function(){
                    
			var id = $(this).attr("iid");
            var uid = $('#balance').attr('user');
                    
				$.ajax({
                    type: "POST",  
                    data: {"uid": uid, "id": id},
					url: "./lib/delete_ads.php",
					cache: false,
					success: function(data){
    			datas = JSON.parse(data);
			
			 $.each(datas, function(index, data){
				
                
 });
                        if (datas.true == "true"){
                            
						$('[sss="'+id+'"]').remove();
						
  		                }
                if(datas.true == "false"){
				$("#mesegee").text(datas.echo).show().delay(1500).fadeOut(800);
	
		
			}
			    }
                    
				});
			return false;
		});

а вот так если обычные данные

$(document).on("click",".dellet_img", function(){
        var user = $('#balance').attr('user');
        var ad_id = $(this).attr("linkid");
        var type_job = window.location.hash.substr(1);
        $.ajax({
            type: "POST",
            url: "./lib/dell.php",
            data: {"user":user, "ad_id":ad_id,"type_job":type_job},
            cache: false,
            success: function(response){
                if(response == "true"){
                    $('[iids="'+ad_id+'"]').remove().hide(3000);
                }
            }
        });
		return false;
	});

Comments

[zerofx]

Спасибо за ответ!!!!