如何通过AJAX调用HTML - Elgg？

Question

I'm trying to call a view in Elgg via AJAX, but nothing works after >>HERE<<

$('.glyphicon-zoom-in').click(function(event) {

    $( '.full-image-view' ).css( "color", "red" ).append('<div>Hope this works</div>');

    // >>HERE<<

    var Ajax = require('elgg/Ajax');
    var ajax = new Ajax();

    ajax.view('albums/inline_full_image_view', {
        data: {
                guid: 123 // querystring
            },
        }).done(function (output, statusText, jqXHR) {
            if (jqXHR.AjaxData.status == -1) {
                return;
            }
            $('.full-image-view').append(output);
        });
    });

Output : Hope this works

What could I be getting wrong?

Thank you all in advance.

UPDATE

inline_full_image_view.php

<?php

    echo 'Hello World';

Answer 1

Elgg uses requirejs. Try this:

requirejs(["elgg/Ajax"], function(Ajax) {
    var ajax = new Ajax();
    //rest of your code!!
});

Otherwise, using native JS.

var xhr = new XMLHttpRequest();
xhr.open('GET', encodeURI('albums/inline_full_image_view'));
xhr.onload = function() {
    if (xhr.status === 200) {
        alert('User\'s name is ' + xhr.responseText);
    }
    else {
        alert('Request failed.  Returned status of ' + xhr.status);
    }
};
xhr.send();