5

I'm currently trying to use AJAX (with jQuery) in my Drupal 8 module in order to reload a page when the user types something in a textfield. I managed to get a full HTML page back but I would like the AJAX function to only get the content of the page (without the whole layout).

How can I achieve that? What shall I change in my controller function in order to render a different view when the request uses AJAX?

I have searched on Google and on the Drupal 8 documentation but I have not found any answer to my question.

Thanks in advance for your help!

Dominique
  • 85
  • 3
  • 6
  • Are you using the [Drupal Ajax API](https://api.drupal.org/api/drupal/core!core.api.php/group/ajax/8.2.x)? Is this within a form you have output from a custom module? [Google has a massive amount of results](https://www.google.com.au/?gws_rd=ssl#q=drupal+8+ajax) – 2pha Jan 08 '17 at 14:05
  • Post your code that generates the textfield/form. – 2pha Jan 08 '17 at 14:42
  • My form is within a twig template and not generated using the Form API. Moreover, I would also like to add a navigation feature to my module allowing the user to go to the previous/next page without having to load the whole page. – Dominique Jan 08 '17 at 18:35
  • you have just put a textfield into a template? Is it a custom module? Next and Previous page of what? What are you displaying? Why not use views? – 2pha Jan 08 '17 at 18:38
  • Yes, I put a textfield into a template. It's a custom module providing a shared calendar. So I want the user to be able to go to the previous/next month or week. I'm new to Drupal so I don't know Views, would it help me in my current situation? – Dominique Jan 08 '17 at 18:46
  • [HERE](https://www.drupal.org/project/calendar) is a module that might do everything you want though I'm not sure how far along the D8 version is. It has links to tutorials for D7 that should still be relevant for D8. If that does not work and you stick with your custom module, You should use the [form api](https://www.drupal.org/docs/8/api/form-api/introduction-to-form-api) and [ajax api](https://api.drupal.org/api/drupal/core!core.api.php/group/ajax/8.2.x) to create your textfield – 2pha Jan 09 '17 at 03:07
  • Take a look to this question: http://drupal.stackexchange.com/q/231188/28275 and I think that you should post your questions in drupal.stackexchange.com – Adrian Cid Almaguer Mar 14 '17 at 16:07

2 Answers2

5

You can return the data in AJAX callback function as below.

$build[] = array(
    '#type' => 'markup',
    '#markup' => '<p>Demo text content</p>',
);
return new Response(render($build));

Make sure to include the Response class

use \Symfony\Component\HttpFoundation\Response;
Jose D
  • 489
  • 3
  • 5
-2

You can make some view that returned by some ajaxAction request that you will append or will redefine on your page this way:

$.ajax({
  type:  'GET',
  url:   'ajaxContent.php?action=get&pageId=777',
  cache: false
}).done(function( receivedHtml ) {
  $("#targetBlock").html(receivedHtml);
});

It's example of using jQuery ajax on ajaxContent controller with parameters through url.

Daniel
  • 611
  • 5
  • 20
  • 1
    Your answer is just generic jquery ajax, not the proper way to do it in Drupal. – 2pha Jan 08 '17 at 14:07
  • It was unclear what is your problem about. Have you tried this one: http://drupal.stackexchange.com/questions/144947/how-do-i-access-a-field-value-for-an-entity-e-g-node-object There is a lot of link showing how to get node content istant of rendered page. – Daniel Jan 08 '17 at 14:16
  • My issue isn't related to jQuery but to Drupal 8. I would like to find a way, when I call a controller function, to **only** return the main content of the page (i.e. the content of my templates) and not the static part of the website (the menus, header, sidebar, …). – Dominique Jan 08 '17 at 18:41