More problems:
1.
$("accordion").accordion({
Must be a typo when
you posted to the forum, I'd guess, because this makes
an accordion out of elements like
<accordian>.
Did you mean to place
a
#
at the front?
2.
The binding in your script
cannot work, because it comes before the elements it
references. It needs to go after, or else use a delegation.
Again, assuming you transposed the order when you posted to
the forum. One of the reasons it's always better to
provide a link to your site or use a demo site like jsFiddle
instead of posting code snippets to the forum.
3.
var contentDiv = (this).next("div");
Did you mean to write
$(this)
?
----
I'd also advise not conflating database keys with HTML IDs. They
have completely different purposes. Just because it is called
"id" doesn't mean it's the best place to hang your
database key in the HTML.
I always use
data- attributes for
this, and put them on the outer-most container that "goes
with" the database row. If you also place some CSS class on that
container that indicates that it represents some sort of database
table item, then you can easily dig it out using
.closest() and
.data() should you need
it in some code.
Here there is really no need, though, since you have an href to
hang it on, and I don't see anything about the code you've
shown us that needs to use the key value in your Javascript.
Simplify.
<div class='lnkpid-accordion'>
<h2>
<a href="load.asp?pid=lnkPid"><%=strPerson%></a>
</h2>
</div>
<div></div>
<script>
$(".lnkpid-accordion").accordion({
autoHeight:false,
heightStyle: "content",cache:false
});
$(".lnkpid-accordion
a").click(function(e) {
var $a = $(this);
var $contentDiv = $a.closest(".lnkpid-accordion").next("div");
$contentDiv.load($a.attr("href");
e.preventDefault();
});
</script>
(But did you meant
to place your content INSIDE the
accordion, instead of after it?)
