CODEWITHSUNDEEP
ajaxcakephp
aradhya
aradhya

Reputation: 355

JsHelper and Ajax not working in Cakephp

I seriously can' understand what is going on here !The Jquery is not working at all ! The script is getting generated and everything. but when I click on the submit button it follows the same process as without jquery and ajax. Please help ! thanks. Here is my, Controller: 

class MessagesController extends AppController{

    public  $helpers=array('Js'=>array('Jquery'));
    public $components = array('RequestHandler');

    public function index(){
        if(!empty($this->data)){
            if($this->Message->save($this->data)){
                if($this->RequestHandler->isAjax()){
                    $this->render('success','ajax');
                    $this->Session->setFlash('Ajax');   
                }
            }
        }
    }

}

?> and here is my View:

<?php echo  $this->Html->script('jquery',FALSE); ?>
<?php
echo $this->Form->create();
echo $this->Form->input('name',array('id'=>'id'));
echo $this->Form->input('email',array('id'=>'email'));
echo $this->Form->input('message',array('id'=>'message'));
echo $this->Js->submit('Submit',array(
'before'=>$this->Js->get('#sending')->effect('fadeIn') ,
'success'=>$this->Js->get('#sending')->effect('fadeOut'),
'update'=>'#success'
 ));
echo $this->Form->end();
?>
<div id="sending" style="display:none;background-color:green" >Sending...</div>
<div id="success"></div>

This is the javascript file being generate,

$("#submit-84782947").bind("click", function (event) {$.ajax({beforeSend:function                   (XMLHttpRequest) {$("#sending").fadeIn();}, complete:function (XMLHttpRequest, textStatus) {$("#sending").fadeOut();}, data:$("#submit-84782947").closest("form").serialize(),   dataType:"html", success:function (data, textStatus) {$("#success").html(data);},       type:"post", url:"\/Cake\/messages"});

return false;});

As I noticed there is no $(document).ready stuff in the generate file, could that be the problem ?

Upvotes: 2

Views: 4360

Answers (3)

imo inyang
imo inyang

Reputation: 51

in cakephp 2.3 $this->RequestHandler->isAjax() is deprecated and is now $this->Request->isAjax() am trying to do the same thing using this view file:

<?php echo $this->Form->create(); echo $this->Form->input('name');echo $this->Form->input('email'); echo $this->Form->input('phone'); echo $this->Form->input('message');   echo $this->Js->submit('Send Enquiry', array(
    'before' => $this->Js->get('#sending')->effect('fadeIn'),
    'success' => $this->Js->get('#sending')->effect('fadeOut'),
             'update' => '#success',
              'async' => true
               ));echo $this->Form->end(); ?>

and this controller function:

public function add() {
    if ($this->request->is('post')) {
        $this->Contact->create();
        if ($this->Contact->save($this->request->data)) {

            if($this->request->isAjax()){
                $this->autoRender = false;  
                echo 'successful';
                }else{
            $this->Session->setFlash(__('The contact has been saved'));
            $this->redirect(array('action' => 'index'));
                }
        } else {
            $this->Session->setFlash(__('The contact could not be saved. Please, try again.'));
        }
    }
}

at the end, the data is saved to database but i can't get response to the client side so i help too on this

Upvotes: 0

Andrew Kulakov
Andrew Kulakov

Reputation: 2092

Since the JsHelper automatically buffers all generated script content to reduce the number of tags in your source code you must call write the buffer out. At the bottom of your view file. Be sure to include:

<?php
echo $this->Js->writeBuffer();

If you omit this you will not be able to chain ajax pagination links. When you write the buffer, it is also cleared, so you don’t have worry about the same Javascript being output twice.

CakePHP 2.0 cookbook

Upvotes: 0

Sudhir Bastakoti
Sudhir Bastakoti

Reputation: 100175

Try:

echo $this->Js->submit('Submit',array(
  'before' => $this->Js->get('#sending')->effect('fadeIn', array('buffer' => false)),
  'complete' => $this->Js->get('#sending')->effect('fadeOut', array('buffer' => false)),
   'update' => '#success'

));
//if that doesnot work then checkout:

CakePHP Ajax Helper

Hope it helps

Upvotes: 1

Related Questions