1

I'm working on PHP and trying to pass a PHP array to a javascript code to create an attribute dynamically and set the values to it.

I've been sending the PHP array like below.

PHP Code

$dataArray = array();

array_push($dataArray, $ticket['tickets']);
array_push($dataArray, $pendingTicket['pending_tickets']);
array_push($dataArray, $closedTicket['closed_tickets']);

Following is the PHP array.

Array
(
    [0] => 4
    [1] => 3
    [2] => 1
)

JS Code

<script type="text/javascript">
   var jArray = <?php echo json_encode($dataArray); ?>;
   var ticketGraphData = [];
   for(var i=0; i<jArray.length; i++){
      ticketGraphData.push(jArray[i]);
   }

   alert(typeof ticketGraphData);
   console.log(ticketGraphData);

   var anchor1 = document.getElementById("firstGraph");
   var anchor2 = document.getElementById("secondGraph");
   var att1 = document.createAttribute("data-values");
   var att2 = document.createAttribute("data-values");

   att1.value = ticketGraphData;
   anchor1.setAttributeNode(att1);

   att2.value = ticketGraphData;
   anchor2.setAttributeNode(att2);
</script>

I want to make pass the ticketGraphData values as [4,3,1]. But here when I tried to console the data and returned an alert, it is showing Object in the alert and displayed the following data in the console.

enter image description here

After setting the data to the attribute, it is looking like,

data-values="4,3,1"

But I want to make them as,

data-values="[4,3,1]"

Where am doing mistake? Is there any other alternative to achieve this?

Aravind
  • 424
  • 3
  • 19
  • 2
    use `JSON.stringify(ticketGraphData)` before setting it – CapitanFindus May 02 '20 at 14:27
  • data-* values (and html attributes in general) are treated as strings, so when you set your arary to it the Array's toString() method is called which by default returns the elements in a comma delimited string. If you want to have it as JSON then use JSON.stringify() and set that value – Patrick Evans May 02 '20 at 14:30
  • Thanks . But it is in the form of, ```["4","3","1"]``` – Aravind May 02 '20 at 14:31
  • I want the data like this, ```[4,3,1]``` and it's data type should be an ARRAY, not STRING – Aravind May 02 '20 at 14:32
  • @Aravind Try this: `var numArr = ticketGraphData.map(el => +el)`. Then `console.log(numArr)`. – TDuong May 02 '20 at 14:50
  • @TDuong, thanks for the help. But it is not working. It is of type Object. And displaying as ```4,3,1```. How to convert this to ```[4,33,1]``` – Aravind May 02 '20 at 15:00
  • @Aravind You mean `ticketGraphData: [{"4", "3", "1"}]`? – TDuong May 02 '20 at 15:04
  • No, when I tried to append the value of ```ticketGraphData``` to an ```html tag's attribute```, it's value is being displayed as, ```data-values="["4","3","1"]"```` – Aravind May 02 '20 at 18:46
  • Arrays ARE objects in javascript (special kind of object) :-) You can read more here: https://stackoverflow.com/questions/5048371/are-javascript-arrays-primitives-strings-objects – bestprogrammerintheworld May 02 '20 at 21:48

0 Answers0