Return only body with CakePHP Ajax request

Question

I've got a modal dialog that pops up and requests users to change their passwords after a certain condition has been met.

This works perfectly, however, when the request is completed, it returns the whole page including the template.

I run the script in my default layout (APP/View/Layout/default.ctp) because it needs to be on every page, since a user is logged in and then redirected to the requested page.

I want to know, how do I show only the content of the requested page, and not the template?

Here is my jquery script:

//In the default layout
$(document).ready(function(e) {
var $dialog = $("#view_dialog").dialog(
{
    autoOpen: false,
    closeOnEscape: false,
    closeText: 'hide',
    draggable: false,
    modal: true,
    resizable: false,
    hide:"fade",
    title: 'Password Change Required',
    open: function(event, ui) { $(".ui-dialog-titlebar-close").hide(); },
    buttons: {
        "Change Now": function() {
            if($('#password').val() != "" && $('#confirm').val() != "") {
                if($('#password').val() == $('#confirm').val()) {
                    $.ajax({
                        type: 'GET',
                        url: 'pages/password_change',
                        data: { password:$('#password').val(), usern : $('#usern').val() },
                        success: function(data) {
                        if(data.indexOf("SUCCESS") != -1) {
                            data = data.replace("SUCCESS", "");
                            $('#passAlert').removeClass('ui-state-error').addClass('ui-state-highlight').html(data).show('fast');
                            setTimeout(function() { $(this).dialog('close'); },1000);
                        } else {
                            data = data.replace("FAIL", "");
                            $('#passAlert').html(data).show('fast');
                        }
                    },
                    error: function(xhr,ajaxOptions,thrownError) {
                        data = data.replace("FAIL", xhr.status + ' - ' + thrownError);
                        $('#passAlert').html(data).show('fast');
                    }
                });
            } else {
                $('#passAlert').html("Password doesn't match.").show('fast');
            }
        } else
            $('#passAlert').html("Please complete all boxes.").show('fast');
        }
    }
});
if(<?php echo $showPopup ?>) {
    $dialog.dialog("open");
}

At the moment I'm just echoing a single sentence to check the response.

Answer 1

Cakephp allow us to overwrite template on every controller action.

inside controller action write below line.

$this->layout = "ajax";

OR

You can disable layout like this

$this->layout = null ;

Now your action will become

public function listnames()
{
    $this->layout = null ;
    // $this->layout = "ajax";
    //other code.
}