Здравствуйте, есть задача: по клику получать данные из БД. При клике передается идентификатор, который берет значение из скрытого input, по которому происходит выборка из БД. Вставить их в div.result который есть в каждом блоке.
В данном случае, у каждой кнопке на странице уникальный Id. Щас задача реализована, но очень много кода получилось, так как пришлось отбирать каждый Id (8 штук) и на каждый вешать обработчик.
Меню в виде аккордеона.
При клике h2.acc_trigger раскрывается блок <div class="block"> с содержимым, в котором и находится нужная кнопка.
Вид как и кнопки (<a id="pokazRasp<?=$item['seminar_id'];?>" class="a_seminar">Показать расписание</a>) формируются динамически:
<?php foreach ($seminars_all as $item):?>
<div class="container">
<h2 class="acc_trigger"><a href="#"><?=$item['zagolovok'];?></a></h2>
<div class="acc_container">
<div class="block">
<?=$item['main_text'];?><br />
<a class="svernut a_seminar">Свернуть описание</a>
<a id="pokazRasp<?=$item['seminar_id'];?>" class="a_seminar">Показать расписание</a>
<a class="pokazOtzv a_seminar" title="<?=$item['seminar_id'];?>">Показать отзывы</a>
<div class="clear"></div>
<div id="result<?=$item['seminar_id'];?>"></div>
<input type="hidden" id="pole<?=$item['seminar_id'];?>" value="<?=$item['seminar_id'];?>"/>
</div>
</div>
</div>
<?php endforeach;?>
Вот код jquery по обработке нажатия на кнопку
===================================================================================
показ и скрытие таблицы с расписанием
*/
$('#pokazRasp1').toggle(function(){
//$('#new3 .pokazRasp.a_seminar').live('toggle', function(){
var b = $('#result1');
b.empty(); //очищения блока от содержимого
b.fadeIn(); //сворачивание блока
$(this).text('Скрыть расписание'); //изменение надписи на кнопке
var pokazOtzv = $('.pokazOtzv.a_seminar').eq(0);
if(pokazOtzv.text()=='Скрыть отзывы') {
pokazOtzv.text('Показать отзывы');
}
}, function(){
var b = $('#result1');
b.fadeOut();
var pokazOtzv = $('.pokazOtzv.a_seminar').eq(0);
if(pokazOtzv.text()=='Скрыть отзывы') {
pokazOtzv.text('Показать отзывы');
}
$(this).text('Показать расписание');
}); //конец toggle
Я попытался сделать так:
//=====добавляет класс new3 к активного блоку, т.е тот который //открылся
$('.acc_trigger').click(function(){
var b = $('.acc_trigger + div');
b.removeAttr('id', 'nameID').attr('id','new3');
});
У всех 8-ми кнопок вместо Id сделал один класс pokazRasp. У input сделал класс pole, но value у каждого разное.
попытался их отобрать просто
$('#new3 .pokazRasp').click(function() {
var seminarId = $(‘#new3 .pole’).val();
alert(seminarId);
})
Реакция ноль, а если так то работает, но value берет все время из первого блока:
$('#new3 .pokazRasp').live(‘click’, (function() {
var seminarId = $(‘#new3 .pole’).val();
alert(seminarId);
})
Вот новый вид,
<?php foreach ($seminars_all as $item):?>
<div class="container">
<h2 class="acc_trigger"><a href="#"><?=$item['zagolovok'];?></a></h2>
<div class="acc_container">
<div class="block">
<?=$item['main_text'];?><br />
<a class="svernut a_seminar">Свернуть описание</a>
<a class="pokazRasp a_seminar">Показать расписание</a>
<a class="pokazOtzv a_seminar" title="<?=$item['seminar_id'];?>">Показать отзывы</a>
<div class="clear"></div>
<div class="result"></div>
<input type="hidden" class="pole" value="<?=$item['seminar_id'];?>"/>
</div>
</div>
</div>
<?php endforeach;?>
Хочется сделать универсальную выборку.
