user1469742
user1469742

Reputation:

CakePHP 2.1 - Callback functions for JsHelper / AJAX

Using the JsHelper for CakePHP 2.x, for each callback function, is it possible to have more than one selector being subject to various effects. For example, I am using:

echo $this->Js->submit('thumbs-up-green.jpg', array(
  'id' => 'thumbs-up-green',
  'before' => $this->Js->get('#thumbs-down-red')->effect('fadeOut'),
  'success' => $this->Js->get('#thumbs-down-gray')->effect('fadeIn')
));

Let's say I want to apply an effect on #thumbs-down-gray in the before callback function as well (in addition to the effect on #thumbs-down-red which I currently have), what is the syntax for that? I have been searching around but documentation is limited for the JsHelper.

Additionally a simpler question, the JsHelper submit button / form seems to perform a line-break even if CSS display:none; is active. How do I get rid of that line-break?

Upvotes: 0

Views: 2024

Answers (2)

V.Wadelius
V.Wadelius

Reputation: 11

You have to set the "before"-action in a variable before the actual submit-call. Like this:

$before = $this->Js->get('#skadetyp_form')->effect('fadeOut', array('buffer' => false));
$before .= '$(\'#notice\').append(\'<div class="notice">Sending..<br/>' . $this->Html->image('load_bar.gif', array('alt' => 'Loading..')) . '</div>\')';
$complete = $this->Js->get('#notice div')->effect('fadeOut', array('buffer' => false));
$complete .= '$(\'#notice\').append(\'<div class="success">Succssfully seny!</div>\')';

echo $this->Js->submit('Send!',
        array(
            'update'=>'#skadetyp_form',
            'complete' => $complete,
            'before' => $before,
            'error' => $error,
            'async' => true,
            'method' => 'post',
            'dataExpression'=>true,
            'data'=> $this->Js->serializeForm(
                array(
                    'isForm' => true,
                    'inline' => true
                )
            )
        )
);

Upvotes: 1

user1469742
user1469742

Reputation:

I haven't found a very neat JsHelper solution, I don't think I can chain on additional elements and actions.

So I think for more complex callback functions the solution is to execute a pre-loaded function like:

'before' => 'someFunction();',

But if you just want to for example fadeOut multiple elements in one go then you could write it like:

'before' => $this->Js->get('#thumbs-down-red, #other-element')->effect('fadeOut'),

Upvotes: 1

Related Questions