In cakephp when we submit a form from the ctp file. It goes to the controller and carry the action to which the form is submitted.

This requires the reloading of the complete page.

We can submit the form without reloading the whole page and just reloading the form through the AJAX.

What we need to do is we have to give a on submit function on that form and the we call the ajax which ultimately call the controller and does the work.

Suppose we made this form in the ctp
 

<section class="inner-page-content">
    <h2 class="page-title">                    
        <hr />
        <!-- <strong>Contact Us</strong> -->
        <?php echo $this->Html->tag('strong', __('Contact Us')); ?>

    </h2><!-- =Page Title End//= -->
    <?php echo $this->Flash->render(); ?>
    <!-- =Contact Us Form= -->
    <div class="contact-us-form">
        <?php echo $this->Form->create('User', array('url' => array('controller' => 'pages', 'action' => 'contact'), 'class' => 'form-container', 'id' => 'contact_form')); ?>

        <?php echo $this->Form->input('email', array('div' => array('class' => 'form-row'), 'label' => array('class' => 'control-label'), 'type' => 'text', 'class' => 'form-input')); ?>

        <div class="form-row">
            <label for="subject" class="control-label"><?php echo __("Subject:"); ?></label>
            <?php echo $this->Form->input('subject', array('type' => 'text', 'class' => 'form-input', 'label' => false, 'div' => false)); ?>
        </div>


        <div class="form-row">
            <label for="message" class="control-label" style="vertical-align: top;"><?php echo __("Message:"); ?></label>
            <?php echo $this->Form->input('message', array('type' => 'text', 'class' => 'form-input', 'type' => 'textarea', 'id' => 'message_contact', 'rows' => false, 'cols' => false, 'label' => false, 'div' => false)); ?>
        </div>


        <br />

        <div class="form-row btn-row text-right">
            <?php echo $this->Form->submit(__('Send'), array('class' => 'btn btn-green', 'id' => 'button_contact')); ?>
            <!-- <button class="btn btn-green" style="margin-right: 20px; width: 120px;">Send</button> -->
        </div>
        <?php echo $this->Form->end(); ?>
    </div><!-- =Contact Us Form End//= -->

</section><!-- =Content Frame End//= -->

We also need a controller function.

In pages controller you can define the function.
 

public function contact()
    {
        if ($this->request->is('post'))
        {
            if ($this->request->data) {

                // echo '<pre>';
                // print_r($this->request->data);
                // echo '</pre>'; die;

                $email =  $this->request->data['User']["email"];
                $subject =  $this->request->data['User']["subject"];
                $message =  $this->request->data['User']["message"];

               
                if($this->Page->save()){
                return 1;
                die;
                
            }
            else{
                return 0;
                die;
                    }
        }
    }

Now if you do only this it will reload the page.

But you can add the ajax in the same ctp or in the js to only reload the section.
 

$("#contact_form").submit(function () {
        
        $.ajax({
            type: 'post',
            url: "/pages/contact",
            data: {tpye: type},
            success: (function (data) {
                if (data = 1) {
                    alert("Success");
                    $(window).redirect();

                }
else 
{
                    alert("Not saved");
                    $(window).redirect();

                }

            })
        });


    });

Now when you hit the submit button it first goes to this function and then  it calls the contact function of pages controller.

if it returns 1 then the form is submitted else the form is not submitted.

This is all you need to do and your work is done.