У меня есть страница с динамически созданным аккордеон с данными о клиентах. В h3-заголовках аккордеона у меня есть промежутки, на которые я могу получить данные для моего запроса ajax. Проблема в том, что у всех аккордеонов есть div, принадлежащий классу "pcom". Как я могу обратиться к определенному "pcom" классу div? Я могу получить данные из заголовка с помощью.find(), поскольку промежутки являются дочерними элементами заголовка. Это не будет работать для обращения к моим div, поскольку они не являются дочерними элементами заголовка h3. Есть идеи?
мой js для запроса:
$("#accordion").accordion({
collapsible: true,
active: false,
header: "h3",
heightStyle: "content",
activate: function() {
var claddress = $('.ui-accordion-header-active').find("span.claddress").text();
var clcity = $('.ui-accordion-header-active').find("span.clcity").text();
var clprov = $('.ui-accordion-header-active').find("span.clprov").text();
//if there is no claddress don't bother - (for accordion activate on close)
if (claddress == '') {
//nothing there so do nothing
return;
}
//if we do have something check the pcom db for a match
$.ajax({
url: "commenter.php",
datatype: "json",
data: {
clAddress: claddress,
clCity: clcity,
clProv: clprov
},
success: function(data) {
//we have a match now show it
//THIS IS WHERE I NEED TO ADDRESS THE pcom DIV IN THE ACCORDION
}
});
}
});
Редактировать: так устроен аккордеон (показана только часть успеха ajax)
success: function(data) {
if(data == 'null') {
buildaccordion("<h3>No Results Found</h3><div>No Data to Show.</div>");
return;
}
var hbuild='';
var tmp = $.parseJSON(data);
//run a loop to build the HTML for each record
$.each(tmp, function(i) {
//Header
hbuild += '<h3 class="sTitle">' + tmp[i].Name + ' - <span class="claddress">' + tmp[i].Address + '</span>, <span class="clcity">'
+ tmp[i].City + '</span>, <span class="clprov">' + tmp[i].Prov + '</span> - ' + tmp[i].CallInTime + '</h3>';
//Inner
hbuild += "<div>";
hbuild += '<ul class="menu">';
hbuild += '<li><a href="newcall.php?CustID=' + tmp[i].CustID + '">New Call</a></li>';
hbuild += '<li><a href="editcall.php?CustID=' + tmp[i].CustID + '">Edit Call</a></li>';
hbuild += '<li><a href="viewcall.php?CustID=' + tmp[i].CustID + '">Details</a></li>';
hbuild += '</ul>';
hbuild += '<div class="spcom">Persistent Comment Here</div>';
hbuild += '<div class="acname">Name: ' + tmp[i].Name + ' - <span class="ClientCust">Customer Num:' + tmp[i].ClientCustNum + '</span></div>';
hbuild += '<div class="acphone">Phone: ' + tmp[i].Phone + ' Ext#:' + tmp[i].PExt + '</div>';
hbuild += '<div class="acaddress">Address: ' + tmp[i].Address + ', ' + tmp[i].City + ', ' + tmp[i].Prov + ', ' + tmp[i].PCode + '</div>';
hbuild += '<div class="accontact">Contact: ' + tmp[i].Contact + '</div>';
hbuild += '<span class="acbilledto">Billed To: ' + tmp[i].BilledTo + '</span><br>';
hbuild += '<div class="acponum">PO Num: ' + tmp[i].PONum + '</div>';
hbuild += '<div class="acourpo">OurPO: ' + tmp[i].OurPO + '</div>';
hbuild += '<div class="acgivento">Service Provider: ' + tmp[i].GivenTo + '</div>';
hbuild += '<div class="acourwo">Accurate WO: ' + tmp[i].OurWO + '</div>';
hbuild += '<div class="acourinv">Accurate Invoice: ' + tmp[i].OurInv + '</div>';
hbuild += '<div class="acinvamt">Invoice Total: $' + tmp[i].InvAmt + '</div>';
hbuild += '<div class="accomments">Call Comments: ' + tmp[i].Comments + '</div>';
hbuild += "</div>";
});
//send it off to the build
buildaccordion(hbuild);
}
Теперь я мог бы добавить идентификатор, содержащий уникальный идентификатор в pcom div во время его создания (например, идентификатор клиента), но при этом этот результат также приведет к идентификатору в заголовке h3, таким образом, он получит идентификатор в h3, а затем ссылаться на div. Но я хотел бы сделать это, не скрывая тонны данных в тегах аккордеона. Я должен был сделать это на другой странице, и это становится довольно запутанным и беспорядочным.
Спасибо за любую помощь, Norst
Предполагая стандартную структуру HTML следующим образом:
<h3><span>Section 1</span></h3>
<div>
<p>
Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
</p>
</div>
Предполагая, что вы нацеливаете элементы H3 индивидуально, вы должны использовать:
$(this).next('div');
Если вам нужно получить этот div из диапазона с классом, который вы соответствовали, это будет:
$(this).parent('h3').next('div');