-4

I have: 

      var lineArea = new Chartist.Line('#line-area', {
      labels: ['a', 'b', 'c', 'd'], 
~break

I have to replace the abcd with a var:

var mondays = document.getElementById('mondays').innerHTML; alert(mondays); var lineArea = new Chartist.Line('#line-area', { labels: [{mondays}], series: [ [0, 20, 10, 45, 20, 36, 21, 0], [0, 5, 22, 14, 32, 12, 28, 0] ] }, { low: 0, showArea: true, fullWidth: true, onlyInteger: true, axisY: { low: 0, scaleMinSpace: 50, }, axisX: { showGrid: false } });

However, this (and other things I've blindly tried) don't work. Actually results in [object Object] being displayed.

How do I insert a var within a var like this?

sukebe7
  • 89
  • 6
  • 1
    open devtool and see what is `mondays` – apple apple Apr 24 '19 at 13:18
  • What exactly is the value of `mondays`? – deceze Apr 24 '19 at 13:18
  • 1
    `document.getElementById('mondays').innerHTML` will be a string and `['a', 'b', 'c', 'd']` is an array. They aren't really interchangable so it is very unclear what you are trying to achieve. – Quentin Apr 24 '19 at 13:18
  • "Actually results in [object Object] being displayed." — Then lots of your code is missing. Nothing in the code you've provided will cause *anything* to be displayed. You need to provide a [mcve] and a *clear problem statement*. – Quentin Apr 24 '19 at 13:18
  • Provide the HTML of the `id=mondays` – Unamata Sanatarai Apr 24 '19 at 13:19
  • Actually, mondays is 'there' and formatted correctly. – sukebe7 Apr 24 '19 at 13:19
  • `` – sukebe7 Apr 24 '19 at 13:20
  • If anything, you want `labels: mondays.innerHTML.split(',')`, or something along those lines. – deceze Apr 24 '19 at 13:22
  • here: `var mondays = document.getElementById('mondays').innerHTML; alert(mondays); var lineArea = new Chartist.Line('#line-area', { labels: [{mondays}], series: [ [0, 20, 10, 45, 20, 36, 21, 0], [0, 5, 22, 14, 32, 12, 28, 0] ] }, { low: 0, showArea: true, fullWidth: true, onlyInteger: true, axisY: { low: 0, scaleMinSpace: 50, }, axisX: { showGrid: false } });` – sukebe7 Apr 24 '19 at 13:25
  • if I manually poke in what *is* monday, it works fine. – sukebe7 Apr 24 '19 at 13:27
  • OK, so now this has been downvoted into the gutter. Sorry, I'm not a javascript guy. I generated the the contents of the hidden div from php, formatting it exactly as would be pasted into the js. I then figured out how to get that innerHTML and got stuck there. I tried double curlies, $, brackets... – sukebe7 Apr 24 '19 at 13:36

3 Answers3

0

Don’t try and pass a string literal into an array declaration , simply generate the array by splitting a string inside of the innerHTML. This is the simplest solution, you could store encoded JSON inside the innerHTML and parse it but this seems much simpler. 

//Assume innerHTML = "a,b,c'd"
var monday = document.getElementById('mondays').innerHTML;    

//Split the string based of comma to generate an array of strings
var mondaysArr = monday.split();

//Pass in the array
var lineArea = new Chartist.Line('#line-area', mondaysArr);
Matt Drouillard
  • 199
  • 2
  • 11
0

Step by step:

  1. take inner html
  2. split on a comma
  3. remove quotes

text = document.getElementById('mondays').innerHTML
array = text.split(', ')

// !!
labels = array.map(e => e.split("'").join(""))

console.log('text', text)
console.log('array', array)

// !!
console.log('labels', labels)
<div id='mondays' style='display: none;'>'04/29', '05/06', '05/13', '05/20', '05/27', '06/03', '06/10', '06/17', '06/24'</div>
Unamata Sanatarai
  • 6,475
  • 3
  • 29
  • 51
  • sorry, this broke it. I'm too ignorant on this. I hate, what I'm assuming is, JSON because of these very quirks. But, thanks for taking a shot. – sukebe7 Apr 24 '19 at 13:37
0

I did it on my own. I'll bore you with my solution... the smoothest solution: I put the whole thing into a PHP file, since the string was generated in PHP anyway. Also, since the PHP variable that I was hiding in a div was already called '$mondays', all I had to do was this: labels: [<?php echo $mondays ?>], and it worked perfectly.

sukebe7
  • 89
  • 6
  • Note that manually formatting a string to appear like a Javascript snippet which could be copy-and-pasted into Javascript source code is *not* the way to go. `$mondays` should be *an array* containing strings, e.g. `array("04/29", ...)`, which you then format into an equivalent *Javascript array* using `json_encode`, and then directly use *as array*: `labels: = json_encode($mondays); ?>`. – deceze Apr 25 '19 at 06:53