CakePHP w/ jQuery (Javascript/Ajax) simple link and update - what am I doing wrong?
I am simply trying to use jQuery to print out the contents of an action. But I cannot get my div to update with the echoed content. What am I doing wrong?
b开发者_开发问答irds_controller.php
...
var $helpers = array('Js', 'Html', 'Ajax');
var $components = array('RequestHandler');
function birds_ajax_1() {
function birds_ajax_1_func_1() {
$this->autoRender = false;
echo "Text from Ajax clickaroo.";
}
}
...
birds_ajax_1.ctp
<?php
echo $ajax->link('Ajax Link', array('controller' => 'birds',
'action' => 'birds_ajax_1_func_1'),
array('update' => 'ajax_div', 'complete' => 'alert("Ok.")'));
?>
<div id="ajax_div"></div> <!-- echoed text is not showing here? -->
default.ctp
...
echo $this->Html->script('jquery'); // Yes. My jQuery is being pulled in OK.
...
...
echo $this->Js->writeBuffer();
...
This is what is being dumped to my source:
...
<a href="/php/cake_app_birds_v1.3/birds/birds_ajax_1_func_1" id="link2019467549" onclick=" event.returnValue = false; return false;">link1</a><script type="text/javascript">
//<![CDATA[
Event.observe('link2019467549', 'click', function(event) { new Ajax.Updater('ajax_div','/php/cake_app_birds_v1.3/birds/birds_ajax_1_func_1', {asynchronous:true, evalScripts:true, onComplete:function(request, json) {alert("Ok.")}, requestHeaders:['X-Update', 'ajax_div']}) }, false);
//]]>
birds_controller.php
var $helpers = array('Js' => array('Jquery'), 'Html', 'Ajax');
var $components = array('RequestHandler');
function birds_ajax_1() {
if ($this->RequestHandler->isAjax()) {
$this->render('/elements/birds_ajax_1'); // this birds_ajax_1.ctp contains the output into the #ajax_div.
}
}
birds_ajax_1.ctp
<?php
// Note I am not using the $ajax->link(...
echo $this->Js->link('Ajax Link', array('controller' => 'birds',
'action' => 'birds_ajax_1'), array('update' => '#ajax_div'));
?>
<div id="ajax_div"></div>
Nothing changed in default.ctp.
Hope this is helpful to someone else who might be going through the confusion I just went through! Glad I found the light! Now onto some jQuery sorting ? Oh boy.
精彩评论