I am trying to convert a website currently implemented in PHP with
server-side includes, to not use only Javascript (and jQuery & AJAX).
The main navigation page has a list of links. Clicking on a link
pulls in dynamic content and populates a div on the page. I am
using .live() and .load() to implement:
<script type="text/javascript">
$(function() {
$("li.link").live("click", function(){
// grab the id from the LI element
var linkid = $(this).attr('id');
// the html page to pull in
var linkpg = 'content_'+linkid+'.htm';
// populate the div
$("#dynamic_content").load(linkpg);
});
</script>
...
<ul id="dynamic">
<li class="link" id="L1">Sample 1</li>
<li class="link" id="L2">Sample 2</li>
<li class="link" id="L3">Sample 3</li>
</ul>
<div id="dynamic_content"></div>
The content is getting pulled in and displays, but if the content
contains elements that trigger jQuery functionality (e.g. other click
events, or text formatting based on other parameters), it doesn't
work. I know this is a binding issue, and if it were just one or two
events, I'd use trigger() after the load(). But to complicate
matters, the dynamic content covers a wide variety of events as well
as manipulations.
I've placed all my jQuery code into a single file, and tried pulling
in that file via AJAX after the load():
$.ajax({type:"GET", url:"./inc_jquery.js", dataType:"script"});
This works with limited success, but not all events are firing, and
most specifically the non-event stuff.
Is there some way to cover all the variations? Without resorting to
using a frameset?!?
Thanks,
Mitch
