2

Probably a dumb question, but since i wasn't sure while reading on github, i'll ask here.

I am wondering if I can reach the JSON I created with an URL or is it only for use in PHP?

I would like to load entries from craft from a json with ajax when i click on a button and i wasn't sure if it was possible with this plugin since there is no exemple.

Anybody can help me?

Thanks!

Improve this question

2 Answers 2

Reset to default
3

You better use GET rather than POST :

$(function () {
    var data = {
        'CSRF': $('input[name="CRAFT_CSRF_TOKEN"]').val(),
    };

    $.ajax({
        'type': 'get',
        'contentType': 'application/x-www-form-urlencoded; charset=UTF-8',
        'cache': false,
        'data': data,
        'url': 'news.json',
        'dataType': 'json',
        'timeout': 50000
    }).done(function (response) {
       console.log(response);
    }).fail(function (error) {
       console.log('totalfail')
    });
});
Improve this answer
3

Totally do-able.

Once you have the ElementAPI plugin downloaded and installed, you'll want to make sure you have created a file called elementapi.php and it is in your /craft/config/ directory.

For simplicity's sake, I've used a stripped down version of the example on the github page.

elementapi.php

<?php
namespace Craft;

return [
    'endpoints' => [
        'news.json' => [
            'elementType' => 'Entry',
            'criteria' => ['section' => 'news'],
            'transformer' => function (EntryModel $entry) {
                return [
                    'title' => $entry->title,
                    'url' => $entry->url,
                    'jsonUrl' => UrlHelper::getUrl("news/{$entry->id}.json")
                ];
            },
        ]
    ]
];

Going back to your /craft/config/ directory, you will want to enable CSRF protection..

Finally, (again for simplicity) here is an example of getting my news entries via ajax on docReay

_layout.html

<head>
...
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js">  </script>
<script>
    $(function () {
        var data = {
            'CSRF': $('input[name="CSRF"]').val(),
        };

        $.ajax({
            'type': 'get',
            'contentType': 'application/x-www-form-urlencoded; charset=UTF-8',
            'cache': false,
            'data': data,
            'url': 'news.json',
            'dataType': 'json',
            'timeout': 50000
        }).done(function (response) {
            console.log(response);
        }).fail(function (error) {
                // Total fail.
            });
        });
    </script>
</head>

<body>
<div id="container">
    {{ getCsrfInput() }}
...

Then if you look at your console, you should see something like this:

{"data":[{"title":"We just installed Craft!","url":"http:\/\/craftsandbox.dev\/news\/2016\/we-just-installed-craft","jsonUrl":"http:\/\/craftsandbox.dev\/news\/3.json"}],"meta":{"pagination":{"total":1,"count":1,"per_page":100,"current_page":1,"total_pages":1,"links":[]}}}

Hope this helps!

Improve this answer
0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.