In another question's discussion, I became aware of intercepting clicks and updating area without refreshing the whole page. Problem is, the following code seems correct to me and I dont receive any errors but data taken from another page is not displayed at all.
Please advise.
main page
$('ul.thumbs li.pagination a').live('click', function() {
var pageNumber = parseInt($(this).text().replace(/[^0-9]/g, ''));
$(function ViewImages() {
$.ajax({
type: "GET",
url: "/FLPM/cp/images.cs.asp?Process=ViewImages&PAGEID=" + pageNumber,
success: function(data) {
$("#ViewImages").html(data);
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
$("#ViewImages").html('.');
}
});
});
return false;
});
<div id="ViewImages">
</div>
page where data lays
<ul class="thumbs">
<li>
<a href="#" class="thumb"><img src="/FLPM/media/news/images/5P2B4K5M_sm.jpg" alt="Forest Flowers" class="floatLeft" /></a>
<br />
<a href="?Process=DeleteImage&IMAGEID=21" class="thumb"><span class="floatLeft">DELETE</span></a>
</li>
<li>
<a href="#" class="thumb"><img src="/FLPM/media/news/images/6Z3L5U6W_sm.jpg" alt="Forest" class="floatLeft" /></a>
<br />
<a href="?Process=DeleteImage&IMAGEID=20" class="thumb"><span class="floatLeft">DELETE</span></a>
</li>
<li>
<a href="#" class="thumb"><img src="/FLPM/media/news/images/8O5A7J8M_sm.jpg" alt="Dock" class="floatLeft" /></a>
<br />
<a href="?Process=DeleteImage&IMAGEID=19" class="thumb"><span class="floatLeft">DELETE</span></a>
</li>
<li>
<a href="#" class="thumb"><img src="/FLPM/media/news/images/9Q6B3Q4S_sm.jpg" alt="Desert Landscape" class="floatLeft" /></a>
<br />
<a href="?Process=DeleteImage&IMAGEID=18" class="thumb"><span class="floatLeft">DELETE</span></a>
</li>
<li>
<a href="#" class="thumb"><img src="/FLPM/media/news/images/5B2N4W5Z_sm.jpg" alt="Creek" class="floatLeft" /></a>
<br />
<a href="?Process=DeleteImage&IMAGEID=17" class="thumb"><span class="floatLeft">DELETE</span></a>
</li>
<li class="pagination">1. </li>
<li class="pagination"><a href="2">2.</a> </li>
</ul>
