0

Помогите разобраться, есть следующий js код создающий таблицу

tableData.forEach(element => {
   let row = '<tr class="markup-table__row">'
        + ' <td class="markup-table__cell">'
        + '     <div style="cursor:pointer" class="markup-table__cell-text" onclick="getDetailsOperator()">'
        + element.operatorName
        + '     <input type="hidden" name="idOperator" value="' + element.id + '"/>'
        + '     </div>'
        + ' </td>'
})

Вопрос, как правильно написать функцию getDetailsOperator(), чтобы получить value (например вывести его через alert или console) скрытого элемента с name="idOperator", добавлять атрибут id в данном случаи нельзя.

С JS работал очень мало, опыта работы с родительскими и дочерними объектами - нет, может кто нибудь помочь?

1
  • Таким элементам можно присваивать некий класс. Всем одинаковый. :)
    – ksa
    16 фев в 12:51

2 ответа 2

2

получить value (например вывести его через alert или console) скрытого элемента с name="idOperator"

Предложу такой вариант функции getDetailsOperator()...

document.querySelector('#test').addEventListener('click', e => {
  const ot = e.target.closest('tr')
  if (!ot) return
  const val = ot.querySelector('[name="idOperator"]')?.value ?? '<тут нет такого поля>'
  console.log(val)
})

function getDetailsOperator() {
  return [...document.querySelectorAll('[name="idOperator"]')].map(o => o.value)
}
console.log(getDetailsOperator().join(', '))
<table id='test'>
  <tr class="markup-table__row">
    <td class="markup-table__cell">
      <div style="cursor:pointer" class="markup-table__cell-text" onclick="getDetailsOperator()">
        operatorName1
        <input type="hidden" name="idOperator" value="element.id1" />
      </div>
    </td>
  </tr>
  <tr class="markup-table__row">
    <td class="markup-table__cell">
      <div style="cursor:pointer" class="markup-table__cell-text" onclick="getDetailsOperator()">
        operatorName2
        <input type="hidden" name="idOperator" value="element.id2" />
      </div>
    </td>
  </tr>
</table>

3
  • Супер! Но данный код выводит все id, а как можно вывести только определённые, скажем, только те, по которым был щелчок?
    – Nikita
    16 фев в 12:32
  • @Nikita, добавил вариант по щелчку...
    – ksa
    16 фев в 12:46
  • Ага, это то, что нужно, спасибо
    – Nikita
    16 фев в 12:54
1

а как можно вывести только определённые, скажем, только те, по которым был щелчок?

for (const input of document.querySelectorAll(`[name="idOperator"]`)) {
   input.addEventListener("click", function (){
      console.log(this.value)
   })
}

При клике по полю выводит его результат. Или нужны только те, которые вообще изменялись/по ним кликали?

2
  • 1
    элемент же скрытый 16 фев в 12:48
  • Вот же блин, упустил(
    – Farsh1k3
    16 фев в 12:49

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.