how to send data to js from html

Question

I tried to send the data with data-="" to JavaScript so I using data-= like this in html

const detailInput = document.getElementsByClassName('avg');
const d = 0,
  c = 0,
  b = 0,
  a = 0;

for (let input of detailInput) {
  d = input.datasets.pentingd
  c = input.datasets.pentingc
  b = input.datasets.pentingb
  a = input.datasets.pentinga
}

<input type="hidden" class="avg" data-avgpentingd="<?php $avgPuas ?>">

but it cannot be because it says undefined is not an object. is there any solution please

It not error and I change const to var but I think still no data. is there a way to see js data? — Q With Only, Jul 04 '19 at 09:15
The attribute is `data-avgpentingd` but you refer to `input.datasets.pentingd`. If you fix it, it should work: https://jsbin.com/wevasod/edit?html,js,console — Mosh Feu, Jul 04 '19 at 09:18
Click the edit button and correct the typo to not get downvotes and come back and tell us when you have a solution to get upvotes (but then the post is probably forgotten) — , Jul 04 '19 at 09:31

score 0 · Answer 1 · answered Jul 04 '19 at 09:38

0

You should try this in your javascript:

const detailInput = document.getElementsByClassName('avg');

let pentings = array();

for (let input in detailInput) {
  pentings.push(input.dataset.penting);
}

console.table(pentings);

In your HTML do this:

<input type="hidden" class="avg" data-penting="<?php $avgPuas ?>">

You can also add multiple input tags here

answered Jul 04 '19 at 09:38

Abdulbosid

354
1
2
12

Then see the console in the Chrome's developer tools window – Abdulbosid Jul 04 '19 at 09:38

score 0 · Accepted Answer · 2019-07-04T10:50:16.760

Use let instead of const to assign a variable, otherwise it is a constant that can not be changed.
It is dataset, not datasets
You have the name avgpentingd but have missed to change pentingd
Maybe use the english word pending instead of penting?
Open the console in your browser and follow the errors. In Firefox or Chrome click the menu in upper right corner and select the tools for developers and web console. This is a must if you not have another debuger.

After the corrections and minimal change of your code it looks like this and works:

const detailInput = document.getElementsByClassName('avg');
let d = 0,
  c = 0,
  b = 0,
  a = 0;

for (let input of detailInput) {
  d = input.dataset.avgpentingd
  c = input.dataset.avgpentingc
  b = input.dataset.avgpentingb
  a = input.dataset.avgpentinga
}

console.log(d);

<input type="hidden" class="avg" data-avgpentingd="It works now">

Read about dataset here

how to send data to js from html

2 Answers2