0

This question already has an answer here:

I'm not talking about the library. That part is covered fairly extensive. What I want to do is generate the javascript based on PHP. But I can't, for example, do this:

$o = '<script> $data = [';
for ($i = 0 ; $i < 10; $i++) {
    $o .= $i.', ';
}
$o .= ']; </script>';    

$form['mainText'] = array (
        '#type' => 'markup',
        '#markup' => $o,
    );

return $form;

How am I supposed to do this correctly?

And if you are wondering, the reason I am doing this is because I want to generate javascript that is to be used to plot points on a graph.

marked as duplicate by Adrian Cid Almaguer, kenorb, DRUPWAY, kiamlaluno Oct 13 '16 at 7:13

This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.

  • My interpretation of your question is "How do I provide data/settings to my JavaScript graph plotting library?" because the code in the question is outputting a simple array/object. – mradcliffe Oct 12 '16 at 16:58
  • You can do this by writing PHP code, attaching it to the page/node/field etc hook as a drupalSetting and read it in to the JS code. Although if you are writing JS to plot points on a graph, either in real time or not, this approach (code in OP) simply won't work. – Kevin Oct 12 '16 at 17:12
  • fill drupalSettings under #attached in render array with php and process it with javascript. – user21641 Oct 13 '16 at 8:13
2

There are a number of ways you could do this. I will you tell you one.

Create a controller class that has a method that is responsible for printing an array of numbers. Hit that endpoint via a javascript get request and do something with the returned data.

So you would create a routing file:

your_module.routing.yml

your_module.create_numbers:
 path: '/your_module/{numbers}'
 defaults:
   _controller: '\your_module\Controller\YourCustomControllerClass::createNumberArray'
 requirements:
   _permission: 'access content'

YourCustomControllerClass.php

<?php 

namespace 'your_module\Controller';

class YourCustomControllerClass extends ControllerBase {

 /**
 * Return a JSON response based on the number param
 * @param $number integer The number passed into the route.
 * @returns JsonResponse
 */
 public function createNumberArray($number) {
   $numbers = [];
   for ($i = 0 ; $i < $number; $i++) {
     $numbers[] = $i;
   }
   return new JsonResponse($numbers);
 }

}

Now you can hit your route from Javascript. The cool thing about this is that your route can create dynamic arrays. If you notice in the routing file the numbers is in {}. That means it is dynamic and is passed in as an argument to the createNumbersArray method. It can then use it to create an array of any length.

your_module_graph.js

var numbers = 10;

// Note numbers can be set to whatever you want. 
var jqxhr = $.get( "/your_module/" + numbers, function(data) {
  // data will be a JSON object containing an array of numbers. 
  var parsedJson = JSON.parse(data);
  // Now do what you want with parsedJson. Build your graphs etc.
});

I haven't tested that but have done similar things a lot lately and I'm quite confident that if not that exact code, the approach in general will suit your needs. As mentioned earlier there is no one way to do this but with Symfony now a core part of Drupal 8 it really is built for doing stuff like this. That is, taking HTTP requests and returning data.

Hope that helps.

1

You should place the data into any one of php variables and then you could easily pass the php variables to javascript file if you follow this link

After the you can access the data in your javascript library.

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