Ajax requests

Hi folks,

I’ve been woking as you might know on a project management module and now it’s near finished I want to implement ajax for page requests, drag&drop and other things. I’ve red the PHP Programming part 3 page but I cant seem to figure it out!

Does someone has a working example so I can study it?

Would be helpful!

Thanks,

Rogier

I forgot to notify that I use jQuery for my website. Hope someone has a quick working example

The easiest method is to create a snippet to process the request, place it into a empty page and have the ajax point to that page.

Quote from: wshawn at Jul 11, 2010, 09:51 PM

The easiest method is to create a snippet to process the request, place it into a empty page and have the ajax point to that page.

Thanks for your reply, I hoped someone would have a actually working example because I’m not that good with ajax.

Besides that, I’ve came across the following tutorial: http://tutorialzine.com/2009/09/simple-ajax-website-jquery/ is this a good way to use ajax with MODx? Or would it be smarter to use the build in connectors which I don’t yet quite understand.

Help would be highly appreciated.

Rogier

I got the method tutorial working but I don’t know thats the right way to do so. Is it possible to load the content of a page (sql or .htaccess) in another page by connectors and processors?

Think I’m freaking out because I cant seem to understand how it works

You *can* use external connectors (as explained in the Custom Manager Pages docs), although one problem with that method is that you need to implement your own security/permission checking.

A "better" (well, I don’t know if it’s better, but it sure is easier!) way to do this is by using a resource just for AJAX requests for your component. To do this:

1. Create a new Content Type (System | Content Types).
Name: JSON
MIME Type : application/javascript
File Extension: .js
Binary: Leave as default (No)

2. Create a new Resource and assign the new JSON Content Type. You can leave the template as empty.

3. Place your (AJAX) snippet call as the content. You could either use a separate AJAX-only snippet (as opposed to a regular snippet), or use a snippet parameter like &ajax=`1`, to let your snippet know whether to output a parsed chunk/content, or a JSON object.

4. Your non-AJAX snippet should output the actual JS code. With jQuery, something like this is enough to perform a basic AJAX request:


Your AJAX snippet should "echo" the content of the request to the browser, and your JS should be responsible for taking the request data and displaying it.

Hopefully this helps!

Quote from: Ricjustsaid at Jul 12, 2010, 04:40 PM

You *can* use external connectors (as explained in the Custom Manager Pages docs), although one problem with that method is that you need to implement your own security/permission checking.

A "better" (well, I don’t know if it’s better, but it sure is easier!) way to do this is by using a resource just for AJAX requests for your component. To do this:

1. Create a new Content Type (System | Content Types).
Name: JSON
MIME Type : application/javascript
File Extension: .js
Binary: Leave as default (No)

2. Create a new Resource and assign the new JSON Content Type. You can leave the template as empty.

3. Place your (AJAX) snippet call as the content. You could either use a separate AJAX-only snippet (as opposed to a regular snippet), or use a snippet parameter like &ajax=`1`, to let your snippet know whether to output a parsed chunk/content, or a JSON object.

4. Your non-AJAX snippet should output the actual JS code. With jQuery, something like this is enough to perform a basic AJAX request:

$.ajax( {
    url : "index.php?id=MY_AJAX_PAGE_ID",
    data : {
        param1 : "some-value",
        param2 : "another-value"
    },
    success : function( data, status, xhr ) {
        // do something with data
    },
    dataType : "json"
} );

Your AJAX snippet should "echo" the content of the request to the browser, and your JS should be responsible for taking the request data and displaying it.

Hopefully this helps!

Ahhh thank you so much, I’ll look in to that today! Will keep you updated on my progress

Rogier

I made some progress! Sadly it doesn’t change the fact that I’m far from finished.

I’ve looked at your code and tried it, but couldn’t get I working. I’ve combined it with the tutorial from tutorialzine and now I can make a request with jquery.

Here is my setup:

- Normal installation from modx
- external php file
- external js file

But how can I access the power of modx with my php file? I guess I have to include some files before I can use modx->get...? Or is it smarter to make a file in the manager and copy the content of my php and js file in there?

Bottomline: When clicked on a link I would like to get the contents a resource (2 for example) in my ajax returned call.

I feel such a beginner (I am, but still).

I like what I have so far, even as it is amazingly simple!

Hope someone knows what to do next!

Quote from: Rogier at Jul 13, 2010, 10:50 AM

But how can I access the power of modx with my php file? I guess I have to include some files before I can use modx->get...? Or is it smarter to make a file in the manager and copy the content of my php and js file in there?

Did you read about "lightweight" scenario here:
http://wiki.modxcms.com/index.php/Use_AJAX_with_modxAPI#Differences_and_conclusions

Quote from: Eol at Jul 13, 2010, 12:42 PM

Quote from: Rogier at Jul 13, 2010, 10:50 AM

But how can I access the power of modx with my php file? I guess I have to include some files before I can use modx->get...? Or is it smarter to make a file in the manager and copy the content of my php and js file in there?

Did you read about "lightweight" scenario here:
http://wiki.modxcms.com/index.php/Use_AJAX_with_modxAPI#Differences_and_conclusions

I noticed this is for Evolution? Can I use this in Revolution?