Question

I want to do something like this.

If I click on some DIV (id='#some-link'), it should show me the another DIV (id='#busy-indicator').

I have written following, but it’s not working.

$this->Js->get('#some-link')->event('click', $this->Js->get('#busy-indicator')->effect('fadeIn'));

What should be the correction to get it working?

It generates following output.

$(document).ready(function () {
   $("#busy-indicator").bind("click", function (event) {
      $("#busy-indicator").fadeIn();
      return false;
   });
});

Answer 1

You can use a “two-step” solution like this:

$event = $this->Js->get('#busy-indicator')->effect('fadeIn');

$this->Js->get('#some-link')->event('click', $event);

This is the HTML output:

$(document).ready( function(){
  $("#some-link").bind("click", function(event) {
    $("#busy-indicator").fadeIn();
    return false;
  });
});