Hi all,
I have a problem regarding accessing an element id from a jQuery click event when the actual element is part of template rendered with the method renderWith(). I cannot figure out whats wrong and could surely need some wise input.
Here is my code (of interest):
ProductListPage.php
-----------------------
class ProductListPage extends Page {
..
..
}
class ProductListPage_Controller extends Page_Controller {
function init() {
parent::init();
Requirements::javascript("themes/mytheme/javascript/jquery.js");
Requirements::javascript("themes/mytheme/javascript/script.js");
if(Director::is_ajax() || $_GET["ajaxDebug"]) {
$this->isAjax = true;
} else {
$this->isAjax = false;
}
}
public function filter() {
..
..
$myDataObjectSet = singleton('Product')->buildDataObjectSet($result);
return $this->customise(array('Products' => $myDataObjectSet))->renderWith(array('GridView'));
}
}
ProductListPage.ss
-----------------------
...
<div id="AjaxContainer">Ajax container</div>
..
<div><a href="#" id="displayed-ok-in-alert" rel="ajax">Working fine</a></div>
..
<div><a href="#" id="not-important" onclick="jQuery('#AjaxContainer').load('$URLSegment/filter/A/B/'); return false;">Populate Ajax container</a></div>
..
GridView.ss
-----------------------
..
<div><a href="#" id="not-displayed-in-alert" rel="ajax">Not working</a>
..
script.js
-----------------------
$('a[rel=ajax]').click(function (event) {
alert(event.target.id);
});
Everything works fine and clicking the link 'Working fine' fires off the click event and an alert according to 'displayed-ok-in-alert' is displayed. When clicking the link 'Not working' however, the alert is not fired of at all. How come?
I have noticed that the actual markup for the HTML rendered with renderWith() i.e. the markup in GridView.ss isnt visible when viewing the page source in Firefox. Why is that? And, is that the origin of this problem?
I am running Silverstripe 2.4.7 localy on a WAMP installation.
Thankful for any help or pointers on this topic.
Ciao!