8 – Display the rendered node in jQuery Modal via JSON

I want to be able to have a link, and if there is a specefic class, I want to display it as a jQuery modal. I added the required data associated with the link to be able to use it as a modal.

I also created a route for nodes that has a custom controller that runs when a node is displayed ?_format=json, The controller returns the rendered node as JSON, which seems to work well.

Here is my controller:

public function json(EntityInterface $node, $view_mode = 'full', $langcode = NULL) {
  $build = $this->entityTypeManager->getViewBuilder('node')->view($node, $view_mode);
  $output = $this->renderer->renderRoot($build);

  return new JsonResponse($output);
}

And here's the JS that makes the link to a modal:

if ($(context).find('.node-open-modal').length > 0) {
  $(context).find('.node-open-modal').each(function () {
    $(this).attr('data-dialog-type', 'modal').addClass('use-ajax');
  });
}

The only problem is that clicking the link will cause the following error message:

SyntaxError: JSON.parse: Unexpected character in line 2, column 1 of the JSON data

Does Drupal not send valid JSON data or what?

Custom Post Types – 2 modal windows with ACF content on the archive page

I have an archive page that displays a custom post type with content entered in ACF. Each article has 2 buttons for opening a request and gallery modal. Now I've managed to make the "Inquiry" button populate, filling a dropdown with the preselected title of the post (thanks to the help of a question I asked earlier: Set default option in dropdown of WP_Query?) , Now the problem lies with the Modalgalerie. Clicking the button will not open anything. I want to open the modal gallery with the acf gallery associated with the post.

Here is the code for the article with the buttons:


Here is the code for the request modal:


    
    
    

and directly under this code is the gallery code:


    
    
    
    <div id = "open-modal-gallery-I WOULD; ?> "class =" modal-gallery ">
        
        
I WOULD); if ($ images): ?>
<img src = "http://wordpress.stackexchange.com/"alt =" http://wordpress.stackexchange.com/"/>

I assume this is because I reset the query within the request modal. However, if I reset the $ args statement outside of the request modal and the statement outside the gallery modal, nothing happens. The request still works, but the gallery Modal does not open at all.