Форум

apolon13 · #1 (**permalink**) 02.05.2015, 23:16

Доброго времени суток.
Столкнулся я с такой проблемой.
При попытке вытащить данные из бд получаю пустоту.
вот код:HTML

<body>
	<div class="container"><ul>
	<li><a href="id1">Товары для отдыха</a></li>
	<li><a href="id2">Товары для дома</a></li>
	<li><a href="id3">Специальные ножи</a></li>
	<li><a href="id4">Детские санки</a></li>
	</ul>
	</div>
	<div style="clear: both;"></div>
	<div id="container2" class="container"></div>
	<div style="clear: both;"></div>
	<div id="container3" class="container"></div>
	
	
</body>

Вот тут код ajax запроса

$(document).ready(function(){
  
  
  $('.container:not(:first)').hide();
  
$('.container a').click(function(e){
var res = $(this).attr('href');
	$.ajax({
	  type: "POST",
	  url: "ajax.php",
	  data:"id="+ res,
	  success: function(data)
	  {		
		$('#container2').hide().html(data).fadeIn(200);		
		return false	
	  }
		});
		return false
	});
	
	$('#container2').live('click', function(){
	var res = $(this).attr('href');
	$.ajax({
	  type: "POST",
	  url: "ajax.php",
	  data:"id="+ res,
	  success: function(data)
	  {		
		alert(data);
		return false	
	  }
		});
		return false
	
});
ну и вот самый наипростейший php обработчик
[PHP] 
	if(isset($_POST['id'])){
	$a = $_POST['id'];}
	
	$inter = preg_replace("/\D/","",$a);
	if(isset($inter))
	{$db=mysql_connect('localhost','root','root');
	mysql_select_db('r5409416_apolon',$db);
	$result = mysql_query("SELECT links FROM links WHERE id=".$inter ,$db);
	$q=mysql_fetch_array($result);
	printf ("%s",$q['links']);	
	}
	
	
[/PHP]

Ну так вся СОЛЬ вот в чём.
при попытке запросить из бд записи по id у ссылок,которые пришли тоже из БД
Я получаю в alert(Пустоту)!
А для работы с новыми элементами я использую 
[JS]$('#container2').live('click', function(){
	var res = $(this).attr('href');
	$.ajax({
	  type: "POST",
	  url: "ajax.php",
	  data:"id="+ res,
	  success: function(data)
	  {		
		alert(data);
		return false	
	  }
		});
		return false

хотя метод .live вроде бы уже и не используется.

В общем помогите кто как может пжлс.
работать с ajax я только учусь и ничего не понимаю

Есть ссылка даже на сам мини http://r5409416.bget.ru/

laimas · #2 (**permalink**) 03.05.2015, 00:28

Зачем href="id1", просто цифры (если нет иных параметров запроса в url, иначе лучше использовать data для задания id), да и в случае, если url будет содержать иные цифры кроме указанных в href ссылок, то номер id будет неверным.

<li><a href="1">Товары для отдыха</a></li>
<li><a href="2">Товары для дома</a></li>
<li><a href="3">Специальные ножи</a></li>
<li><a href="4">Детские санки</a></li>

Метод .leve() устарел, да и этот метод для динамически создаваемых элементов, если список UL со ссылками всегда на странице, то он не нужен и достаточно .click(). Иначе метод .on() с делегированием обработки события onclick ближайшему родителю гарантировано присутствующему на странице.

$('.container a').click(function(e) {
        e.preventDefault();
        $.ajax({
            type: "POST",
            url: "ajax.php",
            data:"id="+this.href.split('/').pop(),
            success: function(data) {    
                $('#container2').hide().html(data).fadeIn(200);    
            }
        });
    });

Зачем повторять такое же $('#container2') не понятно, нужно все привести к одному обработчику.
На стороне сервера так:
а) если ajax.php обрабатывает только эти запросы по параметру id, то не надо никаких isset($_POST['id']), а нужно проверять истинность параметра, ибо работа этого скрипта начнется только именно по POST запросу. Кроме того, даже если поступать так, то уже не if(isset($inter)), а if($inter).
б) если ajax.php обрабатывает различные запросы по различным ключам, то нужно определять имя ключа, тут уже можно и isset($_POST['id']), и switch по ключам, и т.п...
Если а), то:

if($id = (int)$_POST['id']) {
    //запрос к базе
    //только что может дать
    printf ("%s",$q['links']);
    //кроме самих значений полей для html, конечно, если база не хранит html-кода
} //иначе параметр не id

apolon13 · #3 (**permalink**) 03.05.2015, 10:22

laimas,

Цитата:

Метод .leve() устарел, да и этот метод для динамически создаваемых элементов, если список UL со ссылками всегда на странице, то он не нужен и достаточно .click(). Иначе метод .on() с делегированием обработки события onclick ближайшему родителю гарантировано присутствующему на странице.

Так в том и дело что список ul с ссылками приходит из БД со своими id, значение которых соответствует id следующего уровня ссылок.И в итоге надо получить 5 уровней каталога.Но на 2-ом уровне всё встаёт.
и задача состоит в том что бы прицепить ajax к любым приходящим из бд ссылкам.

но метод .on не работает,как уж только я не пробовал.
вот например даже тут preventDefault не срабатывает.
Пробовал в различных вариантах
облазил кучу форумов
по сути должно работать.
Но не работает

Может быть я где то сильно ошибаюсь

$('.container:not(:first)').hide();
  
  $('.container a').click(function(e) {
        e.preventDefault();
        $.ajax({
            type: "POST",
            url: "ajax.php",
            data:"id="+this.href.split('/').pop(),
            success: function(data) {    
                $('#container2').hide().html(data).fadeIn(200); 
					$(document).on("click", "#container2 a", function(e) {
				e.preventDefault();
				});					
            }
        });
    });

apolon13 · #4 (**permalink**) 03.05.2015, 10:33

Цитата:

Зачем повторять такое же $('#container2') не понятно, нужно все привести к одному обработчику.

Согласен.
Повторять обработчик глупо.

laimas · #5 (**permalink**) 03.05.2015, 12:49

но метод .on не работает,как уж только я не пробовал.

Не так нужно устанавливать обработчики для ссылок контейнера '#container2'. Если таком образом как:

$(document).on("click", "#container2 a", function(e) ...

то это нужно было прописать в $(document).ready(function()...

А при получении их в success так:

$('#container2').hide()
                .html(data)
                .fadeIn(200)
                .find('a')
                .click(function(e) {
                    e.preventDefault();
                    //.....
                });

apolon13 · #6 (**permalink**) 03.05.2015, 13:11

laimas,
Всё понял
Тут огромное пасибо что разъяснил.

Но по сути сейчас ajax должен автоматически подцеплять ссылки пришедшие из бд.
Но этого не происходит.
При клике на ссылку например с id 11
Он должен вытащить из бд ещё список и вставить его в #container2, т.е заменить его html код
Но браузер молчит, ничего не происходит.

apolon13 · #7 (**permalink**) 03.05.2015, 13:13

laimas,
Ведь как я понимаю нового post запроса не нужно формировать

laimas · #8 (**permalink**) 03.05.2015, 14:48

У вас код:
<div id="container2" class="container"></div>
<div id="container3" class="container"></div>

То есть элементы с классом container всегда на странице, я правильно понимаю? А если так, что объявление обработчиков нужно производить сразу при загрузке страницы:

$('.container').on('click' 'a', function(e) {
     e.preventDefault();
     //и далее запрос 
     //$.ajax ....
});

удалив установку их bp success, то есть в нем останется только:

$('#container2').hide().html(data).fadeIn(200);

И события у ссылок будут обрабатываться, это можно проверить и посредством alert. Проверьте.

apolon13 · #9 (**permalink**) 03.05.2015, 16:12

laimas,
Да,верно, класс .container присутствует везде.

В конечном итоге если я всё правильно понял,получился такой код;

$(document).ready(function(){
  
  
  $('.container:not(:first)').hide();
  
  $('.container').on('click','a',function(e) {
        e.preventDefault();
        $.ajax({
            type: "POST",
            url: "ajax.php",
            data:"id="+this.href.split('/').pop(),
            success: function(data) {    
                $('#container2').hide().html(data).fadeIn(200);			
            }
			});
        
    });
  
	
});

но теперь просто при клике на любую ссылку он просто по ней переходит.
т.е e.preventDefault(); уже как минимум не работатет.

И в консоли еще ошибка Uncaught TypeError: $(...).on is not a function

Вот беда

laimas · #10 (**permalink**) 03.05.2015, 16:25

<html> 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script> 
$(function() {
    $('a').click(function(e) {
        e.preventDefault();
        alert('Нет, не будет!')
    })
});
</script>     
</head> 
<body>
<a href="!55536!http://javascript.ru/forum/ajax/55536-ne-mogu-vytashhit-dannye-iz-bd.html#post369286">Переход будет?</a>
</body> 
</html>

Пробуйте.
Какая версия jQuery используется?

Форум

Справочник

Discord чат

Курсы javascript